QA

로그인 페이지

• 로그인 동작
• 로고 클릭 시 메인 페이지 이동
• 회원가입하기 버튼 클릭 시 회원가입 페이지로 이동
• 비밀번호 틀릴 경우 '비밀번호가 일치하지 않습니다.' 에러 메세지 노출
• 비밀번호 노출 체크 박스 체크 시 비밀번호 보여짐
• 이메일 형식에 맞지 않은 상태에서 input 박스를 벗어나면 에러 메세지 노출
• 자동완성 기능 동작 시 버튼 enabled
• 비밀번호 길이가 8자 미만일 때 에러메세지 노출
• 로그인 성공시 accessToken, refreshToken 발급
• 네이버 로그인 동작
• 구글 로그인 동작
• 카카오 로그인 동작
• 토스트 출력

회원가입 페이지

• 일반 회원가입 동작
• 네이버 회원가입 동작
• 구글 회원가입 동작
• 카카오 회원가입 동작
• 이메일 에러 메세지 동작 - 이메일 형식(특수문자 불가 및 . 뒤로 글자 제한)
• 닉네임 에러 메세지 동작 - 닉네임 10자리 이하 제한
• 비밀번호 에러 메세지 동작 - 비밀번호 8자리 이하 제한
• 비밀번호 확인 에러 메세지 동작 - 비밀번호 불일치 오류
• 존재하는 이메일의 경우 - 중복된 이메일 에러 메시지 동작
• 버튼 비활성화, 활성화
• 회원가입 버튼 연속 클릭 제한
• 소셜로그인 시 토스트 보이기

메인 페이지

• 비로그인 상태에서 메인페이지 로그인 접근 가능

• 잘못된 URL을 입력 후 접근했을 경우 404 페이지 보여주기

• 태블릿 화면에서 진행해보기

• 모바일 화면에서 진행해보기

• 배너 이미지

  • 배너 이미지 4초마다 자동으로 넘어가기
  • 배너 이미지 hover 했을 때 자동 넘기기 기능 작동 X
  • 배너 이미지 왼쪽, 오른쪽 화살표 버튼으로 이동
  • 배너 이미지 왼쪽, 오른쪽 화살표 버튼 hover 시 강조 효과
  • 체험 등록하기 버튼 클릭 시 체험 등록하기 페이지로 이동

• 검색창

  • 검색창에 text 입력 후 Enter 또는 검색하기 버튼 누를 시 검색 결과 나타내기
  • 최신 검색어 결과 제거
  • 검색 결과가 없을 경우 검색 결과 없음 보여주기
  • 검색 결과 있을 경우 X

• 인기체험

  • 최대 10개의 카드로 캐러셀로 동작
  • 왼쪽, 오른쪽 화살표 버튼 동작
  • 화살표 버튼 맨 처음과 맨 끝에서 disabled 되는지 확인
  • 인기체험 data prefetch되는지 확인

• 페이지네이션 버튼 동작

  • 1번 클릭 시 왼쪽 화살표 disabled
  • 마지막 번호 클릭 시 오른쪽 화살표 disabled
  • 선택된 카테고리가 있을 경우에 페이지네이션 동작

• 가격 필터 동작

  • 선택된 카테고리가 있을 때 동작
  • 페이지네이션 동작

• 카테고리 동작

  • 선택된 카테고리 외의 카테고리 클릭 시 카테고리 변경
  • 선택된 카테고리 클릭 시 카테고리 제거 -> 모든 체험으로 Title 변경
  • 카테고리 클릭 시 가격 필터 최신순으로 변경

체험 상세 페이지

• 헤더

• 체험을 올린 유저에게만 수정하기/삭제하기 케밥 버튼 보여짐

• 체험 올리지 않은 유저는 케밥 버튼 보이지 않기

• 배너 이미지만 있는 경우 => 하나만 가운데에

• 배너 이미지 + 서브 이미지 있는 경우 => 서브 이미지 하나면 화면 꽉차게

• 메인 콘텐츠

• 체험 설명에 줄바꿈 잘 먹는지

• 화면 첫 로딩 시 지도 잘 보이는지

