Skip to content
Merged
Show file tree
Hide file tree
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/shiny-chicken-occur.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': patch
---

fix: missing title warning for buttons and anchor tags
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@ Coding for the keyboard is important for users with physical disabilities who ca
### a11y_consider_explicit_label

```
Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute
Buttons and links should either contain text or have an `aria-label`, `aria-labelledby` or `title` attribute
```

### a11y_distracting_elements
Expand Down
2 changes: 1 addition & 1 deletion packages/svelte/messages/compile-warnings/a11y.md
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ Coding for the keyboard is important for users with physical disabilities who ca

## a11y_consider_explicit_label

> Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute
> Buttons and links should either contain text or have an `aria-label`, `aria-labelledby` or `title` attribute

## a11y_distracting_elements

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -382,7 +382,10 @@ export function check_element(node, context) {
}

// element-specific checks
const is_labelled = attribute_map.has('aria-label') || attribute_map.has('aria-labelledby');
const is_labelled =
attribute_map.has('aria-label') ||
attribute_map.has('aria-labelledby') ||
attribute_map.has('title');

switch (node.name) {
case 'a':
Expand Down
4 changes: 2 additions & 2 deletions packages/svelte/src/compiler/warnings.js
Original file line number Diff line number Diff line change
Expand Up @@ -174,11 +174,11 @@ export function a11y_click_events_have_key_events(node) {
}

/**
* Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute
* Buttons and links should either contain text or have an `aria-label`, `aria-labelledby` or `title` attribute
* @param {null | NodeLike} node
*/
export function a11y_consider_explicit_label(node) {
w(node, 'a11y_consider_explicit_label', `Buttons and links should either contain text or have an \`aria-label\` or \`aria-labelledby\` attribute\nhttps://svelte.dev/e/a11y_consider_explicit_label`);
w(node, 'a11y_consider_explicit_label', `Buttons and links should either contain text or have an \`aria-label\`, \`aria-labelledby\` or \`title\` attribute\nhttps://svelte.dev/e/a11y_consider_explicit_label`);
}

/**
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
[
{
"code": "a11y_consider_explicit_label",
"message": "Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute",
"message": "Buttons and links should either contain text or have an `aria-label`, `aria-labelledby` or `title` attribute",
"start": {
"line": 1,
"column": 0
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@
<button aria-label="Valid empty button"></button>
<a href="/#" aria-label="Valid empty link"></a>

<button title="Valid empty button"></button>
<a href="/#" title="Valid empty link"></a>

<button aria-hidden='true'></button>
<button inert></button>
<a href="/#" aria-hidden='true'><b></b></a>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
[
{
"code": "a11y_consider_explicit_label",
"message": "Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute",
"message": "Buttons and links should either contain text or have an `aria-label`, `aria-labelledby` or `title` attribute",
"start": {
"line": 1,
"column": 0
Expand All @@ -13,7 +13,7 @@
},
{
"code": "a11y_consider_explicit_label",
"message": "Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute",
"message": "Buttons and links should either contain text or have an `aria-label`, `aria-labelledby` or `title` attribute",
"start": {
"line": 2,
"column": 0
Expand Down
Loading