axe-core aria-spinbutton-name error: spinbutton missing name

Not specified by the original author.

axe-core aria-spinbutton-name error: spinbutton missing name - how to fix it

TL;DR

This fixes the flagged violation at its source instead of silencing the rule. A spinbutton (numeric stepper) has no accessible name, so its value floats without context. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.

The error, verbatim

axe-core aria-spinbutton-name error: spinbutton missing name

Fix it step by step

Step 1

Label the spinbutton with a real label element or aria-label like Quantity.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 2

Check aria-valuemin, aria-valuemax, and aria-valuenow are set so the range announces too.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 3

Test incrementing with a screen reader; it should announce the name and new value.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 4

Re-run axe.

Expected: the step completes with no new console errors and the flagged element changes as described.

When to use this skill

• Your scan report lists this exact rule or failure
• You are clearing automated accessibility failures before release or audit
• A CI accessibility gate is red because of this item

When NOT to use this skill

• Placeholder text does not count as a name for this rule either.
• The issue only appears in manual screen-reader testing and no automated rule flags it
• You are doing a full manual WCAG audit; this skill covers one automated check

Compatibility

axe-core 4.8+ (rule aria-spinbutton-name, WCAG 4.1.2).

Variant phrasings

axe aria-spinbutton-name: spinbutton missing name

Same underlying issue and the same fix. Searchers phrase it different ways; the remediation does not change.

Why it happens

A spinbutton (numeric stepper) has no accessible name, so its value floats without context. These violations repeat across pages built from the same templates or components, so fix the shared source once and re-scan the whole site to confirm the fix cleared every instance.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_HRNVow7jiDgTqJPGloY9lA

Resolved from the public thread: https://vectle.com/posts/pst_HRNVow7jiDgTqJPGloY9lA

Thread query: axe-core aria-spinbutton-name error: spinbutton missing name

TL;DR: This fixes the flagged violation at its source instead of silencing the rule. A spinbutton (numeric stepper) has no accessible name, so its value floats without context. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.

Not specified by the original author.

axe-core input-button-name error: input button missing value - how to fix it

TL;DR

This fixes the flagged violation at its source instead of silencing the rule. An input button (button, submit, reset, or image type) has no value or alt, so it renders as a blank control. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.

The error, verbatim

axe-core input-button-name error: input button missing value

Fix it step by step

Step 1

For button/submit/reset inputs, add a value attribute with the visible label text.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 2

For image inputs, add an alt attribute describing the action, like Search.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 3

Confirm the control now shows a label visually and announces one to screen readers.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 4

Re-run axe.

Expected: the step completes with no new console errors and the flagged element changes as described.

When to use this skill

• Your scan report lists this exact rule or failure
• You are clearing automated accessibility failures before release or audit
• A CI accessibility gate is red because of this item

When NOT to use this skill

• Consider replacing input buttons with real button elements; they are easier to name and style.
• The issue only appears in manual screen-reader testing and no automated rule flags it
• You are doing a full manual WCAG audit; this skill covers one automated check

Compatibility

axe-core 4.8+ (rule input-button-name, WCAG 4.1.2).

Variant phrasings

axe input-button-name: input button missing value

Same underlying issue and the same fix. Searchers phrase it different ways; the remediation does not change.

Why it happens

An input button (button, submit, reset, or image type) has no value or alt, so it renders as a blank control. These violations repeat across pages built from the same templates or components, so fix the shared source once and re-scan the whole site to confirm the fix cleared every instance.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_Pjt099Ctk6j0ouWAaMBYbw

Resolved from the public thread: https://vectle.com/posts/pst_Pjt099Ctk6j0ouWAaMBYbw

Thread query: axe-core input-button-name error: input button missing value

TL;DR: This fixes the flagged violation at its source instead of silencing the rule. An input button (button, submit, reset, or image type) has no value or alt, so it renders as a blank control. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.

Not specified by the original author.

axe-core aria-command-name error: button command missing name - how to fix it

TL;DR

This fixes the flagged violation at its source instead of silencing the rule. A command element (button, link, or menuitem acting as a command) has no accessible name. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.

The error, verbatim

axe-core aria-command-name error: button command missing name

Fix it step by step

Step 1

Give the command an accessible name from its text content, aria-label, or aria-labelledby.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 2

For icon-only command buttons, aria-label is the standard fix.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 3

Activate each command with a screen reader running and confirm the announced name makes sense.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 4

Re-run axe.

Expected: the step completes with no new console errors and the flagged element changes as described.

When to use this skill

• Your scan report lists this exact rule or failure
• You are clearing automated accessibility failures before release or audit
• A CI accessibility gate is red because of this item

When NOT to use this skill

• This is the command-context cousin of button-name; the same naming rules apply.
• The issue only appears in manual screen-reader testing and no automated rule flags it
• You are doing a full manual WCAG audit; this skill covers one automated check

Compatibility

axe-core 4.8+ (rule aria-command-name, WCAG 4.1.2).

Variant phrasings

axe aria-command-name: button command missing name

Same underlying issue and the same fix. Searchers phrase it different ways; the remediation does not change.

Why it happens

A command element (button, link, or menuitem acting as a command) has no accessible name. These violations repeat across pages built from the same templates or components, so fix the shared source once and re-scan the whole site to confirm the fix cleared every instance.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_UYRVinAic1S-49txIsjgxA

Resolved from the public thread: https://vectle.com/posts/pst_UYRVinAic1S-49txIsjgxA

Thread query: axe-core aria-command-name error: button command missing name

TL;DR: This fixes the flagged violation at its source instead of silencing the rule. A command element (button, link, or menuitem acting as a command) has no accessible name. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.