• 예약하기 컴포넌트

• 오늘 날짜, 현재 시각 기준 지나버린 날짜와 시간대는 보여주지 않기

• pc에서 선택한 시간이 tablet에서 모달을 띄웠을 때도 초기값으로 보여지는지

• 모달에서 "선택하기"를 누르지 않고 모달을 닫으면 선택한 시간을 보여주는 버튼이 이전 값으로 유지되는지

• 각 날짜에 맞는 시간대가 보여지는지

• 예약 성공 시 예약 내역 페이지로 이동 잘 되는지

• 예약 실패 시 기존 값 유지

• 반응형에 따라 UI가 알맞게 잘 달라지는지

• 데스크탑에서 날짜, 시간 선택 후 태블릿으로 window width로 줄이고 날짜, 시간 누른 후 선택 버튼 누르지 않고 다시 데스크탑 width에서 태블릿에서 누른 날짜, 시간으로 선택되어 있는 현상 수정

• 리뷰 페이지네이션

• 이전 페이지 버튼 클릭 시 이후 페이지 데이터 prefetching 되는지

• 페이지네이션 캐싱이 잘 되고 있는지

• 리뷰 작성 시 적용한 줄바꿈이 잘 반영이 되는지

내 정보 페이지

• 닉네임 수정 - 수정 시 Navbar도 같이 변경
• 프로필 이미지 수정 - 수정 시 Navbar도 같이 변경
• 소셜로그인한 경우 이메일 인풋에 로그인한 소셜 상태 보여짐
• 닉네임, 프로필 동시 수정
• 비밀번호 8자 이하 오류 메세지 출력
• 비밀번호 변경되는지 확인
• 비밀번호와 비밀번호 확인 다를 시 오류 메세지 출력
• 수정 완료 토스트 출력
• 사이드바에서 내 정보 페이지 이동

예약 내역 페이지

• 각 예약 상태 따른 필터링 기능
• 각 예약 상태에 해당하는 데이터가 없는 경우 NoData 컴포넌트 보여주기
• 무한 스크롤 잘 작동하는지
• 각 카드 클릭 시 예약 상세 페이지로 이동
• 예약 취소 시 상태값이 잘 바뀌는지
• 후기 작성 시 상태값이 잘 바뀌는지
• 모바일 반응형 확인
• 태블릿 반응형 확인

예약 상세 페이지

• 예약 상세 내용이 이전 페이지와 일치
• 제목 클릭 시 해당 체험 상세 페이지로 이동
• 지도 위치 확인
• 예약 상태에 따라 각각 다른 UI
  • 예약 신청
    • 예약 신청 단계 (파란색)
    • 예약 취소 버튼 생성
    • 예약 취소 후 예약 상태 변경
    • 예약 취소 토스트 출력
  • 예약 승인
    • 예약 승인 단계 (파란색)
  • 체험 완료
    • 체험 완료 단계 (파란색)
    • 후기 작성 이전: 후기 작성 버튼 초록색
    • 후기 작성 완료 후 후기 작성 버튼 disabled
  • 예약 거절
    • 예약 거절 상태만 보이기 (빨간색)
  • 예약 취소
    • 예약 취소 상태만 보이기 (회색)
  • 예약 내역 페이지 거치지 않고 돌아왔을 경우 404 페이지 대신 예약 내역 페이지로 리다이렉트

후기 작성

• 별점과 내용이 모두 있을 때에만 업로드 가능
• 리뷰 작성 완료 토스트 보이기

내 체험 관리 페이지

• 체험 클릭 시 체험 상세로 이동
• 프로필 박스 active 확인
• 프로필 박스에서 눌러서 이동되는지 확인
• 프로필 눌러서 드롭다운에서 눌러서 이동되는 지 확인
• 로그아웃 해보기
• 케밥 버튼 클릭
  • 수정하기 클릭
  • 삭제하기 클릭
  • 삭제되는지 확인
