Support <selectedcontent> in <select multiple>#12430
Conversation
This PR improves the "clear a select's non-primary selectedcontent elements" algorithm by making it create a list of selectedcontent elements to modify separately from modifying them in order to prevent the list of elements to change while iterating. Fixes whatwg#11880
This PR makes sure that the contents of the selectedcontent element stay up to date when the selected option is changed in the selectedness setting algorithm. This issue was found here: web-platform-tests/wpt#55849 (comment)
In order to make the selectedness setting algorithm match implementations, this PR makes the selectedness setting algorithm avoid changing the selectedness of option elements which haven't ran their insertion steps yet by checking whether the options have their cached nearest ancestor select element assigned yet or not. This was discussed here: whatwg#11825
…electedcontentredo
…contentredo Merged the PRs, now I need to do the selectedcontent rewrite to clone into all descendant selectedcontent elements.
This PR adds support for using the selectedcontent element in a select
element with the multiple attribute by cloning each of the option
elements into the selectedcontent element.
Each cloned option will be wrapped by a generated div element inside the
selectedcontent element, so the resulting DOM would look like this:
```html
<select multiple size=1>
<selectedcontent>
<div>one</div>
<div>two</div>
</selectedcontent>
<option selected>one</option>
<option selected>two</option>
<option>three</option>
</select>
```
Fixes whatwg#12342
|
This PR is currently based on the other PR to rewrite a bunch of selectedcontent stuff, and therefore includes all of its contents: #12263 When that PR is merged, the diff of this one should be easier to read. Here is a diff which shows the actual changes of this proposal by diffing the other PR with this one: https://github.com/josepharhar/html/compare/selectedcontentredo...josepharhar:html:selectedcontentmultiple?expand=1 |
| <li><p>If <var>option</var> is <span data-x="concept-option-selectedness">selected</span>, then | ||
| <span data-x="list append">append</span> <var>option</var> to | ||
| <var>selectedOptions</var>.</p></li> | ||
| </ol> | ||
| </li> | ||
|
|
||
| <li><p>If <var>select</var> has the <code data-x="attr-select-multiple">multiple</code> | ||
| attribute, then run <span>clone multiple options into a <code>selectedcontent</code></span> given | ||
| <var>selectedOptions</var> and <var>selectedcontent</var>.</p></li> |
There was a problem hiding this comment.
Would it make more sense here to do something like:
- Let isMulitple be true if select has the multiple attribute.
- For each option in select's list of options.
- If option is not selected then continue.
- If isMultiple is false, run clone an option into a selectedcontent given option and selectedcontent, and return.
- Append option to selectedoptions given selectedOptions and selectedcontent.
- If selectedoptions is empty, then run clear a selectedcontent given selectedcontent.
- Otherwise, run clone multiple options into a selectedcontent given selectedOptions and selectedcontent.
There was a problem hiding this comment.
Thanks for the suggestion! The difference is that this algorithm can return earlier when it sees a selected option for a non-multiple select, right?
|
The performance cost during parsing could be pretty bad if the cloning of all selected options (seen so far) happens for every |
Agreed, thanks for catching that! I pushed a change to stop updating selectedcontent elements during option parsing if the select is multiple, and instead update them at the end of the select tag's parsing. |
4 participants
This PR adds support for using the selectedcontent element in a select
element with the multiple attribute by cloning each of the option
elements into the selectedcontent element.
Each cloned option will be wrapped by a generated div element inside the
selectedcontent element, so the resulting DOM would look like this:
Fixes #12342
(See WHATWG Working Mode: Changes for more details.)
/form-elements.html ( diff )