mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-12-07 21:59:54 +00:00
LibWeb: Serialize CSS declarations as shorthands where applicable
When serializing CSS declarations we now support combining multiple properties into a single shorthand property in some cases. This comes with a healthy dose of FIXMEs, including work to be done around supporting: - Nested shorthands (e.g. background, border, etc) - Shorthands which aren't represented by the ShorthandStyleValue type - Subproperties pending substitution This gains us a bunch of new test passes, both for WPT and in-tree
This commit is contained in:
Callum Law
Jelle Raaijmakers
parent
94f5a51820
commit
ed65d5b342
Notes:
github-actions[bot]
2025-05-29 10:05:38 +00:00
Author: https://github.com/Calme1709
Commit: ed65d5b342
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/4832
Reviewed-by: https://github.com/AtkinsSJ
Reviewed-by: https://github.com/gmta ✅
9 changed files with 249 additions and 36 deletions
|
|
@ -1,2 +1,2 @@
|
|||
Before: foo<div style="white-space: pre">bar</div>
|
||||
After: foo<span style="white-space-collapse: preserve; text-wrap-mode: nowrap; white-space-trim: none;">bar</span>
|
||||
After: foo<span style="white-space: pre;">bar</span>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
style.cssText = background-color: yellow; background-image: none; background-position-x: 0%; background-position-y: 0%; background-size: auto auto; background-repeat: repeat; background-attachment: scroll; background-origin: padding-box; background-clip: border-box;
|
||||
style.cssText = background-color: yellow; background-image: none; background-position: 0% 0%; background-size: auto auto; background-repeat: repeat; background-attachment: scroll; background-origin: padding-box; background-clip: border-box;
|
||||
style.length = 9
|
||||
style[] =
|
||||
1. background-color
|
||||
|
|
|
|||
|
|
@ -2,8 +2,7 @@ Harness status: OK
|
|||
|
||||
Found 16 tests
|
||||
|
||||
12 Pass
|
||||
4 Fail
|
||||
16 Pass
|
||||
Pass e.style['gap'] = "normal" should set the property value
|
||||
Pass e.style['gap'] = "10px" should set the property value
|
||||
Pass e.style['gap'] = "normal normal" should set the property value
|
||||
|
|
@ -12,11 +11,11 @@ Pass e.style['column-gap'] = "normal" should set the property value
|
|||
Pass e.style['column-gap'] = "10px" should set the property value
|
||||
Pass e.style['row-gap'] = "normal" should set the property value
|
||||
Pass e.style['row-gap'] = "10px" should set the property value
|
||||
Fail 'row-gap: normal; column-gap: normal;' is serialized to 'gap: normal;'
|
||||
Pass 'row-gap: normal; column-gap: normal;' is serialized to 'gap: normal;'
|
||||
Pass getPropertyValue for 'row-gap: normal; column-gap: normal;' returns 'normal'
|
||||
Fail 'row-gap: 10px; column-gap: 10px;' is serialized to 'gap: 10px;'
|
||||
Pass 'row-gap: 10px; column-gap: 10px;' is serialized to 'gap: 10px;'
|
||||
Pass getPropertyValue for 'row-gap: 10px; column-gap: 10px;' returns '10px'
|
||||
Fail 'row-gap: 10px; column-gap: normal;' is serialized to 'gap: 10px normal;'
|
||||
Pass 'row-gap: 10px; column-gap: normal;' is serialized to 'gap: 10px normal;'
|
||||
Pass getPropertyValue for 'row-gap: 10px; column-gap: normal;' returns '10px normal'
|
||||
Fail 'column-gap: normal; row-gap: 10px;' is serialized to 'gap: 10px normal;'
|
||||
Pass 'column-gap: normal; row-gap: 10px;' is serialized to 'gap: 10px normal;'
|
||||
Pass getPropertyValue for 'column-gap: normal; row-gap: 10px;' returns '10px normal'
|
||||
|
|
@ -2,13 +2,12 @@ Harness status: OK
|
|||
|
||||
Found 10 tests
|
||||
|
||||
7 Pass
|
||||
3 Fail
|
||||
10 Pass
|
||||
Pass Single value overflow with CSS-wide keyword should serialize correctly.
|
||||
Pass Single value overflow with non-CSS-wide keyword should serialize correctly.
|
||||
Fail Overflow-x/y longhands with same CSS-wide keyword should serialize correctly.
|
||||
Fail Overflow-x/y longhands with same non-CSS-wide keyword should serialize correctly.
|
||||
Fail Overflow-x/y longhands with different keywords should serialize correctly.
|
||||
Pass Overflow-x/y longhands with same CSS-wide keyword should serialize correctly.
|
||||
Pass Overflow-x/y longhands with same non-CSS-wide keyword should serialize correctly.
|
||||
Pass Overflow-x/y longhands with different keywords should serialize correctly.
|
||||
Pass Single value overflow on element with CSS-wide keyword should serialize correctly.
|
||||
Pass Single value overflow on element with non-CSS-wide keyword should serialize correctly.
|
||||
Pass Overflow-x/y longhands on element with same CSS-wide keyword should serialize correctly.
|
||||
|
|
|
|||
|
|
@ -2,12 +2,12 @@ Harness status: OK
|
|||
|
||||
Found 7 tests
|
||||
|
||||
3 Pass
|
||||
4 Fail
|
||||
6 Pass
|
||||
1 Fail
|
||||
Pass Shorthand serialization with shorthand and longhands mixed.
|
||||
Fail Shorthand serialization with just longhands.
|
||||
Pass Shorthand serialization with just longhands.
|
||||
Fail Shorthand serialization with variable and variable from other shorthand.
|
||||
Fail Shorthand serialization after setting
|
||||
Fail Shorthand serialization with 'initial' value.
|
||||
Pass Shorthand serialization after setting
|
||||
Pass Shorthand serialization with 'initial' value.
|
||||
Pass Shorthand serialization with 'initial' value, one longhand with important flag.
|
||||
Pass Shorthand serialization with 'initial' value, longhands set individually, one with important flag.
|
||||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 20 tests
|
||||
|
||||
2 Pass
|
||||
18 Fail
|
||||
7 Pass
|
||||
13 Fail
|
||||
Fail The serialization of border: 1px; border-top: 1px; should be canonical.
|
||||
Fail The serialization of border: 1px solid red; should be canonical.
|
||||
Fail The serialization of border: 1px red; should be canonical.
|
||||
|
|
@ -15,12 +15,12 @@ Fail The serialization of border: 1px; border-top: 2px; should be canonical.
|
|||
Fail The serialization of border: 1px; border-top: 1px !important; should be canonical.
|
||||
Fail The serialization of border: 1px; border-top-color: red; should be canonical.
|
||||
Fail The serialization of border: solid; border-style: dotted should be canonical.
|
||||
Fail The serialization of border-width: 1px; should be canonical.
|
||||
Fail The serialization of overflow-x: scroll; overflow-y: hidden; should be canonical.
|
||||
Fail The serialization of overflow-x: scroll; overflow-y: scroll; should be canonical.
|
||||
Pass The serialization of border-width: 1px; should be canonical.
|
||||
Pass The serialization of overflow-x: scroll; overflow-y: hidden; should be canonical.
|
||||
Pass The serialization of overflow-x: scroll; overflow-y: scroll; should be canonical.
|
||||
Fail The serialization of outline-width: 2px; outline-style: dotted; outline-color: blue; should be canonical.
|
||||
Fail The serialization of margin-top: 1px; margin-right: 2px; margin-bottom: 3px; margin-left: 4px; should be canonical.
|
||||
Pass The serialization of margin-top: 1px; margin-right: 2px; margin-bottom: 3px; margin-left: 4px; should be canonical.
|
||||
Fail The serialization of list-style-type: circle; list-style-position: inside; list-style-image: none; should be canonical.
|
||||
Pass The serialization of list-style-type: lower-alpha; should be canonical.
|
||||
Pass The serialization of font-family: sans-serif; line-height: 2em; font-size: 3em; font-style: italic; font-weight: bold; should be canonical.
|
||||
Fail The serialization of padding-top: 1px; padding-right: 2px; padding-bottom: 3px; padding-left: 4px; should be canonical.
|
||||
Pass The serialization of padding-top: 1px; padding-right: 2px; padding-bottom: 3px; padding-left: 4px; should be canonical.
|
||||
Loading…
Add table
Add a link
Reference in a new issue