Skip to content

fix: recognise aria-braillelabel and aria-brailleroledescription as known ARIA attributes - #18765

Merged
dummdidumm merged 1 commit into
sveltejs:mainfrom
giaBaoJS:fix/aria-braille-attributes
Sep 3, 2026
Merged

dummdidumm merged 1 commit into
sveltejs:mainfrom
giaBaoJS:fix/aria-braille-attributes

Conversation

@giaBaoJS

@giaBaoJS giaBaoJS commented Sep 3, 2026

Copy link
Copy Markdown
Contributor

Before submitting the PR, please make sure you do the following

  • It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs (no existing issue found; this is a self contained one line data fix)
  • Prefix your PR title with feat:, fix:, chore:, or docs:.
  • This message body should clearly illustrate what problems it solves.
  • Ideally, include a test that fails without this PR but passes with it.
  • If this PR changes code within packages/svelte/src, add a changeset (npx changeset).

Tests and linting

  • Run the tests with pnpm test and lint the project with pnpm lint

What breaks

aria-braillelabel and aria-brailleroledescription are valid ARIA attributes, but the compiler reports them as unknown:

<button aria-braillelabel="***">
	<img alt="3 out of 5 stars" src="three_stars.png" />
</button>
a11y_unknown_aria_attribute: Unknown aria attribute 'aria-braillelabel'

The only workaround is <!-- svelte-ignore a11y_unknown_aria_attribute -->, which also suppresses genuine typos on the same element.

Where

The known ARIA attribute names are hand maintained as a space separated string in packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y/constants.js:6, and the warning is raised in packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y/index.js:120:

const type = name.slice(5);
if (!aria_attributes.includes(type)) {
	const match = fuzzymatch(type, aria_attributes);
	w.a11y_unknown_aria_attribute(attribute, type, match);
}

The normative rule

Both attributes are defined in Accessible Rich Internet Applications (WAI-ARIA) 1.3, W3C Working Draft 04 June 2026, section 6.8 "Definitions of States and Properties (all aria-* attributes)".

aria-braillelabel (property):

Defines a string value that labels the current element, which is intended to be converted into Braille. See related aria-label.

aria-brailleroledescription (property):

Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille. See related aria-roledescription.

Both are also documented on MDN (aria-braillelabel, aria-brailleroledescription) and shipped in browsers.

Why the current code contradicts it

The list is a strict subset of the ARIA 1.3 state and property set: these two names are the only ones missing, so the compiler calls a spec defined attribute "unknown".

Two further points that make this a plain omission rather than a deliberate exclusion:

  1. The same function already disagrees with itself. A few lines below the unknown attribute check, a11y/index.js validates the attribute value against aria from aria-query, and aria-query@5.3.1 does define both attributes:

    $ node -e "const {aria}=require('aria-query'); console.log(aria.get('aria-braillelabel'))"
    { type: 'string' }
    

    So Svelte type checks the value of aria-braillelabel correctly while simultaneously warning that the attribute does not exist. Diffing the two sources:

    in aria-query, NOT in svelte: [ 'braillelabel', 'brailleroledescription' ]
    in svelte, NOT in aria-query: []
    
  2. The list already targets ARIA 1.3. description is in the list and, like the braille attributes, does not exist in WAI-ARIA 1.2; it was added by [fix] Adds aria-description to aria_attributes - #7301 #7302 for exactly this reason. This PR is the same fix for the two attributes that were introduced alongside it.

How I proved it

Extended the existing a11y-aria-props validator sample, which is the fixture that covers this warning:

<input type="image" aria-labeledby="foo">
<div aria-braillelabel="foo" aria-brailleroledescription="bar"></div>

warnings.json is unchanged, so the sample now asserts that the two braille attributes produce no warning while the neighbouring typo still does.

Counterfactual, with only the source change reverted and the test left in place:

FAIL  packages/svelte/tests/validator/test.ts > a11y-aria-props
AssertionError: expected [ { ...(4) }, { ...(4) }, { ...(4) }, ...(1) ] to deeply equal [ { ...(4) }, { ...(4) } ]

