Turn one screenshot into a reproducible issue, hand it to the coding agent you already use, then keep the human-verified result as a report.
Four connected steps turn a client report into developer work, human verification, and a record you can share.
Mark the problem in the extension and submit the screen with its reproduction environment and error context.
Send the issue URL to MCP-connected Claude Code or Cursor, or copy one complete prompt before connecting MCP.
Review commit and deployment evidence, then let a signed-in person mark the actual result verified.
Combine the resolution timeline and commits in plain language, then publish a human-edited draft.
These are the evidence and record types currently supported. Expand Technical specs on each card for library, size, and retention details.
Automatically records visual evidence.
Capture a selected area, then annotate with pen, arrows, and text.
Up to 5 images · Konva canvas
Records DOM changes with rrweb to reproduce exact interactions.
Up to 60s · gzip compressed
Maintains a continuous recording buffer on allowed domains. Submit the 'just before' segment instantly when a bug occurs.
120s buffer · 10K events · auto overload detection
Issues being written are automatically saved locally. Recover screenshots, replays, and form data even after refresh or accidental close.
2s debounce · 24h TTL · graceful fallback on overflow
View recently submitted issues right in the popup and jump to the dashboard issue detail with one click.
Last 20 · priority · relative time
Records the exact environment where the bug occurred.
Identifies browser type and version.
navigator.userAgent
Records OS platform information.
navigator.platform
Records the browser window's width and height in pixels.
innerWidth × innerHeight
Records the display density ratio for Retina and HiDPI displays.
devicePixelRatio
Records the URL and title of the page where the bug occurred.
Captures the CSS selector, tag, and text of the last clicked element.
css-selector-generator
Intercepts and records runtime data from the page.
Intercepts console.log, warn, error and stores the most recent 100 entries.
Buffer 200 · Return 100
Intercepts fetch and XHR to record status codes, duration, headers, and error response bodies.
Up to 50 · 13 sensitive headers auto-masked
Traverses the React Fiber tree to capture component names, props, state, and hooks.
Depth 10 · Nodes 50 · Hooks 20
Tracks user actions right before the bug occurred.
Records clicks, inputs, navigation, scrolling, and special key presses.
Up to 30 · password auto-masking
Captures the box model, typography, layout, and parent/sibling spacing of selected elements.
Up to 5 elements · computed style
Records the moments you flag as 'this is the bug' during capture as markers on the action timeline.
Linked to the action timeline
Catches errors that don't even show in the console.
Records message, file, line, column, and stack trace for all JS errors caught by window.onerror.
Up to 50 · stack 2000 chars
Separately captures async errors from unhandledrejection events.
Turns 'it's slow' reports into quantitative data.
Observes the 5 key performance metrics — LCP, FCP, CLS, INP, TTFB — in real time.
PerformanceObserver
Records the full timeline from DNS → TCP → TLS → Request → Response → DOM Parse → Load.
PerformanceNavigationTiming
Records loading time and transfer size for the 10 slowest resources.
PerformanceResourceTiming
Detects tasks blocking the main thread for 50ms+. Essential for analyzing UI freezes.
Up to 30
Records the size and target elements of individual layout shifts contributing to CLS.
Up to 20 · includes element selectors
Records JS heap memory usage, total allocation, and limits. Useful for detecting memory leaks.
performance.memory
Collects system context needed for bug reproduction.
Records OS/browser settings including dark mode, reduced motion, high contrast, and forced colors.
4 matchMedia queries
Records browser language list, timezone name, and UTC offset. Essential for i18n bug reproduction.
navigator.languages · Intl
Records connection type (4G/3G), downlink bandwidth, RTT, and data saver mode.
navigator.connection
Records GPU vendor and model name. Used for rendering-related bug analysis.
WEBGL_debug_renderer_info
Records the browser's current zoom ratio.
chrome.tabs.getZoom()
Auto-detects React, Vue, Angular, Svelte, jQuery, Next.js, and Nuxt with version info.
Global variable detection
Records src, sandbox attributes, and cross-origin status for all iframes on the page.
Up to 20
Records the scope, state (active/waiting/installing), and script URL of registered Service Workers.
Checks support for 10 major web APIs including WebGL, WebRTC, WASM, WebSocket, and Workers.
Records family, weight, and loading status (loaded/failed) for each web font.
Up to 30 · document.fonts
Records Content-Security-Policy meta tag content. For analyzing feature blocks caused by security policies.
Tracks page state changes and navigation.
Tracks pushState, replaceState, and popstate to record SPA internal navigation history.
Up to 30
Records when the tab switches between foreground and background. Useful for background-tab bugs.
Up to 20
Records when the browser window gains or loses focus.
Up to 20
Records total usage and quota for IndexedDB, Cache Storage, etc. Content is never collected.
navigator.storage.estimate()
Opt-in sensitive data capture. Masking is handled client-side via a single SSoT.
Captures key-values from localStorage, sessionStorage, and cookies. 14+13+14 sensitive fields (passwords, auth headers, tokens) are auto-masked.
opt-in · 2KB/key · MCP get_storage
Serializes the page DOM as outerHTML at issue time. script, input value, and data-* sensitive attributes are stripped client-side.
opt-in · gzip compressed · MCP get_dom_snapshot
Developers stay in the tools they already use — the record keeps itself.
One issue URL delivers screenshots, console, network, and repro steps to Claude Code · Cursor, with progress written back to QA Note automatically.
resolve_by_url · one-click OAuth
Before MCP is set up, copy the full issue context as a single prompt and paste it into any AI tool.
Put the issue key (QANOTE-12) in your commit message and the fix submission is recorded automatically. Works without any AI tool.
push webhook · per-issue commit links
Correlates deploy events with commits, surfacing only deploy-confirmed issues as 'ready to verify'.
Records that never change after publishing — the basis for billing and client reporting.
Received → In progress → Fix submitted → Verified → Reported (+Blocked). Separates fix submitted (agent) from verified (human).
Only a signed-in person can mark an issue verified. Designed not to trust the agent's self-report.
Publishes plain-language summaries per issue with resolution timelines and commit links. Humans edit the draft before publishing.
public link · print-friendly
Published reports are frozen as snapshots. Corrections ship as new versions with full history.
Input fields are masked during replay, auth headers are auto-removed, and cookie/storage snapshots are collected only with explicit project and user opt-in.
14 sensitive parameters, 13 headers, and 14 body fields in network logs are automatically filtered.
Get started for free. No credit card required — it takes 2 minutes.