Upload Forge
📞850-378-1191
fForm tests
📞850-378-1191

WhatConverts Inspector: form playground

Each numbered case names its intentional issue and the expected result. All values are dummy data.

  1. Paste this HTML into a test page outside any existing form, and allow its inline script to run.
  2. Open Forms & Iframes and choose Inspect all, or inspect one form.
  3. Review each warning, select fixes, and copy the combined snippet. .
  4. Wait two seconds, then click Inspect again. An updated valid pattern remains available for neutral review.
  5. Reload the page to restore the original problems.

Demo submissions stay on this page and show a message below. On a page with live WhatConverts tracking, clicks or submissions may still be recorded.

Ready. No demo submission yet.

A. Individual field issues + alternate submit

Inspector form ID: wc-demo-fields. These cases have labels/names except where a naming problem is intentional.

1. Missing WhatConverts field label

Contact preference

Expect a labeling issue. Enter “Contact preference” in the inspector and include its label fix.

2. aria-labelledby only

Preferred contact time

Expect the specific “Only aria-labelledby found” warning. This field has an accessible label, but lacks the naming sources the inspector checks for WhatConverts.

3. Hidden data field

The actual input is invisible. Its ID is wc-demo-hidden-data.

Expect a hidden-field warning and a conversion checkbox. The fix should change type to text, apply display:none, and preserve its value.

4. Hidden system field

Expect “Hidden system/security field” with no conversion checkbox. This dummy field should stay hidden.

5. aria-required without native required

Expect a required-field mismatch with Keep required / Make optional choices. Leave it empty initially.

6. required class without native required

Expect the class-based required-field mismatch. Selecting one fix should uncheck the other.

7. Current answer fails the pattern

Expect “Pattern mismatch” and browser-blocks-first guidance. A replacement of [A-Z0-9]{5} accepts this dummy answer. You can also test removing the restriction.

8. Invalid regex

Expect “Invalid pattern”. Try [A-Z]{3} as the replacement. Selecting Update with an empty or invalid replacement should disable copying.

9. Empty pattern attribute

Expect a pattern issue: an empty pattern rejects non-empty answers. Try [A-Za-z]+ or remove the pattern.

10. Pattern on an unsupported input type

Expect “Pattern validation risk”: native pattern validation does not apply to number inputs. Test copying the removal fix.

11. Pattern on a readonly field

Expect a pattern validation risk because this control is excluded from native validation. The inspector should mention readonly/disabled controls.

12. Healthy pattern for comparison

Expect “Pattern restriction (review)” and a matching-answer note. This should not add a pattern error.

13. Intentionally ignored field

Ignored test input

No naming warning should be offered for this field, despite its missing label/name. It may still receive an inspection outline.

14. Position-based selector fallback

Unidentified detail

Expect a labeling issue plus the position-based selector warning. Enter a label and verify the copied fix targets this input.

15. Alternate submit made from a link

Send demo form

Expect “Possible alternate submit” for this link, setting-first instructions, its unique ID, and a checkbox to add wc_submit. This link uses requestSubmit; native invalid fields above will block it until corrected.

B. novalidate on the form

Expect a browser-validation-bypassed warning, a required-field mismatch, and a pattern mismatch with silent-loss guidance. Clicking the button should reach the local demo handler despite these invalid answers. No generated fix should remove novalidate.

C. formnovalidate on a submit button

Expect validation-bypass guidance and future pattern-risk guidance even though the code currently matches. Normal validation blocks the empty required answer; Bypass validation reaches the local handler.

D. Every checkbox option marked required

Choose a service (intended rule: one choice)

Expect one possible checkbox-group issue. Checking only one option still blocks submission. The approved group fix removes required from all three options; it does not enforce “at least one”.

E. Form with no supported tracking attributes

Expect NO TRACKABLE ATTRIBUTES and copyable code to add an ID, class, or name to this form. The field itself should have no warning.

F. Working control form

Expect no form-issue warning for this form. Its connected label, name, real required attribute, valid email, form ID, and native submit button are all present. Clear the email to test native required validation.

G. Control points to a missing form

Expect a separate “Unmatched form reference” entry. This input is intentionally outside all forms.

H. Iframe inspection

The first iframe is accessible: expect its inner form and aria-required mismatch to be detected. Install any generated inner-form fix inside that iframe's document.

The second iframe is sandboxed: expect an iframe access/configuration warning and iframe targeting snippets, with no inner-form inspection. It loads no external site.

I. Phone-change observation

(202) 555-0100

Start the inspector first, then click Swap demo number. Tracking & DNI should show the observed before/after pair and matching visible/click-to-call numbers. This is a local DOM change, not a real WhatConverts number swap.