QA Note튜토리얼
시나리오 목록
01API 500 에러
초급팀 멤버 초대 폼
02CSS 오버플로
초급이커머스 상품 카드
03Unhandled Promise
중급대시보드 분석 차트
04네트워크 타임아웃
중급이슈 목록 검색
05유효성 검사 누락
초급프로필 설정 폼
06무한 리렌더링
고급실시간 알림 패널
07CORS 에러
중급결제 주소 자동완성
08z-index 충돌
중급모달 내 DatePicker
09CLS 레이아웃 시프트
고급뉴스 아티클
10접근성 위반
고급멀티스텝 회원가입
QA Note·인터랙티브 튜토리얼

웹 QA 시나리오 10선

실제 웹 앱에서 발생하는 대표적인 버그 10가지를 직접 재현하고, QA Note 익스텐션으로 에이전트가 바로 착수할 수 있는 정확한 접수 기록을 만드는 방법을 배워보세요.

초급중급고급
초급
#01

API 500 에러

팀 멤버 초대 폼

서버 오류 응답을 캡처하고 네트워크 탭에서 확인하는 법을 배웁니다.

Network 에러콘솔 로그
초급
#02

CSS 오버플로

이커머스 상품 카드

CSS 레이아웃 문제를 요소 스타일 캡처로 진단하는 법을 배웁니다.

Element StylesReact 트리
중급
#03

Unhandled Promise

대시보드 분석 차트

API 200이지만 실제론 실패하는 케이스를 JS 에러 캡처로 잡는 법을 배웁니다.

JS 에러Stack TraceNetwork
중급
#04

네트워크 타임아웃

이슈 목록 검색

타임아웃 에러와 성능 메트릭을 캡처하는 법을 배웁니다.

타임아웃PerformanceNetwork
초급
#05

유효성 검사 누락

프로필 설정 폼

에러 없는 버그를 사용자 액션과 React state로 증명하는 법을 배웁니다.

User ActionsReact State
고급
#06

무한 리렌더링

실시간 알림 패널

React 무한 루프를 성능 메트릭과 에러 캡처로 진단하는 법을 배웁니다.

React 성능PerformanceJS 에러
중급
#07

CORS 에러

결제 주소 자동완성

CORS 에러를 네트워크+콘솔+JS 에러 동시 캡처로 잡는 법을 배웁니다.

CORSNetwork콘솔JS 에러
중급
#08

z-index 충돌

모달 내 DatePicker

z-index 레이어 충돌을 요소 스타일 비교로 진단하는 법을 배웁니다.

Element Stylesz-indexReact 트리
고급
#09

CLS 레이아웃 시프트

뉴스 아티클

이미지 레이아웃 시프트를 Web Vitals 캡처로 측정하는 법을 배웁니다.

Web VitalsCLSPerformance
고급
#10

접근성 위반

멀티스텝 회원가입

키보드 접근성 위반을 User Actions 분석으로 발견하는 법을 배웁니다.

User Actions키보드Element Styles