+   {
+     "code": "a11y_unknown_aria_attribute",
+     "message": "Unknown aria attribute 'aria-braillelabel'",
+   },
+   {
+     "code": "a11y_unknown_aria_attribute",
+     "message": "Unknown aria attribute 'aria-brailleroledescription'",
+   },

With the fix restored the sample passes again.

Full checks on this branch:

  • pnpm test: Test Files 34 passed (34), Tests 7769 passed | 55 skipped (7824)
  • pnpm check in packages/svelte: clean
  • pnpm lint (eslint + prettier --check .): clean

@pkg-svelte-dev

pkg-svelte-dev Bot commented Sep 3, 2026

Copy link
Copy Markdown

Install the latest version of svelte from 7aedc2a:

pnpm add https://pkg.svelte.dev/svelte/c/7aedc2ace3087f39fc1125806d218969e920f75f

Open in pkg.svelte.dev: https://pkg.svelte.dev/repos/svelte/pr/18765

Note

This PR is from a fork. A maintainer must approve approve each commit before it can be built and installed.

@changeset-bot

changeset-bot Bot commented Sep 3, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 7aedc2a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
svelte Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@coderabbitai

coderabbitai Bot commented Sep 3, 2026 •

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: QUIET

Plan: Advanced

Run ID: d0c8c7b6-bc67-4fe3-8e71-4adc7f2a7e58

📥 Commits

Reviewing files that changed from the base of the PR and between 4bf15ae and 7aedc2a.

📒 Files selected for processing (3)
  • .changeset/wild-cases-smile.md
  • packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y/constants.js
  • packages/svelte/tests/validator/samples/a11y-aria-props/input.svelte

Included review availability: Your plan provides up to 10 included reviews per hour; 9 remain after this review.


📝 Walkthrough

Walkthrough

The compiler now recognises aria-braillelabel and aria-brailleroledescription as known ARIA attributes. The accessibility validator sample includes both attributes on a <div>. A Svelte patch changeset records the update.

Merge Risk: ⚪ Minimal · up to 7aedc

This change recognizes two valid Braille ARIA attributes and adds validator coverage for them. No current merge-blocking risk remains.

🚥 Pre-merge checks | ✅ 4
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly and concisely states the primary change: recognising two valid ARIA attributes.
Description check ✅ Passed The description directly explains the compiler warning, the code change, the test coverage, and the validation results.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Comment @coderabbitai help to get the list of available commands.

@dummdidumm
dummdidumm merged commit 5895c63 into sveltejs:main Sep 3, 2026
12 of 13 checks passed
@github-actions github-actions Bot mentioned this pull request Sep 3, 2026
Rich-Harris pushed a commit that referenced this pull request Sep 18, 2026
This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## svelte@5.57.1

### Patch Changes

