Skip to content

Commit

Permalink
use correct attribute checked
Browse files Browse the repository at this point in the history
  • Loading branch information
dinesh-58 authored Oct 28, 2024
1 parent f178afd commit bde0196
Show file tree
Hide file tree
Showing 2 changed files with 3 additions and 13 deletions.
14 changes: 2 additions & 12 deletions .changeset/brown-rocks-ring.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,5 @@
---
'astro': major
'astro': patch
---

add `checked` to htmlBooleanAttributes.

Previously, `checked={true}` returned `checked="true"`, which is considered [invalid](https://html.spec.whatwg.org/#boolean-attributes).
Now, this should return `checked` only.
Note: Falsy values would omit the attribute, which is correct behavior.

You'll only need to edit your existing code if you are checking the `checked` attribute's value to be the string `'true'` like so:
```js
- el.getAttribute('checked') === 'true'
+ el.hasAttribute('checked')
```
add `checked` to htmlBooleanAttributes.
2 changes: 1 addition & 1 deletion packages/astro/src/runtime/server/render/util.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { HTMLString, markHTMLString } from '../escape.js';
export const voidElementNames =
/^(area|base|br|col|command|embed|hr|img|input|keygen|link|meta|param|source|track|wbr)$/i;
const htmlBooleanAttributes =
/^(?:allowfullscreen|async|autofocus|autoplay|checkbox|controls|default|defer|disabled|disablepictureinpicture|disableremoteplayback|formnovalidate|hidden|loop|nomodule|novalidate|open|playsinline|readonly|required|reversed|scoped|seamless|selected|itemscope)$/i;
/^(?:allowfullscreen|async|autofocus|autoplay|checked|controls|default|defer|disabled|disablepictureinpicture|disableremoteplayback|formnovalidate|hidden|loop|nomodule|novalidate|open|playsinline|readonly|required|reversed|scoped|seamless|selected|itemscope)$/i;
const htmlEnumAttributes = /^(?:contenteditable|draggable|spellcheck|value)$/i;
// Note: SVG is case-sensitive!
const svgEnumAttributes = /^(?:autoReverse|externalResourcesRequired|focusable|preserveAlpha)$/i;
Expand Down

0 comments on commit bde0196

Please sign in to comment.