Merge pull request #40 from WICG/sync

Use FrozenArray instead of StyleSheetList

explainer.md

@@ -40,10 +40,10 @@ let someStyleSheet = document.createCSSStyleSheetSync("hr { color: green}");
 let anotherStyleSheet = await document.createCSSStyleSheet("@import fancystyle.css")
 
 // Apply style sheet in custom element constructor.
-shadowRoot.adoptedStyleSheets = new StyleSheetList([someStyleSheet, anotherStyleSheet]);
+shadowRoot.adoptedStyleSheets = [someStyleSheet, anotherStyleSheet];
 
 // Apply style sheet in top level document.
-document.adoptedStyleSheets = new StyleSheetList([someStyleSheet]);
+document.adoptedStyleSheets = [someStyleSheet];
 ```
 
 ### Behavior
@@ -55,21 +55,19 @@ document.adoptedStyleSheets = new StyleSheetList([someStyleSheet]);
 	<div id="someDiv">some div</div>
 	</body>
 	<script>
-		let sheetList = new StyleSheetList([
-			document.createCSSStyleSheetSync("* { color: red; })")
-		]);
+		let sheet = document.createCSSStyleSheetSync("* { color: red; })");
 		// this will fail
-		someFrame.contentDocument.adoptedStyleSheets = sheetList;
+		someFrame.contentDocument.adoptedStyleSheets = [sheet];
 		// this will work
 		let shadowRoot = someDiv.attachShadow({mode: "open"});
-		shadowRoot.adoptedStyleSheets = sheetList;
+		shadowRoot.adoptedStyleSheets = [sheet];
 	</script>
 	```
 * After a stylesheet is added to `DocumentOrShadowRoot`s, changes made to the stylesheet will also reflect in those `DocumentOrShadowRoot`s.
 	* Example:
 	```js
 	let sheet = document.createCSSStyleSheetSync("* { color: red; })");
-	document.adoptedStyleSheets = new StyleSheetList([sheet]);
+	document.adoptedStyleSheets = [sheet];
 	sheet.insertRule("* { background-color: blue; }");
 	// Now document will have blue background color as well.
 	```

index.bs

@@ -123,20 +123,16 @@ Using Constructed Stylesheets {#using-constructed-stylesheets}
 =============================
 
 A {{CSSStyleSheet}} can only be applied to the {{Document}} it is constructed on (e.g. the document on which the factory function is called on),
-and any {{ShadowRoot}} in the {{Document}} it is constructed on, by adding a {{StyleSheetList}} containing the sheet to their {{adoptedStyleSheets}}.
+and any {{ShadowRoot}} in the {{Document}} it is constructed on, by assigning an array containing the sheet to their {{adoptedStyleSheets}}.
 So, a stylesheet can be used in multiple {{DocumentOrShadowRoot}}s within the document it is constructed on.
 
 Non-explicitly constructed stylesheets cannot be added to {{adoptedStyleSheets}}.
-If {{adoptedStyleSheets}} got assigned a {{StyleSheetList}} that contains style sheets not made by {{createCSSStyleSheet(text)}} or {{createEmptyCSSStyleSheet}},
+If {{adoptedStyleSheets}} got assigned an array that contains style sheets not made by {{createCSSStyleSheet(text)}}, {{createCSSStyleSheetSync(text)}} or {{createEmptyCSSStyleSheet}},
 a {{TypeError}} will be thrown.
 
 <pre class='idl'>
 partial interface DocumentOrShadowRoot {
-	attribute StyleSheetList adoptedStyleSheets;
-};
-
-[Constructor(sequence&lt;StyleSheet> sheets)]
-partial interface StyleSheetList {
+	attribute FrozenArray&lt;CSSStyleSheet> adoptedStyleSheets;
 };
 </pre>
 
@@ -146,11 +142,6 @@ partial interface StyleSheetList {
 		Style sheets assigned to this attribute are part of the <a spec=cssom-1>document CSS style sheets</a>.
 		They are ordered after the stylesheets in {{Document/styleSheets}}.
 	</dd>
-
-	<dt><dfn constructor for=StyleSheetList lt="StyleSheetList(sheets))">StyleSheetList(sheets)</dfn></dt>
-	<dd>
-		Creates a {{StyleSheetList}} containing the contents of sheets.
-	</dd>
 </dl>
 
 Applying Styles In All Contexts {#styles-in-all-contexts}