QA Note Tutorial | QA Note

QA NoteTutorial

01API 500 Error

BeginnerTeam Invite Form

BeginnerE-commerce Product Card

03Unhandled Promise

IntermediateDashboard Analytics Chart

04Network Timeout

IntermediateIssue List Search

05Missing Validation

BeginnerProfile Settings Form

06Infinite Re-render

AdvancedReal-time Notification Panel

IntermediateCheckout Address Autocomplete

08z-index Conflict

IntermediateDatePicker in Modal

09CLS Layout Shift

AdvancedNews Article

10Accessibility Violation

AdvancedMulti-step Sign Up

08z-index Conflict — DatePicker in Modal

8/10

1

Click the "Add Milestone" button

A modal will open.

Click the "Due Date" input field

Notice the calendar is hidden behind the modal

Capture with the extension

Captured Data

• Element Styles: modal z-index: 50, DatePicker z-index: 40
• React Tree: Modal > Form > DatePicker hierarchy
• User Actions: button click → modal → date field click

P

ProjectLab

Project Timeline

Manage milestones.

MVP Launch

2024-04-15

Complete

Beta Testing

2024-05-20

In Progress

Official Launch

2024-06-30

Planned

Previous Next Scenario

QA Note Tutorial | QA Note