Re: [csswg-drafts] [cssom] How safe is it really to shorthandify properties? (#8398)

> To serialize as an empty string, the site would need to use the new longhands

Not necessarily explicitly, e.g. this would work if `overflow` wasn't a shorthand, without directly using `overflow-x/y`:

```js
var style = document.createElement("div").style;
style.overflow = "var(--overflow)";
var clone = document.createElement("div").style;
for (let p of style) {
  clone.setProperty(p, style.getPropertyValue(p), style.getPropertyPriority(p));
}
clone.cssText // "" :(
```

> using `setPropertyValue` with an empty string has no effect

It has effect, it removes the previous value (for all longhands in case of a shorthand):

```js
document.body.style.cssText = "grid: 1px / 2px; grid-auto-flow: column";
var cs = getComputedStyle(document.body);
var clone = document.createElement("div").style;
for (let p of cs) { // Imagine this iterates `grid` after its longhands, like [...cs, "grid"]
  clone.setProperty(p, cs.getPropertyValue(p), cs.getPropertyPriority(p));
}
[...clone].includes("grid-template-rows"); // Would be false
```

-- 
GitHub Notification of comment by Loirooriol
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8398#issuecomment-1418332093 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 6 February 2023 00:52:12 UTC