ElementCSSInlineStyle.style should not be read-only

[pygy]

TypeScript Version: Nightly

Search Terms:

DOM Element HTMLElement SVGElement inline style setter

Expected behavior:

Per https://drafts.csswg.org/cssom/#elementcssinlinestyle, the style setter is forwarded to style.cssText, and thus accepts a string.

Actual behavior:

Type error:

(property) ElementCSSInlineStyle.style: CSSStyleDeclaration
Cannot assign to 'style' because it is a read-only property.(2540)

Related Issues:

#13466, which (correctly) points to the old spec where ElementCSSInlineStyle.style was only described as readonly, without the PutForwards=cssText annotation.

This is however a case of an old spec that doesn't match a universal browser behavior.

w3c/csswg-drafts#5127 where I asked the W3C for clarification

Code

const a = document.createElement("a")

a.style = ""

Output

"use strict";
const a = document.createElement("a");
a.style = "";

Compiler Options

{
  "compilerOptions": {
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "strictPropertyInitialization": true,
    "strictBindCallApply": true,
    "noImplicitThis": true,
    "noImplicitReturns": true,
    "useDefineForClassFields": false,
    "alwaysStrict": true,
    "allowUnreachableCode": false,
    "allowUnusedLabels": false,
    "downlevelIteration": false,
    "noEmitHelpers": false,
    "noLib": false,
    "noStrictGenericChecks": false,
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "esModuleInterop": true,
    "preserveConstEnums": false,
    "removeComments": false,
    "skipLibCheck": false,
    "checkJs": false,
    "allowJs": false,
    "declaration": true,
    "experimentalDecorators": false,
    "emitDecoratorMetadata": false,
    "target": "ES2017",
    "module": "ESNext"
  }
}

Playground Link: Provided

[byterider]

I wonder why even MDN says "Styles should not be set by assigning a string directly to the style property (as in elt.style = "color: blue;"), since it is considered read-only, as the style attribute returns a CSSStyleDeclaration object which is also read-only."
https://developer.mozilla.org/en-US/docs/Web/API/ElementCSSInlineStyle/style

[louwers]

With #53417 merged we can now add a mutable string setter.