skills.rest
Luqman-Ud-Din
Luqman-Ud-DinCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

qa-detect-viewport-parity

Compare interactive elements across desktop and mobile viewports to detect missing features.

Updated May 22, 2026
Search Tags:#cross-browser#responsive testing#feature regression#dom inventory#viewport parity#mobile audit
One-click install
npx skills add https://github.com/Luqman-Ud-Din/blackbox-qa-agent --skill qa-detect-viewport-parity
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: qa-detect-viewport-parity
Source: https://github.com/Luqman-Ud-Din/blackbox-qa-agent/tree/main/skills/qa-detect-viewport-parity
Command: npx skills add https://github.com/Luqman-Ud-Din/blackbox-qa-agent --skill qa-detect-viewport-parity

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill finds cases where a site looks responsive but silently loses functionality on mobile or tablet, such as table columns, primary actions, or navigation destinations that exist on desktop but are no longer reachable on smaller viewports.

Core Features & Use Cases

  • Cross-viewport comparison: Compares interactive elements between mobile/tablet and desktop within the same page session.
  • Drawer-aware inventory: Opens and re-checks mobile navigation menus so relocated items are not mistaken for missing features.
  • Actionable defect reporting: Flags missing columns, buttons, fields, and other interactive items with labels that make responsive regressions easy to triage.

Quick Start

Use the qa-detect-viewport-parity skill to check whether any desktop-only features are missing on the current mobile or tablet page.

Frequently Asked Questions about qa-detect-viewport-parity

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I detect responsive feature regressions where interactive elements disappear on mobile?▼

Responsive feature regressions occur when interactive elements like navigation or forms exist on desktop but vanish on mobile. Cross-viewport comparison identifies these losses by inventorying DOM elements across breakpoints and classifying missing features for triage.

What is viewport parity testing and when do I need it for cross-browser checks?▼

Viewport parity testing verifies that pages maintain identical interactive functionality across mobile, tablet, and desktop breakpoints. It is needed for viewport-sensitive pages with drawers, menus, and tables where features may silently relocate or vanish during responsive layout shifts.

How do I audit a mobile page for missing navigation items without false positives from drawers?▼

Mobile audits prevent false positives by opening drawer-aware navigation menus before re-checking DOM inventory. This ensures relocated items are correctly classified as moved rather than mistaken for missing features during responsive regression detection.

Can I use DOM inventory comparison to find table columns missing on tablet viewports?▼

DOM inventory comparison detects missing table columns on tablet viewports by establishing a stable baseline of interactive elements on desktop, then resizing the viewport and flagging any columns, buttons, or fields that are no longer reachable.

What is the best way to classify missing features during a responsive mobile audit?▼

The best way to classify missing features during a responsive mobile audit is to compare interactive element inventories across viewports, flag missing columns and buttons with labels, and escalate ambiguous secondary items for manual review.

Why does my site look responsive but lose functionality on smaller viewports?▼

Sites look responsive but lose functionality when viewport-sensitive elements like primary actions or navigation destinations are dropped during breakpoint transitions. Cross-viewport DOM inventory comparison catches these silent regressions by flagging unreachable interactive items.

Related Skills

Explore More Software Engineering Skills→
Luqman-Ud-DinLuqman-Ud-Din

qa-detect-fluid-sweep

Detect responsive layout overflow across non-standard viewport widths.

Community
Advanced
JollyhrothgarJollyhrothgar
1

github-project

Coordinate GitHub issues, milestones, labels, PRs, and releases via gh CLI.

Community
Advanced
cbemistercbemister

mobile-patterns

Automate mobile navigation patterns and responsive grid layouts for UI projects.

Community
Intermediate
krzemienskikrzemienski
2

responsive-validation

Validate responsive UI layouts across device viewports and breakpoints.

Community
Advanced