playwright(Ch2)

화면 UI

시나리오1.

• 로그인실패시 "아이디 또는 비밀번호가 틀렸습니다." 라는 메시지가 출력이 되는가

시나리오2.

• 로그인 성공시 url이 /home으로 이동이 되는가

Test코드

시나리오 1.

test('로그인 실패 테스트케이스', async ({ page }) => {
  await page.goto('/login');

  // 입력 필드에 ID와 비밀번호 입력
  await page.getByRole('textbox', { name: '아이디' }).fill('qwer');
  await page.getByRole('textbox', { name: '비밀번호' }).fill('qwer');

  // 로그인 버튼 클릭
  await page.getByRole('button', { name: '로그인' }).click();

  // 오류 메시지 확인
  await expect(
    page.getByText('아이디 또는 비밀번호가 틀렸습니다')
  ).toBeVisible();
});

시나리오 2.

test('로그인 ', async ({ page }) => {
  await page.goto('/login');

  // 입력 필드에 ID와 비밀번호 입력
  await page.getByRole('textbox', { name: '아이디' }).fill('admin');
  await page.getByRole('textbox', { name: '비밀번호' }).fill('1234');

  // 로그인 버튼 클릭
  await page.getByRole('button', { name: '로그인' }).click();
  await expect(page).toHaveURL('/home');
});

실행화면 및 결과

• yarn playwright test
• yarn playwright show-report

모바일 or 데스크톱 분리 테스트케이스 추가

test.skip() 을통해 환경별로 테스트케이스 분리가 가능합니다

폴더 분리 후 상단

test.skip(({ isMobile }) => !isMobile, '모바일용 테스트입니다.');

-- 결과 --