Install Extension

Install from Chrome Web Store

1. Search for QA Note in the Chrome Web Store.
2. Click the Add to Chrome button to install.
3. The QA Note icon will appear in your browser toolbar.

Browser Support

The QA Note Extension works in Chromium-based browsers such as Chrome, Edge, and Naver Whale.

Safari cannot install Chrome Web Store extensions directly, so customer reporters can use the Create issue on the web form on /reporter/issues to submit basic issues. Use the Extension in a Chromium-based browser when you need screen annotations, session replay, and automatic environment metadata.

Login

The Extension supports email/password login and Google OAuth login.

1. Click the QA Note icon in the toolbar.
2. Click the Login button to open the login popup.
3. Log in with your email/password or Google account.
4. Once login is complete, the popup will close automatically and the Extension will be connected.

Data Collection Consent

After your first login, a Data Collection Consent screen will be displayed. If you agree, technical metadata collection features like console logs and network requests will be enabled.

During this process, Chrome will request the <all_urls> permission. Granting it allows you to use all QA Note features on every site. Basic screenshot capture works even if you decline.

Select Organization & Project

After logging in, from the Extension popup:

1. Select your Organization (if you belong to multiple).
2. Select a Project.
3. Issues will be submitted to the selected project.

Capture Trigger Methods

The Extension offers three ways to start a capture:

• Popup Button — Click the toolbar icon, then select the capture button
• Keyboard Shortcut — Cmd+Shift+X (Mac) / Ctrl+Shift+X (Windows)
• Context Menu — Right-click on the page and select the QA Note menu

You can also enable a Floating Button or Side Tab that appears on the page from the project settings.

Key Features

• Screenshot Capture — Drag to select an area and capture it. Up to 5 screenshots can be attached.
• Annotation — 10 tools available: arrow, box, circle, text, number marker, pen, highlight, blur, and crop.
• Session Replay — Supports manual recording (up to 60 seconds) and Instant Replay (automatically buffers the last 2 minutes).
• Console Logs — Automatically collects console.error, console.warn, and console.log output (last 100 entries).
• Network Logs — Records HTTP requests/responses. Sensitive information (auth tokens, cookies, etc.) is automatically masked.
• React Component Tree — For React apps, automatically collects component hierarchy and props/state.
• Performance Metrics — Captures Web Vitals including LCP, FCP, CLS, INP, TTFB, and resource loading times.
• Element Style Inspection — Select specific DOM elements to attach CSS properties and layout information (up to 5 elements).