Add <style>'s disabled IDL attribute

All browsers have implemented this for a long time. (However, unlike HTMLLinkElement, no browsers implement a disabled="" content attribute for <style>.)

Note that this was originally tracked by #1081. That issue was closed in #4519, though it did not spec anything <style> related.

Author: domfarolino

source

@@ -3747,7 +3747,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
        <li><dfn data-x="concept-css-style-sheet-media" data-x-href="https://drafts.csswg.org/cssom/#concept-css-style-sheet-media">media</dfn></li>
        <li><dfn data-x="concept-css-style-sheet-title" data-x-href="https://drafts.csswg.org/cssom/#concept-css-style-sheet-title">title</dfn></li>
        <li><dfn data-x="concept-css-style-sheet-alternate-flag" data-x-href="https://drafts.csswg.org/cssom/#concept-css-style-sheet-alternate-flag">alternate flag</dfn></li>
-       <li><dfn data-x="concept-css-style-sheet-disabeld-flag" data-x-href="https://drafts.csswg.org/cssom/#concept-css-style-sheet-disabled-flag">disabled flag</dfn></li>
+       <li><dfn data-x="concept-css-style-sheet-disabled-flag" data-x-href="https://drafts.csswg.org/cssom/#concept-css-style-sheet-disabled-flag">disabled flag</dfn></li>
        <li><dfn data-x="concept-css-style-sheet-CSS-rules" data-x-href="https://drafts.csswg.org/cssom/#concept-css-style-sheet-css-rules">CSS rules</dfn></li>
        <li><dfn data-x="concept-css-style-sheet-origin-clean-flag" data-x-href="https://drafts.csswg.org/cssom/#concept-css-style-sheet-origin-clean-flag">origin-clean flag</dfn></li>
       </ul>
@@ -15658,6 +15658,7 @@ people expect to have work and what is necessary.
 interface <dfn interface>HTMLStyleElement</dfn> : <span>HTMLElement</span> {
   [<span>HTMLConstructor</span>] constructor();
 
+  attribute boolean <span data-x="dom-style-disabled">disabled</span>;
   [<span>CEReactions</span>] attribute DOMString <span data-x="dom-style-media">media</span>;
   [SameObject, PutForwards=<span data-x="dom-DOMTokenList-value">value</span>] readonly attribute <span>DOMTokenList</span> <span data-x="dom-style-blocking">blocking</span>;
 
@@ -15673,6 +15674,42 @@ interface <dfn interface>HTMLStyleElement</dfn> : <span>HTMLElement</span> {
   model. The element does not <span data-x="represents">represent</span> content for the
   user.</p>
 
+  <p>The <dfn attribute for="HTMLStyleElement"><code
+  data-x="dom-style-disabled">disabled</code></dfn> getter steps are:</p>
+
+  <ol>
+   <li><p>If <span>this</span> does not have an <span>associated CSS style sheet</span>, return
+   false.</p></li>
+
+   <li><p>If <span>this</span>'s <span>associated CSS style sheet</span>'s <span
+   data-x="concept-css-style-sheet-disabled-flag">disabled flag</span> is set, return true.</p></li>
+
+   <li><p>Return false.</p></li>
+  </ol>
+
+  <p>The <code data-x="dom-style-disabled">disabled</code> setter steps are:</p>
+
+  <ol>
+   <li><p>If <span>this</span> does not have an <span>associated CSS style sheet</span>,
+   return.</p></li>
+
+   <li><p>If the given value is true, set <span>this</span>'s <span>associated CSS style
+   sheet</span>'s <span data-x="concept-css-style-sheet-disabled-flag">disabled flag</span>.
+   Otherwise, unset <span>this</span>'s <span>associated CSS style sheet</span>'s <span
+   data-x="concept-css-style-sheet-disabled-flag">disabled flag</span>.</p></li>
+  </ol>
+
+  <div class="example">
+   <p>Importantly, <code data-x="dom-style-disabled">disabled</code> attribute assignments only take
+   effect when the <code>style</code> element has an <span>associated CSS style sheet</span>:</p>
+
+   <pre><code class="js">const style = document.createElement('style');
+style.disabled = true;
+style.textContent = 'body { background-color: red; }';
+document.body.append(style);
+console.log(style.disabled); // false</code></pre>
+  </div>
+
   <p>The <dfn element-attr for="style"><code data-x="attr-style-media">media</code></dfn> attribute
   says which media the styles apply to. The value must be a <span>valid media query list</span>.
   <span w-nodev>The user agent must apply the styles when the <code
@@ -15799,7 +15836,7 @@ interface <dfn interface>HTMLStyleElement</dfn> : <span>HTMLElement</span> {
      <dt><span data-x="concept-css-style-sheet-owner-CSS-rule">owner CSS rule</span></dt>
      <dd><p>null</p></dd>
 
-     <dt><span data-x="concept-css-style-sheet-disabeld-flag">disabled flag</span></dt>
+     <dt><span data-x="concept-css-style-sheet-disabled-flag">disabled flag</span></dt>
      <dd><p>Left at its default value.</p></dd>
 
      <dt><span data-x="concept-css-style-sheet-CSS-rules">CSS rules</span></dt>
@@ -26104,7 +26141,7 @@ document.body.appendChild(wbr);</code></pre>
        <dt><span data-x="concept-css-style-sheet-owner-CSS-rule">owner CSS rule</span></dt>
        <dd><p>null</p></dd>
 
-       <dt><span data-x="concept-css-style-sheet-disabeld-flag">disabled flag</span></dt>
+       <dt><span data-x="concept-css-style-sheet-disabled-flag">disabled flag</span></dt>
        <dd><p>Left at its default value.</p></dd>
 
        <dt><span data-x="concept-css-style-sheet-CSS-rules">CSS rules</span></dt>