- 에스크로 표시가 영구히 렌더되지 않던 문제: is_escrow 가 DB·모델·부분취소 차단 로직에는 있으나 OrderPaymentResource 가 내보내지 않아, 이 값을 참조하는 주문 상세(관리자·구매자)의 에스크로 행이 항상 false 로 평가됐다. Resource 에 노출한다. - 결제수단을 바꿔도 이전 수단의 입력이 주문에 실리던 문제: 결제수단 버튼이 _local.paymentMethod 만 바꾸고 슬롯이 소유한 확장 페이로드·환불계좌는 비우지 않았다. 확장 슬롯과 환불계좌 블록은 결제수단 조건부로 언마운트되지만 _local 값은 남으므로, 무통장에서 현금영수증·환불계좌를 입력한 뒤 카드로 전환하면 그 값이 주문 생성 요청에 그대로 실렸다. 프론트는 결제수단 전환 시 슬롯 소유 상태를 초기화하고, 서버는 환불계좌가 쓰이지 않는 결제수단이면 저장하지 않도록 게이팅한다(현금영수증은 이미 dbank 게이트 보유). - Modal 이 받지 않는 size prop 을 쓰던 4곳을 width 로 교체(무시되어 의도한 폭이 나오지 않았다). 토스 에러 모달의 setState target 을 params 안으로 옮긴다. - 레이아웃 편집기 팔레트에서 체크박스를 넣으면 라벨 없이 네모 칸만 놓이던 문제: Checkbox 는 label prop 을 렌더하지 않으므로 Label 래핑 + Span 텍스트로 바꾸고, Accordion 이 Label 을 받도록 중첩 스펙을 맞춘다.
이커머스 모듈 Playwright E2E (sample skeleton)
본 디렉토리는 이커머스 모듈이 자체 E2E spec 을 추가하기 위한 sample skeleton 이다.
현재 모든 spec 은 test.skip 으로 비활성화 되어 있으며, 모듈 작업 세션에서 활성화한다.
디렉토리 구조
modules/_bundled/sirsoft-ecommerce/
├── src/Console/Commands/
│ └── PlaywrightSeedEcommerce.php (도메인 시드 커맨드 — stub, LogicException)
└── tests/Playwright/
├── playwright.config.ts (모듈 자체 config — testDir=./specs)
├── fixtures/
│ ├── ecommerce-auth.ts (모듈 권한 토큰 fixture)
│ └── ecommerce-seed.ts (도메인 시드 fixture)
├── specs/
│ └── admin/
│ └── ecommerce-settings-menu.spec.ts (placeholder — test.skip)
└── README.md (본 문서)
데이터 생성 위치 분리 (CRITICAL)
E2E spec 이 "특정 유저 + 특정 역할 + 특정 도메인 상황" 에서 동작하려면 백엔드 데이터 생성 코드가 필요하다. 그 코드는 데이터를 소유한 영역에 위치해야 한다 — 기존 G7 의 Seeder/Factory 분리 원칙과 동일.
| 데이터 종류 | 위치 |
|---|---|
코어 권한 (core.*), 역할, 유저, Sanctum 토큰 |
코어 app/Console/Commands/PlaywrightIssueToken.php |
모듈 권한 (sirsoft-ecommerce.*) |
코어 커맨드의 --permissions= 임의 식별자 (Permission::firstOrCreate 자동 생성) |
| 모듈 도메인 데이터 (상품/카테고리/주문/배송지) | 본 모듈 src/Console/Commands/PlaywrightSeedEcommerce.php |
| 외부 의존 데이터 (토스 결제창 응답 등) | spec 안에서 page.route() mock |
핵심 원칙: 코어는 모듈 도메인을 모른다. 모듈 도메인 시드 커맨드를 코어에 두면 코어 ↔ 모듈 의존이 뒤집힘.
활성화 절차
1. PlaywrightSeedEcommerce 본문 구현
src/Console/Commands/PlaywrightSeedEcommerce.php 의 throw new \LogicException(...) 부분을
실제 시드 로직으로 교체:
$categoryIds = Category::factory()->count((int) $this->option('categories'))->create()->pluck('id')->toArray();
$productIds = Product::factory()
->count((int) $this->option('products'))
->state(fn () => ['category_id' => $categoryIds[array_rand($categoryIds)]])
->create()
->pluck('id')
->toArray();
$orderIds = Order::factory()->count((int) $this->option('orders'))->create()->pluck('id')->toArray();
$payload = ['productIds' => $productIds, 'categoryIds' => $categoryIds, 'orderIds' => $orderIds];
if ($this->option('json')) {
$this->line(json_encode($payload));
} else {
$this->info(sprintf('시드 완료 — products:%d, categories:%d, orders:%d', count($productIds), count($categoryIds), count($orderIds)));
}
return self::SUCCESS;
2. 사전 testid 보강
templates/sirsoft-admin_basic 사이드바 메뉴 컴포넌트:
<a data-testid="admin-menu-ecommerce-settings" href="/admin/ecommerce/settings">...</a>
이커머스 환경설정 폼 컴포넌트:
<form data-testid="ecommerce-settings-form">...</form>
3. spec 의 test.skip 제거
specs/admin/ecommerce-settings-menu.spec.ts 의 test.describe.skip(...) → test.describe(...).
4. 모듈 자체 실행
cd modules/_bundled/sirsoft-ecommerce
$env:PLAYWRIGHT_BASE_URL='https://g7.dev'
npx playwright test
또는 모듈 package.json 에 script 추가:
"test:e2e": "playwright test --config=tests/Playwright/playwright.config.ts"
토스페이먼츠 결제 spec (외부 의존 시나리오)
토스페이먼츠 플러그인 결제 흐름은 외부 도메인(js.tosspayments.com) 의존 — mock-first 전략 필수.
// 토스 SDK 호출 가로채기 — 결제창 띄우지 않고 즉시 success callback URL 로 redirect
await page.route('https://js.tosspayments.com/**', route => route.fulfill({
contentType: 'application/javascript',
body: `
window.TossPayments = () => ({
requestPayment: async (method, params) => {
window.location.href = params.successUrl
+ '?paymentKey=test_pk_xxx&orderId=' + params.orderId + '&amount=' + params.amount;
}
});
`,
}));
// 토스 confirm API mock — 가맹점 측 callback 흐름만 검증
await page.route('https://api.tosspayments.com/v1/payments/confirm', route => route.fulfill({
status: 200, contentType: 'application/json',
body: JSON.stringify({
paymentKey: 'test_pk_xxx', orderId: 'order_001', status: 'DONE',
method: '카드', totalAmount: 10000, approvedAt: new Date().toISOString(),
}),
}));
분기별 가맹점 측 처리(주문 상태 전환, 재고 차감, 알림 발송 등) 가 정확한지 검증. 실 카드 결제 자동화는 권장하지 않음 — 수동 검증.
참고
- 코어 가이드:
tests/Playwright/README.md - 시나리오 매니페스트 매핑:
tests/scenarios/*.yaml↔ spec describe.parallel + matrix 배열 - 코어 fixture:
tests/Playwright/fixtures/auth.ts(issueToken,authenticatePage)