test-fe: Playwright 설정

[github-actions]

목적

Playwright를 도입하고, 프로젝트에 맞게 설정합니다.

작업 세부사항

• playwright 설치
• reporter 설정
  • html
  • list
  • custom reporter(slack 메세지 전송)

참고 사항

• @id:ms-playwright.playwright 로 검색하면 Playwright VS Code extension을 설치할 수 있습니다.
• reporter는 어떤 게 가장 유용할지 써보면서 판단해야 할 것 같아 html, list 모두 활성화시켰습니다.
• 로컬 실행 결과를 slack에 보내려면 두 가지 작업을 해주세요.
  • Slack Webhook url을 환경변수로 추가해줘야 합니다. 값은 notion에 공유했습니다.
  • 설정을 아래와 같이 변경합니다.

// playwright.config.ts
export default defineConfig({
  testDir: './e2e',
  fullyParallel: true,

  reporter: [['./e2e/slack-reporter.ts'], ['html'], ['list']], // 이 코드의 주석을 풀어주세요.
  // reporter: [['html'], ['list']],

실행하면 아래와 같이 보내집니다! 메세지 내용은 피드백 주세요.

closes #714

[github-actions]

1727254469.875139

[github-actions]

1727254472.774679

[github-actions]

1727254476.189639

[github-actions]

1727254478.999739

[lurgi]

slack reporter 구우욷👍

[seongjinme]

렛서 고생하셨습니다. 덕분에 Playwright라는 새로운 도구를 접했네요. 찬찬히 들여다보고 테스트도 구상해 보겠습니다 🙏

[seongjinme]

슬랙 연동 아주 좋습니다 👍