mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-12-08 06:09:58 +00:00
LibWeb: Parse the position-area property
This commit is contained in:
Tim Ledbetter
Jelle Raaijmakers
parent
12bb266bf2
commit
eb571a1a46
Notes:
github-actions[bot]
2025-09-29 07:54:33 +00:00
Author: https://github.com/tcl3
Commit: eb571a1a46
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/6335
Reviewed-by: https://github.com/gmta ✅
12 changed files with 2733 additions and 0 deletions
|
|
@ -234,6 +234,7 @@ All properties associated with getComputedStyle(document.body):
|
|||
"padding-right",
|
||||
"padding-top",
|
||||
"position",
|
||||
"position-area",
|
||||
"r",
|
||||
"right",
|
||||
"rotate",
|
||||
|
|
|
|||
|
|
@ -630,6 +630,8 @@ All supported properties and their default values exposed from CSSStylePropertie
|
|||
'pointerEvents': 'auto'
|
||||
'pointer-events': 'auto'
|
||||
'position': 'static'
|
||||
'positionArea': 'none'
|
||||
'position-area': 'none'
|
||||
'quotes': 'auto'
|
||||
'r': '0px'
|
||||
'right': 'auto'
|
||||
|
|
|
|||
|
|
@ -232,6 +232,7 @@ padding-left: 0px
|
|||
padding-right: 0px
|
||||
padding-top: 0px
|
||||
position: static
|
||||
position-area: none
|
||||
r: 0px
|
||||
right: auto
|
||||
rotate: none
|
||||
|
|
|
|||
|
|
@ -0,0 +1,47 @@
|
|||
Harness status: OK
|
||||
|
||||
Found 42 tests
|
||||
|
||||
42 Pass
|
||||
Pass CSS Transitions with transition-behavior:allow-discrete: property <position-area> from [none] to [span-all left] at (-0.3) should be [none]
|
||||
Pass CSS Transitions with transition-behavior:allow-discrete: property <position-area> from [none] to [span-all left] at (0) should be [none]
|
||||
Pass CSS Transitions with transition-behavior:allow-discrete: property <position-area> from [none] to [span-all left] at (0.3) should be [none]
|
||||
Pass CSS Transitions with transition-behavior:allow-discrete: property <position-area> from [none] to [span-all left] at (0.5) should be [span-all left]
|
||||
Pass CSS Transitions with transition-behavior:allow-discrete: property <position-area> from [none] to [span-all left] at (0.6) should be [span-all left]
|
||||
Pass CSS Transitions with transition-behavior:allow-discrete: property <position-area> from [none] to [span-all left] at (1) should be [span-all left]
|
||||
Pass CSS Transitions with transition-behavior:allow-discrete: property <position-area> from [none] to [span-all left] at (1.5) should be [span-all left]
|
||||
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <position-area> from [none] to [span-all left] at (-0.3) should be [none]
|
||||
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <position-area> from [none] to [span-all left] at (0) should be [none]
|
||||
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <position-area> from [none] to [span-all left] at (0.3) should be [none]
|
||||
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <position-area> from [none] to [span-all left] at (0.5) should be [span-all left]
|
||||
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <position-area> from [none] to [span-all left] at (0.6) should be [span-all left]
|
||||
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <position-area> from [none] to [span-all left] at (1) should be [span-all left]
|
||||
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <position-area> from [none] to [span-all left] at (1.5) should be [span-all left]
|
||||
Pass CSS Transitions: property <position-area> from [none] to [span-all left] at (-0.3) should be [span-all left]
|
||||
Pass CSS Transitions: property <position-area> from [none] to [span-all left] at (0) should be [span-all left]
|
||||
Pass CSS Transitions: property <position-area> from [none] to [span-all left] at (0.3) should be [span-all left]
|
||||
Pass CSS Transitions: property <position-area> from [none] to [span-all left] at (0.5) should be [span-all left]
|
||||
Pass CSS Transitions: property <position-area> from [none] to [span-all left] at (0.6) should be [span-all left]
|
||||
Pass CSS Transitions: property <position-area> from [none] to [span-all left] at (1) should be [span-all left]
|
||||
Pass CSS Transitions: property <position-area> from [none] to [span-all left] at (1.5) should be [span-all left]
|
||||
Pass CSS Transitions with transition: all: property <position-area> from [none] to [span-all left] at (-0.3) should be [span-all left]
|
||||
Pass CSS Transitions with transition: all: property <position-area> from [none] to [span-all left] at (0) should be [span-all left]
|
||||
Pass CSS Transitions with transition: all: property <position-area> from [none] to [span-all left] at (0.3) should be [span-all left]
|
||||
Pass CSS Transitions with transition: all: property <position-area> from [none] to [span-all left] at (0.5) should be [span-all left]
|
||||
Pass CSS Transitions with transition: all: property <position-area> from [none] to [span-all left] at (0.6) should be [span-all left]
|
||||
Pass CSS Transitions with transition: all: property <position-area> from [none] to [span-all left] at (1) should be [span-all left]
|
||||
Pass CSS Transitions with transition: all: property <position-area> from [none] to [span-all left] at (1.5) should be [span-all left]
|
||||
Pass CSS Animations: property <position-area> from [none] to [span-all left] at (-0.3) should be [none]
|
||||
Pass CSS Animations: property <position-area> from [none] to [span-all left] at (0) should be [none]
|
||||
Pass CSS Animations: property <position-area> from [none] to [span-all left] at (0.3) should be [none]
|
||||
Pass CSS Animations: property <position-area> from [none] to [span-all left] at (0.5) should be [span-all left]
|
||||
Pass CSS Animations: property <position-area> from [none] to [span-all left] at (0.6) should be [span-all left]
|
||||
Pass CSS Animations: property <position-area> from [none] to [span-all left] at (1) should be [span-all left]
|
||||
Pass CSS Animations: property <position-area> from [none] to [span-all left] at (1.5) should be [span-all left]
|
||||
Pass Web Animations: property <position-area> from [none] to [span-all left] at (-0.3) should be [none]
|
||||
Pass Web Animations: property <position-area> from [none] to [span-all left] at (0) should be [none]
|
||||
Pass Web Animations: property <position-area> from [none] to [span-all left] at (0.3) should be [none]
|
||||
Pass Web Animations: property <position-area> from [none] to [span-all left] at (0.5) should be [span-all left]
|
||||
Pass Web Animations: property <position-area> from [none] to [span-all left] at (0.6) should be [span-all left]
|
||||
Pass Web Animations: property <position-area> from [none] to [span-all left] at (1) should be [span-all left]
|
||||
Pass Web Animations: property <position-area> from [none] to [span-all left] at (1.5) should be [span-all left]
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Anchor Positioning: position-area interpolation</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-anchor-position/#position-area">
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
<script src="../../resources/testharnessreport.js"></script>
|
||||
<script src="../../css/support/interpolation-testcommon.js"></script>
|
||||
<body>
|
||||
<script>
|
||||
test_no_interpolation({
|
||||
property: "position-area",
|
||||
from: "none",
|
||||
to: "span-all left"
|
||||
});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,180 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Anchor Positioning: position-area parsing</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-anchor-position/#position-area">
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
<script src="../../resources/testharnessreport.js"></script>
|
||||
<script src="../../css/support/parsing-testcommon.js"></script>
|
||||
<body>
|
||||
<script>
|
||||
function test_valid_single_position_area_values(valid_keywords) {
|
||||
for (const keyword of valid_keywords) {
|
||||
test_valid_value("position-area", keyword);
|
||||
}
|
||||
};
|
||||
|
||||
function test_valid_position_area_value_pairs(valid_keywords1,
|
||||
valid_keywords2,
|
||||
flip_order) {
|
||||
for (const keyword1 of valid_keywords1) {
|
||||
for (const keyword2 of valid_keywords2) {
|
||||
if (keyword1 === keyword2) {
|
||||
test_valid_value("position-area", keyword1 + " " + keyword2, keyword1);
|
||||
} else {
|
||||
test_valid_value("position-area", keyword1 + " " + keyword2,
|
||||
flip_order ? keyword2 + " " + keyword1 : keyword1 + " " + keyword2);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function test_valid_position_area_value_pairs_with_span_all_center(
|
||||
valid_keywords, flip_order) {
|
||||
for (const keyword of valid_keywords) {
|
||||
test_valid_value("position-area", keyword + " center",
|
||||
flip_order ? "center " + keyword : keyword + " center");
|
||||
test_valid_value("position-area", "center " + keyword,
|
||||
flip_order ? "center " + keyword : keyword + " center");
|
||||
test_valid_value("position-area", keyword + " span-all", keyword);
|
||||
test_valid_value("position-area", "span-all " + keyword, keyword);
|
||||
}
|
||||
};
|
||||
|
||||
function test_valid_position_area_value_start_end_pairs_with_span_all_center(
|
||||
valid_keywords) {
|
||||
for (const keyword of valid_keywords) {
|
||||
test_valid_value("position-area", keyword + " center");
|
||||
test_valid_value("position-area", "center " + keyword);
|
||||
test_valid_value("position-area", keyword + " span-all");
|
||||
test_valid_value("position-area", "span-all " + keyword);
|
||||
}
|
||||
}
|
||||
|
||||
function test_invalid_position_area_value_pairs(valid_keywords1,
|
||||
valid_keywords2) {
|
||||
for (const keyword1 of valid_keywords1) {
|
||||
for (const keyword2 of valid_keywords2) {
|
||||
test_invalid_value("position-area", keyword1 + " " + keyword2);
|
||||
test_invalid_value("position-area", keyword2 + " " + keyword1);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function test_invalid_position_area_value_equal_pairs(valid_keywords) {
|
||||
for (const keyword of valid_keywords) {
|
||||
test_invalid_value("position-area", keyword + " " + keyword);
|
||||
}
|
||||
};
|
||||
|
||||
const horizontal = [ "left", "right", "span-left", "span-right", "x-start",
|
||||
"x-end", "span-x-start", "span-x-end", "x-self-start",
|
||||
"x-self-end", "span-x-self-start", "span-x-self-end" ];
|
||||
const vertical = [ "top", "bottom", "span-top", "span-bottom", "y-start",
|
||||
"y-end", "span-y-start", "span-y-end", "y-self-start",
|
||||
"y-self-end", "span-y-self-start", "span-y-self-end" ];
|
||||
const inline = [ "inline-start", "inline-end", "span-inline-start",
|
||||
"span-inline-end" ];
|
||||
const block = [ "block-start", "block-end", "span-block-start",
|
||||
"span-block-end" ];
|
||||
const self_inline = [ "self-inline-start", "self-inline-end",
|
||||
"span-self-inline-start", "span-self-inline-end" ];
|
||||
const self_block = [ "self-block-start", "self-block-end",
|
||||
"span-self-block-start", "span-self-block-end" ];
|
||||
const start_end = [ "start", "end", "span-start", "span-end" ];
|
||||
const self_start_end = [ "self-start", "self-end", "span-self-start",
|
||||
"span-self-end" ];
|
||||
|
||||
// Test initial value 'none'
|
||||
test_valid_value("position-area", "none");
|
||||
test_invalid_value("position-area", "none none");
|
||||
test_invalid_value("position-area", "start none");
|
||||
test_invalid_value("position-area", "none start");
|
||||
test_invalid_value("position-area", "top left top");
|
||||
|
||||
// Test keywords allowed in all axes
|
||||
test_valid_value("position-area", "center");
|
||||
test_valid_value("position-area", "center center", "center")
|
||||
test_valid_value("position-area", "span-all");
|
||||
test_valid_value("position-area", "span-all span-all", "span-all");
|
||||
test_valid_value("position-area", "center span-all");
|
||||
test_valid_value("position-area", "span-all center");
|
||||
|
||||
test_valid_single_position_area_values(horizontal);
|
||||
test_valid_single_position_area_values(vertical);
|
||||
test_valid_single_position_area_values(inline);
|
||||
test_valid_single_position_area_values(block);
|
||||
test_valid_single_position_area_values(self_inline);
|
||||
test_valid_single_position_area_values(self_block);
|
||||
test_valid_single_position_area_values(start_end);
|
||||
test_valid_single_position_area_values(self_start_end);
|
||||
|
||||
// Used if the sets of valid keywords are serialized in a different order than
|
||||
// the argument order
|
||||
const flip_order = true;
|
||||
|
||||
// Test all valid combinations in both orders
|
||||
test_valid_position_area_value_pairs(horizontal, vertical);
|
||||
test_valid_position_area_value_pairs(vertical, horizontal, flip_order);
|
||||
test_valid_position_area_value_pairs(block, inline);
|
||||
test_valid_position_area_value_pairs(inline, block, flip_order);
|
||||
test_valid_position_area_value_pairs(self_block, self_inline);
|
||||
test_valid_position_area_value_pairs(self_inline, self_block, flip_order);
|
||||
test_valid_position_area_value_pairs(start_end, start_end);
|
||||
test_valid_position_area_value_pairs(self_start_end, self_start_end);
|
||||
|
||||
// Test all valid combinations with 'span-all' and 'center' in both orders
|
||||
test_valid_position_area_value_pairs_with_span_all_center(horizontal);
|
||||
test_valid_position_area_value_pairs_with_span_all_center(vertical, flip_order);
|
||||
test_valid_position_area_value_pairs_with_span_all_center(block);
|
||||
test_valid_position_area_value_pairs_with_span_all_center(inline, flip_order);
|
||||
test_valid_position_area_value_pairs_with_span_all_center(self_block);
|
||||
test_valid_position_area_value_pairs_with_span_all_center(self_inline, flip_order);
|
||||
test_valid_position_area_value_start_end_pairs_with_span_all_center(start_end);
|
||||
test_valid_position_area_value_start_end_pairs_with_span_all_center(self_start_end);
|
||||
|
||||
// Test all invalid combinations with incompatible axes in both orders
|
||||
test_invalid_position_area_value_pairs(horizontal, inline);
|
||||
test_invalid_position_area_value_pairs(horizontal, block);
|
||||
test_invalid_position_area_value_pairs(horizontal, self_inline);
|
||||
test_invalid_position_area_value_pairs(horizontal, self_block);
|
||||
test_invalid_position_area_value_pairs(horizontal, start_end);
|
||||
test_invalid_position_area_value_pairs(horizontal, self_start_end);
|
||||
test_invalid_position_area_value_pairs(vertical, inline);
|
||||
test_invalid_position_area_value_pairs(vertical, block);
|
||||
test_invalid_position_area_value_pairs(vertical, self_inline);
|
||||
test_invalid_position_area_value_pairs(vertical, self_block);
|
||||
test_invalid_position_area_value_pairs(vertical, start_end);
|
||||
test_invalid_position_area_value_pairs(vertical, self_start_end);
|
||||
test_invalid_position_area_value_pairs(inline, self_inline);
|
||||
test_invalid_position_area_value_pairs(inline, self_block);
|
||||
test_invalid_position_area_value_pairs(inline, start_end);
|
||||
test_invalid_position_area_value_pairs(inline, self_start_end);
|
||||
test_invalid_position_area_value_pairs(block, self_inline);
|
||||
test_invalid_position_area_value_pairs(block, self_block);
|
||||
test_invalid_position_area_value_pairs(block, start_end);
|
||||
test_invalid_position_area_value_pairs(block, self_start_end);
|
||||
test_invalid_position_area_value_pairs(start_end, self_start_end);
|
||||
|
||||
// Test all invalid combinations of same axis
|
||||
test_invalid_position_area_value_equal_pairs(horizontal);
|
||||
test_invalid_position_area_value_equal_pairs(vertical);
|
||||
test_invalid_position_area_value_equal_pairs(inline);
|
||||
test_invalid_position_area_value_equal_pairs(block);
|
||||
test_invalid_position_area_value_equal_pairs(self_inline);
|
||||
test_invalid_position_area_value_equal_pairs(self_block);
|
||||
|
||||
// Test one invalid keyword
|
||||
test_invalid_value("position-area", "foobar");
|
||||
test_invalid_value("position-area", "visible");
|
||||
test_invalid_value("position-area", "hidden");
|
||||
|
||||
// Test one valid and one invalid keyword
|
||||
test_invalid_value("position-area", "start foobar");
|
||||
test_invalid_value("position-area", "end visible");
|
||||
test_invalid_value("position-area", "block-start hidden");
|
||||
test_invalid_value("position-area", "hidden inline-end");
|
||||
|
||||
// Test two invalid keywords
|
||||
test_invalid_value("position-area", "foo bar");
|
||||
test_invalid_value("position-area", "visible hidden");
|
||||
test_invalid_value("position-area", "hidden visible");
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue