Bug 260716 - adoptedStyleSheets (ObservableArray) has non-writable length
Summary: adoptedStyleSheets (ObservableArray) has non-writable length
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: DOM (show other bugs)
Version: Safari Technology Preview
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Chris Dumez
URL:
Keywords: BrowserCompat, InRadar
Depends on: 238281
Blocks:
  Show dependency treegraph
 
Reported: 2023-08-25 08:42 PDT by Nolan Lawson
Modified: 2023-09-03 09:25 PDT (History)
8 users (show)

See Also:


Attachments
Repro screenshot of Chrome, Firefox, and Safari Technology Preview (327.85 KB, image/png)
2023-08-25 08:42 PDT, Nolan Lawson
no flags Details
Minimal repro HTML (221 bytes, text/html)
2023-08-25 08:42 PDT, Nolan Lawson
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Nolan Lawson 2023-08-25 08:42:09 PDT
Created attachment 467431 [details]
Repro screenshot of Chrome, Firefox, and Safari Technology Preview

The `adoptedStyleSheets` ObservableArray should have a `length` property that is writable. (This is consistent with how regular JavaScript arrays work.)

However, in Safari Technology Preview (Safari 17.0, WebKit 18617.1.4.3), the `length` property is non-writable, and writing to it does not affect the underlying array.

Minimal repro:

    const sheet = new CSSStyleSheet()
    sheet.replaceSync('div { color: red }')
    document.adoptedStyleSheets.push(sheet)

    document.adoptedStyleSheets.length = 0 // this should empty the array

In the attached screenshot, you can see that this leads to an observable difference between Chrome and Firefox (text is black) vs Safari Technology Preview (text is red). Here is a CodePen repro [1].

Additionally, the `writable` property on the property descriptor returns `false` in Safari but `true` in Chrome and Firefox. (Repro: [2])

     Object.getOwnPropertyDescriptor(document.adoptedStyleSheets, 'length').writable

In the spec [3], there is an explicit example [4] of setting `length` to 0 to demonstrate that the array is mutable.

[1]: https://codepen.io/nolanlawson-the-selector/pen/bGOVLre
[2]: https://codepen.io/nolanlawson-the-selector/pen/rNoOJyp?editors=1010
[3]: https://webidl.spec.whatwg.org/#idl-observable-array
[4]: https://webidl.spec.whatwg.org/#example-observable-array
Comment 1 Nolan Lawson 2023-08-25 08:42:30 PDT
Created attachment 467432 [details]
Minimal repro HTML
Comment 2 Alexey Proskuryakov 2023-08-28 14:02:46 PDT
Thank you for the report! This reproduces with Safari 16.5.1 too, so not a recent regression.
Comment 3 Karl Dubost 2023-08-29 20:36:43 PDT
Maybe depends on Bug 238281
Comment 4 Radar WebKit Bug Importer 2023-09-01 08:43:13 PDT
<rdar://problem/114822538>
Comment 5 Chris Dumez 2023-09-01 10:48:27 PDT
Pull request: https://github.com/WebKit/WebKit/pull/17350
Comment 6 EWS 2023-09-03 09:25:40 PDT
Committed 267594@main (8e072e6f9bed): <https://commits.webkit.org/267594@main>

Reviewed commits have been landed. Closing PR #17350 and removing active labels.