Closed
Description
Initial checklist
- I read the support docs
- I read the contributing guide
- I agree to follow the code of conduct
- I searched issues and discussions and couldn’t find anything (or linked relevant results below)
Affected package
https://esm.sh/hast-util-to-html@9?bundle
Steps to reproduce
See here: https://jsbin.com/jelewudote/3/edit?html,console,output
Copy Pasta'd repro for later reference
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<script>
console.clear();
class Foo extends HTMLElement {
connectedCallback() {
console.log(`rendered: ${this.getAttribute("selected")}`);
}
}
customElements.define("my-foo", Foo)
</script>
<script type="module">
import {toHtml} from "https://esm.sh/hast-util-to-html@9?bundle"
console.log(`serialized: ${toHtml({
type: "element",
children: [],
properties: {
selected: "some value",
},
tagName: "my-foo",
})}`)
</script>
<my-foo selected="some value"></my-foo>
</body>
</html>Basically:
- define a custom element which relies on the value of an attribute that has a well-known name
- serialize such a custom element with an "unexpected" value for the well-known name
Actual behavior
Serialization enforces the well-known definition over its intended usage.
"serialized: <my-foo selected></my-foo>"
Expected behavior
Serialization should not enforce the well-known definition in the case of custom elements. It should align with what is rendered by the browser.
"serialized: <my-foo selected="some value"></my-foo>"
Runtime
Firefox/Chrome
Package manager
No response
Operating system
No response
Build and bundle tools
No response