- fix: cancel deferred event listeners during cleanup
([#18749](#18749))

- fix: preserve global CSS in components without scopable elements
([#18793](#18793))

- fix: reduce SSR render result garbage collection
([#18798](#18798))

- fix: resolve the fallback of an each block in the enclosing scope
([#18803](#18803))

- perf: speed up parser interactions with Acorn or avoid them where
possible ([#18740](#18740))

- fix: prevent effect tree of batches from interfering with each other
([#18508](#18508))

- fix: serialize input default values during server rendering
([#18733](#18733))

- fix: remove `WAS_MARKED` flag in favor of `Set`
([#18127](#18127))

- fix: throw `set_context_after_init` when `setContext` is called after
an `await` during SSR
([#18739](#18739))

- fix: make Object.hasOwn reactive for state proxy ownership changes
([#18838](#18838))

- fix: keep `$state.eager` when used as a variable initializer
([#18809](#18809))

- perf: avoid regex matching in parser where possible
([#18736](#18736))

- fix: in non-async mode, only push variable to current_sources when
active_reaction is updating
([#18550](#18550))

- fix: recognise `aria-braillelabel` and `aria-brailleroledescription`
as known ARIA attributes
([#18765](#18765))

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
dadezzz pushed a commit to dadezzz/events-cash-register that referenced this pull request Sep 23, 2026
This PR contains the following updates:

| Package | Change | [Age](https://docs.renovatebot.com/merge-confidence/) | [Confidence](https://docs.renovatebot.com/merge-confidence/) |
|---|---|---|---|
| [svelte](https://svelte.dev) ([source](https://github.com/sveltejs/svelte/tree/HEAD/packages/svelte)) | [`5.57.0` → `5.57.1`](https://renovatebot.com/diffs/npm/svelte/5.57.0/5.57.1) | ![age](https://developer.mend.io/api/mc/badges/age/npm/svelte/5.57.1?slim=true) | ![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/svelte/5.57.0/5.57.1?slim=true) |

---

### Release Notes

<details>
<summary>sveltejs/svelte (svelte)</summary>

### [`v5.57.1`](https://github.com/sveltejs/svelte/blob/HEAD/packages/svelte/CHANGELOG.md#5571)

[Compare Source](https://github.com/sveltejs/svelte/compare/svelte@5.57.0...svelte@5.57.1)

##### Patch Changes

- fix: cancel deferred event listeners during cleanup ([#&#8203;18749](sveltejs/svelte#18749))

- fix: preserve global CSS in components without scopable elements ([#&#8203;18793](sveltejs/svelte#18793))

- fix: reduce SSR render result garbage collection ([#&#8203;18798](sveltejs/svelte#18798))

- fix: resolve the fallback of an each block in the enclosing scope ([#&#8203;18803](sveltejs/svelte#18803))

- perf: speed up parser interactions with Acorn or avoid them where possible ([#&#8203;18740](sveltejs/svelte#18740))

- fix: prevent effect tree of batches from interfering with each other ([#&#8203;18508](sveltejs/svelte#18508))

- fix: serialize input default values during server rendering ([#&#8203;18733](sveltejs/svelte#18733))

- fix: remove `WAS_MARKED` flag in favor of `Set` ([#&#8203;18127](sveltejs/svelte#18127))

- fix: throw `set_context_after_init` when `setContext` is called after an `await` during SSR ([#&#8203;18739](sveltejs/svelte#18739))

- fix: make Object.hasOwn reactive for state proxy ownership changes ([#&#8203;18838](sveltejs/svelte#18838))

- fix: keep `$state.eager` when used as a variable initializer ([#&#8203;18809](sveltejs/svelte#18809))

- perf: avoid regex matching in parser where possible ([#&#8203;18736](sveltejs/svelte#18736))

- fix: in non-async mode, only push variable to current\_sources when active\_reaction is updating ([#&#8203;18550](sveltejs/svelte#18550))

- fix: recognise `aria-braillelabel` and `aria-brailleroledescription` as known ARIA attributes ([#&#8203;18765](sveltejs/svelte#18765))

</details>

---

### Configuration

📅 **Schedule**: (UTC)

- Branch creation
  - At any time (no schedule defined)
- Automerge
  - At any time (no schedule defined)

🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about this update again.

---

 - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box

---

This PR has been generated by [Mend Renovate CLI](https://github.com/renovatebot/renovate).
<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0NC4xMDQuMiIsInVwZGF0ZWRJblZlciI6IjQ0LjEwOS4xIiwidGFyZ2V0QnJhbmNoIjoibWFpbiIsImxhYmVscyI6W119-->
renovate Bot added a commit to cigaleapp/cigale that referenced this pull request Oct 5, 2026
##### [v5.57.1](https://github.com/sveltejs/svelte/blob/HEAD/packages/svelte/CHANGELOG.md#5571)

##### Patch Changes

- fix: cancel deferred event listeners during cleanup ([#18749](sveltejs/svelte#18749))

- fix: preserve global CSS in components without scopable elements ([#18793](sveltejs/svelte#18793))

- fix: reduce SSR render result garbage collection ([#18798](sveltejs/svelte#18798))

- fix: resolve the fallback of an each block in the enclosing scope ([#18803](sveltejs/svelte#18803))

- perf: speed up parser interactions with Acorn or avoid them where possible ([#18740](sveltejs/svelte#18740))

- fix: prevent effect tree of batches from interfering with each other ([#18508](sveltejs/svelte#18508))

- fix: serialize input default values during server rendering ([#18733](sveltejs/svelte#18733))

- fix: remove `WAS_MARKED` flag in favor of `Set` ([#18127](sveltejs/svelte#18127))

- fix: throw `set_context_after_init` when `setContext` is called after an `await` during SSR ([#18739](sveltejs/svelte#18739))

- fix: make Object.hasOwn reactive for state proxy ownership changes ([#18838](sveltejs/svelte#18838))

- fix: keep `$state.eager` when used as a variable initializer ([#18809](sveltejs/svelte#18809))

- perf: avoid regex matching in parser where possible ([#18736](sveltejs/svelte#18736))

- fix: in non-async mode, only push variable to current\_sources when active\_reaction is updating ([#18550](sveltejs/svelte#18550))

- fix: recognise `aria-braillelabel` and `aria-brailleroledescription` as known ARIA attributes ([#18765](sveltejs/svelte#18765))
renovate Bot added a commit to cigaleapp/cigale that referenced this pull request Oct 5, 2026
##### [v5.57.1](https://github.com/sveltejs/svelte/blob/HEAD/packages/svelte/CHANGELOG.md#5571)

##### Patch Changes

- fix: cancel deferred event listeners during cleanup ([#18749](sveltejs/svelte#18749))

- fix: preserve global CSS in components without scopable elements ([#18793](sveltejs/svelte#18793))

- fix: reduce SSR render result garbage collection ([#18798](sveltejs/svelte#18798))

- fix: resolve the fallback of an each block in the enclosing scope ([#18803](sveltejs/svelte#18803))

- perf: speed up parser interactions with Acorn or avoid them where possible ([#18740](sveltejs/svelte#18740))

- fix: prevent effect tree of batches from interfering with each other ([#18508](sveltejs/svelte#18508))

- fix: serialize input default values during server rendering ([#18733](sveltejs/svelte#18733))

- fix: remove `WAS_MARKED` flag in favor of `Set` ([#18127](sveltejs/svelte#18127))

- fix: throw `set_context_after_init` when `setContext` is called after an `await` during SSR ([#18739](sveltejs/svelte#18739))

- fix: make Object.hasOwn reactive for state proxy ownership changes ([#18838](sveltejs/svelte#18838))

- fix: keep `$state.eager` when used as a variable initializer ([#18809](sveltejs/svelte#18809))

- perf: avoid regex matching in parser where possible ([#18736](sveltejs/svelte#18736))

- fix: in non-async mode, only push variable to current\_sources when active\_reaction is updating ([#18550](sveltejs/svelte#18550))

- fix: recognise `aria-braillelabel` and `aria-brailleroledescription` as known ARIA attributes ([#18765](sveltejs/svelte#18765))
renovate Bot added a commit to cigaleapp/cigale that referenced this pull request Oct 5, 2026
##### [v5.57.1](https://github.com/sveltejs/svelte/blob/HEAD/packages/svelte/CHANGELOG.md#5571)

##### Patch Changes

- fix: cancel deferred event listeners during cleanup ([#18749](sveltejs/svelte#18749))

- fix: preserve global CSS in components without scopable elements ([#18793](sveltejs/svelte#18793))

- fix: reduce SSR render result garbage collection ([#18798](sveltejs/svelte#18798))

- fix: resolve the fallback of an each block in the enclosing scope ([#18803](sveltejs/svelte#18803))

- perf: speed up parser interactions with Acorn or avoid them where possible ([#18740](sveltejs/svelte#18740))

- fix: prevent effect tree of batches from interfering with each other ([#18508](sveltejs/svelte#18508))

- fix: serialize input default values during server rendering ([#18733](sveltejs/svelte#18733))

- fix: remove `WAS_MARKED` flag in favor of `Set` ([#18127](sveltejs/svelte#18127))

- fix: throw `set_context_after_init` when `setContext` is called after an `await` during SSR ([#18739](sveltejs/svelte#18739))

- fix: make Object.hasOwn reactive for state proxy ownership changes ([#18838](sveltejs/svelte#18838))

- fix: keep `$state.eager` when used as a variable initializer ([#18809](sveltejs/svelte#18809))

- perf: avoid regex matching in parser where possible ([#18736](sveltejs/svelte#18736))

- fix: in non-async mode, only push variable to current\_sources when active\_reaction is updating ([#18550](sveltejs/svelte#18550))

- fix: recognise `aria-braillelabel` and `aria-brailleroledescription` as known ARIA attributes ([#18765](sveltejs/svelte#18765))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants