qa-form-structure

Detect structural form defects that block mobile submission and input interaction.

Updated May 22, 2026
One-click install
npx skills add https://github.com/Luqman-Ud-Din/blackbox-qa-agent --skill qa-form-structure
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: qa-form-structure
Source: https://github.com/Luqman-Ud-Din/blackbox-qa-agent/tree/main/skills/qa-form-structure
Command: npx skills add https://github.com/Luqman-Ud-Din/blackbox-qa-agent --skill qa-form-structure

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill catches structural form issues that break submission flows or make inputs hard to use on mobile, such as missing form wrappers, missing visible submit actions, cramped touch targets, and inputs that are not wide enough on small screens.

Core Features & Use Cases

  • Form wrapper validation: Detects input groups with a submit button that are not wrapped in a <form>, which can break Enter-to-submit behavior and autofill.
  • Submit affordance checks: Flags forms that have no visible submit, save, update, add, or similar action button.
  • Mobile usability checks: Finds inputs shorter than the 44px touch-target minimum and fields that fail to expand to full width on mobile.
  • Custom select accessibility check: Identifies hidden native selects replaced by custom dropdowns without the expected ARIA attributes.
  • Use case: A QA engineer can run this skill on a responsive checkout or registration page and quickly surface the structural problems most likely to frustrate users and block completion.

Quick Start

Run this skill on any page with forms to identify structural and mobile-friendly input issues.

Frequently Asked Questions about qa-form-structure

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

FAQPage Schema
How do I check if my responsive web form has mobile usability issues?

To validate form structure for reliable submission, check that input groups with submit buttons are wrapped in a <form> tag and that a visible submit affordance exists. This ensures Enter-to-submit behavior and autofill work correctly.

How do I validate form structure to prevent broken submission flows?

To validate form structure for reliable submission, check that input groups with submit buttons are wrapped in a <form> tag and that a visible submit affordance exists. This ensures Enter-to-submit behavior and autofill work correctly.

Why does my custom dropdown select fail accessibility checks on mobile?

QA form structure checks detect missing form wrappers, absent visible submit buttons, touch targets under 44px, non-full-width mobile fields, and custom selects missing ARIA attributes. This surfaces structural defects before users encounter them.

What structural defects cause forms to break on mobile and tablet viewports?

QA form structure checks detect missing form wrappers, absent visible submit buttons, touch targets under 44px, non-full-width mobile fields, and custom selects missing ARIA attributes. This surfaces structural defects before users encounter them.

Does this form QA tool work on checkout and registration pages with card-based layouts?

Yes, this form QA tool works on checkout and registration pages with card-based action layouts. It applies to responsive web pages containing text fields, selects, dialogs, and card-based layouts across mobile and tablet viewports.

What happens if my form has no visible submit, save, or update button?

If a form has no visible submit, save, update, or add action button, it gets flagged during structural validation. Missing visible submit affordances prevent users from completing the form submission flow reliably.