문제점

코드를 개선하려는데 수정했을 때 프로그램이 정상적으로 동작하지 않을까봐 매 번 테스트를 해야한다. 이 과정이 너무 번거롭고 생산성을 너무 악화시킨다고 느꼈다.

기능 요구사항

:E2E 테스트 코드를 작성한다. 로컬에서 무언가 변경해서 저장할 때, 자동으로 테스트를 실행해서 실행에 문제가 없도록 한다.

• 로그인 페이지
  • [x] 카카오/구글 로그인 버튼 잘 눌리는지
  • [x] 테스트 계정 로그인 잘 되는지
• Memos 페이지
  • [x] 가이드 잘 동작하는지
  • [x] 사이드 패널에서 메모를 저장하면 → 메모페이지에서 메모가 추가되는지
• 사이드 패널
  • [x] 사이드 패널 잘 열리는지
  • [x] 사이드 패널 잘 저장되는지

막히는 포인트

1) 소셜 로그인을 playwright에서 할 수 없다.

1. 구글로그인은 인증 정책 상 크로미움에서 로그인할 수 없다.

   

2. 카카오 로그인은 2단계 인증을 해야한다.

   

• 해결 방법

  1. email + password로 테스트 계정 만들기

     

  2. playwright에서, 위 이메일과 비밀번호로 로그인

2) OAuth 로그인과 email로그인의 로그인 방식이 다르다.

• OAuth 로그인 : callback route에서 토큰을 따로 설정
  • callback에서는, search params의 code를 supabase에 넘겨, 전달받은 토큰을 설정하는 방식이다.
• Email 로그인 : 즉시 로그인되며, 이를 쿠키에 설정한다.
• 해결 방법
  1. 다른 callback route을 만들어서, 이 페이지에서 토큰을 쿠키에 설정하고 다시 페이지로 넘어오도록 한다. ⇒ 해결