🎭 @shopby/playwright

Shopby에서 커스터마이징한 Playwright 테스트 자동화 도구입니다.

소개

@shopby/playwright는 Microsoft의 Playwright를 기반으로 Shopby 서비스에 최적화된 테스트 자동화 도구입니다. 웹 브라우저 자동화를 위한 강력한 기능을 제공하면서도 Shopby의 특화된 요구사항을 지원합니다.

설치 방법

# npm을 통한 설치
npm install @shopby/playwright

# yarn을 통한 설치
yarn add @shopby/playwright

주요 특징

• Shopby UI에 최적화된 코드 생성기 및 인스펙터
• 쇼핑몰 테스트를 위한 확장 기능
• 크로스 브라우저 테스트 지원 (Chrome, Firefox, Safari)
• 안정적인 테스트 실행을 위한 자동 대기 기능

사용 방법

코드 생성기 사용하기

npx shopby-playwright --name=sample codegen https://sample.shopby.co.kr

테스트 작성 예시

// tests/example.spec.js
const { test, expect } = require('@shopby/playwright');

test('sample', async ({ page }) => {
  // 쇼핑몰 메인 페이지 접속
  await page.goto('https://sample.shopby.co.kr');
  
  // 상품 검색
  await page.fill('input[name="keyword"]', '티셔츠');
  await page.press('input[name="keyword"]', 'Enter');

  // 검색 결과 확인
  await expect(page.locator('.search-result-item')).toHaveCount({ min: 1 });
  
  // 상품 상세 페이지 이동
  await page.click('.search-result-item:first-child');
  
  // 장바구니 담기
  await page.click('button:has-text("장바구니")');
  
  // 장바구니 페이지에서 상품 확인
  await page.click('.cart-icon');
  await expect(page.locator('.cart-item')).toBeVisible();
});

테스트 실행

npx shopby-playwright test