• 화면 아래로 내려서 무한 스크롤 확인
• 별점과 리뷰 개수 확인
• 타이틀 길어지면 ... 되는 지 확인
• 가격 맞는 지 확인
• 체험 없을 때 화면 확인
• 체험 등록하기 확인
• 로그아웃 상태로 /mypage/activities 들어왔을 경우 확인
• 수정했을 경우 카드 바뀌는 지 확인
• 삭제했을 경우 카드 바뀌는 지 확인
• 등록했을 경우 카드 바뀌는 지 확인
• 테블릿 화면에서 진행해 보기
• 모바일 화면에서 진행해 보기

내 체험 등록 페이지

• 소개 이미지 빼고 다 작성 후 한 가지씩 비우고 버튼 비활성화 되는 지 확인
• 프로필 눌러서 드롭다운에서 내 체험 등록 클릭해서 들어와 지는 지 확인
• 프로필 박스 active 확인
• 프로필 박스에서 눌러서 이동되는 지 확인
• 로그아웃 해보기
• 설명 줄 바꿈 적용 되는지 확인
• 가격 자리 수 10개 이상 됐을 때 오류 뜨는 지 확인
• 나머지 다 채워져 있고 가격 0일 때 버튼 비활성화 되는 지 확인
• 지도 검색해보기
• 지도 클릭해서 주소 적용되는 지 확인
• 예약 날짜 현재 시간보다 빠르게 넣어서 오류 뜨는 지 확인
• 예약 추가, 삭제 되는 지 확인
• 배너 이미지 1개 넣어보기, 지워보기
• 소개 이미지 4개 넣어보기, 지워보기
• 테블릿 화면에서 진행해 보기
• 모바일 화면에서 진행해 보기
• 체험 등록 해보기

내 체험 수정 페이지

• 작성된 필드 하나씩 빈칸으로 만들어 보고 버튼 비활성화 되는 지 확인
• 프로필 박스 active 확인
• 프로필 박스에서 내 체험 관리에 호버했을 경우 내 체험 수정 사라지는 지 확인
• 필드 하나씩 수정해 보고 적용 되는 지 확인
• 지난 예약 시간대 - 버튼 없어졌는 지 확인
• 존재하는 예약 시간 빼고 적용됐는 지 확인
• 예약 시간 추가해 보고 적용됐는 지 확인
• 배너 이미지 바꿔보기
• 소개 이미지 삭제하고 수정하면 사라졌는 지 확인
• 소개 이미지 추가하고 수정하면 추가됐는 지 확인
• 테블릿 화면에서 진행해 보기
• 모바일 화면에서 진행해 보기
• 체험 수정 해보기

예약 현황 페이지

• 비로그인 상태에서는 접근 불가

• 예약 현황이 없을 경우 데이터 없음 화면 출력

• 예약 현황 드랍다운 무한스크롤 동작

• 예약 현황 캘린더 달 이동 버튼 동작

• 예약 현황 캘린더 완료만 있는 날짜는 클릭 시 변화 X

• 캘린더에 승인 또는 예약 상태가 있는 날짜는 클릭 시 모달 열기

• 태블릿 화면에서 진행해보기

• 모바일 화면에서 진행해보기

• 예약 현황 모달

  • 예약 시간대 별로 신청 / 승인 / 거절 탭과 밑의 예약 현황 리스트 다르게 보여주기
  • 예약 현황 리스트는 무한스크롤로 동작
  • 승인 클릭 시 나머지 예약들은 모두 거절로 상태 변화
  • 승인된 예약의 시간이 현재 시간 기준으로 지나면 완료 상태로 변경
  • 태블릿 화면에서 진행해보기
  • 모바일 화면에서 진행해보기

Navbar

• 로그인 안 한 상태에서는 로그인/회원가입 보여지기
• 로그인 시 프로필이랑 닉네임 보여짐
• 프로필 클릭 시 메뉴박스 보여짐
• 태블릿 반응형 확인
• 모바일 반응형 확인

알림

• 알림이 있는 경우 빨간 버튼 보여짐
• 무한스크롤
• 승인, 거절 상태에 따라 버튼 색상 보여짐
• 알림 연속 삭제 시 에러 안 보임
• 알림 삭제
• 태블릿 반응형 확인
• 모바일 반응형 확인