The issue involves updating React's DOM validation logic for new HTML/CSS specs, which is partially implemented and not yet standardized.
The issue involves updating React's validateDOMNesting logic to accommodate new customizable form widgets, particularly `<button>` inside `<select>`. This requires changes to React's internal DOM validation rules. The main blocker is incomplete browser support and pending HTML spec updates, making this a medium-difficulty task with some uncertainty.
React version: 19.1.0
Link to code example: (Pure html/css reproduction of <button> working inside of <select>): https://codepen.io/web-dot-dev/pen/gbOKyRZ
An error in the console:
In HTML,
<button>cannot be a child of<select>. This will cause a hydration error.
No error.
<hr/> tag. The reason for supporting that seems to have been different than this issue.<button> element, now also more elements are supported within the <option> element - source. Should I open a separate issue for that, or do we track everything related here?
Not all relevant specs were updated. While the CSS spec is ready, HTML isn't. Issues and PRs related to this are tracked here.
Claim this issue to let others know you're working on it. You'll earn 10 points when you complete it!