Vue-specific attributes are invalid html
sebbayer opened this issue · 5 comments
Vue version
3.5.13
Link to minimal reproduction
Steps to reproduce
The attributes true-value and false-value on <input> fields are vue-specific according to the documentation:
https://vuejs.org/guide/essentials/forms#checkbox-1
However, the markup rendered is invalid because of those attributes.
Go to https://validator.w3.org/nu/#textarea
And validate this string
<!DOCTYPE html>
<html lang="">
<head>
<title>Test</title>
</head>
<body>
<input type="checkbox" true-value="yes" false-value="no">
</body>
</html>
What is expected?
Validation via w3c validator
What is actually happening?
Invalid markup
System Info
Any additional comments?
I dont't know if more internal attributes besides true-value and false-value exist.
Could this be fixed by using data attributes instead?
Could this be fixed by using data attributes instead?
Yes, but this will be a breaking change. Please provide more information about whether this is a real use case or just for passing the W3C validator.
Yes, but this will be a breaking change.
Does any specific piece of code rely on the presence of true-value and false-value as DOM attributes right now?
Actually not. We can’t directly change it to data-true-value="yes", as that would be a breaking change for users already using true-value="yes". However, we could consider adding support for data-true-value="yes" while keeping both options valid.
I'm only concerned about passing the validator, but I also think that standards are important. Maybe that's in my DNA as a German ;)
Backwards compatibility with data-attributes being the standard sounds like a good solution.
I'm only concerned about passing the validator, but I also think that standards are important. Maybe that's in my DNA as a German ;)
German here too... I wouldn't be too religious about the W3C validator not handling custom attributes well. Are they flagged as error or warning?
The validator's not on par with many standards (never has beeen and likely never will be), continuously fails on CSS properties, new ARIA attribs as well as a bunch of the "new" global HTML attributes.
So, if you want to make your page accessible using valid ARIA attributes the validator may tell you it's invalid. Then what? Drop ARIA?
The last browser that choked on unknown attributes (or elements) was Netsacpe Navigator 4.
None of the current engines will have a problem with rendering or functionality ... until the W3C introduces true-value and false-value as official attributes for input elements.
Mavo and HTMLX pages work fine as well and would be marked as inherently "invalid".
But I agree: using data- would've been a better choice as there also an API.
Schönen Tag noch 👋🏻