The latest release adds the popover attribute with boolean as a supported type (see https://github.com/preactjs/preact/pull/4378). When setting this prop to a boolean value, I'd expect it to add or remove the popover attribute, but not set a value, like eg. the disabled prop. Instead it adds popover="true" or popover="false", stringifying the boolean value, like aria- attributes. This results in a warning from Chrome that the value is not allowed.
A workaround is to use the values "auto" and undefined to substitute for boolean true/false.
Tested with Preact v10.22.0.
To Reproduce
test.html:
<html>
<body>
<div id="app">
<script type="module">
import { render, h } from 'https://unpkg.com/preact?module';
function App() {
return h('div', { popover: true });
}
render(h(App), document.getElementById('app'));
</script>
</body>
</html>
Steps to reproduce the behavior:
Open test.html in Chrome
Observe warning in the logs: Found a 'popover' attribute with an invalid value. <div popover="true"></div>
Describe the bug
The latest release adds the
popoverattribute withbooleanas a supported type (see https://github.com/preactjs/preact/pull/4378). When setting this prop to a boolean value, I'd expect it to add or remove thepopoverattribute, but not set a value, like eg. thedisabledprop. Instead it addspopover="true"orpopover="false", stringifying the boolean value, likearia-attributes. This results in a warning from Chrome that the value is not allowed.A workaround is to use the values
"auto"andundefinedto substitute for boolean true/false.Tested with Preact v10.22.0.
To Reproduce
test.html:
Steps to reproduce the behavior:
Found a 'popover' attribute with an invalid value. <div popover="true"></div>Expected behavior
The above should render
<div popup></div>.