[cssom-1] Incorrect handling of media in Create a constructed CSSStyleSheet? #11778
Description
Step 12 of the procedure requires serializing a media query list from media when it is not a string:
- If the
mediaattribute ofoptionsis a string, create aMediaListobject from the string and assign it assheet’s media. Otherwise, serialize a media query list from the attribute and then create aMediaListobject from the resulting string and set it assheet’s media.
I doubt that the procedure for serializing a media query list expects a MediaList (cf. CSSStyleSheetInit).
Besides, the media query list associated to the new MediaList should be updated whenever the attribute (of the owner node) is updated:
If this property is specified to an attribute of the owner node, the media must be set to the return value of invoking create a MediaList object steps for the value of that attribute. Whenever the attribute is set, changed or removed, the media’s
mediaTextattribute must be set to the new value of the attribute, or to null if the attribute is absent.
For example:
<style media="(width: 0px)" id="style">
* { color: red }
</style>
<p>I become red after 1s</p>
<script>
const sheet = document.styleSheets[0]
sheet.media.mediaText // (width: 0px)
setTimeout(() => {
style.setAttribute('media', '(width > 0px)')
style.getAttribute('media') // (width > 0px)
sheet.media.mediaText // (width > 0px)
}, 1000)
</script>So I suspect that step 12 should parse a media query list from media when it is a string, create a MediaList object with it, and assign it as sheet's media. Otherwise, if it is a MediaList, it should create a new MediaList with the media query list associated to media.