Files
Gnuboard7/modules/_bundled/sirsoft-ecommerce/tests/Playwright
HeuJung b07d6c8953 fix(ecommerce,tosspayments,templates): 에스크로 표시 누락·결제수단 전환 시 입력 잔류 수정
- 에스크로 표시가 영구히 렌더되지 않던 문제: 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 을 받도록 중첩 스펙을 맞춘다.
2026-08-06 13:58:00 +09:00
..

이커머스 모듈 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)