Bug 247852

Summary: Setting CSS shorthands should serialize with the shorthand in cssText
Product: WebKit Reporter: Tim Nguyen (:ntim) <ntim>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: obrufau, qianlangchen, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: WebKit Nightly Build   
Hardware: Unspecified   
OS: Unspecified   

Description Tim Nguyen (:ntim) 2022-11-12 23:23:15 PST
```
const div = document.createElement("div");
div.style.font = "16px Arial";
console.log(div.getAttribute("style"))
```

Actual:

```
font-family: Arial; font-size: 16px; font-style: initial; font-variant-caps: initial; font-weight: initial; font-stretch: initial; line-height: initial; font-size-adjust: initial; font-kerning: initial; font-variant-alternates: initial; font-variant-ligatures: initial; font-variant-numeric: initial; font-variant-east-asian: initial; font-variant-position: initial; font-feature-settings: initial; font-optical-sizing: initial; font-variation-settings: initial; font-palette: initial;
```

Expected:
```
font: 16px Arial;
```

---

System fonts also seem handled incorrectly:

```
font-family: status-bar; font-size: status-bar; font-style: status-bar; font-variant-caps: status-bar; font-weight: status-bar; font-stretch: status-bar; line-height: status-bar; font-size-adjust: initial; font-kerning: initial; font-variant-alternates: initial; font-variant-ligatures: initial; font-variant-numeric: initial; font-variant-east-asian: initial; font-variant-position: initial; font-feature-settings: initial; font-optical-sizing: initial; font-variation-settings: initial; font-palette: initial;
```
Comment 1 Tim Nguyen (:ntim) 2022-11-12 23:29:49 PST
We have the same problem with `background` and other shorthands fwiw. Oriol, are you aware of any other bugs filed for this?
Comment 2 Oriol Brufau 2022-11-13 01:00:47 PST
I guess the style attribute is just set to div.style.cssText.
I recently refactored this, there are various shorthands that are not serialized: https://searchfox.org/wubkat/rev/8b4aafa95d0aa976fe71b6dd3183242487807bc8/Source/WebCore/css/StyleProperties.cpp#1704-1770

So setting font should set all longhands, it's just that they should be serialized with the shorthand. Not sure if there are existing bugs about this.
Comment 3 Tim Nguyen (:ntim) 2022-11-13 03:10:57 PST
(In reply to Oriol Brufau from comment #2)
> I guess the style attribute is just set to div.style.cssText.
> I recently refactored this, there are various shorthands that are not
> serialized:
> https://searchfox.org/wubkat/rev/8b4aafa95d0aa976fe71b6dd3183242487807bc8/
> Source/WebCore/css/StyleProperties.cpp#1704-1770

Thanks! I think most of the items were unintentional omissions (like I don't see a reason why new props like offset can't serialize with the shorthand).
Comment 4 Radar WebKit Bug Importer 2022-11-19 23:24:13 PST
<rdar://problem/102555818>
Comment 5 Karl Dubost 2024-04-07 17:35:31 PDT
*** Bug 271001 has been marked as a duplicate of this bug. ***