forked from WebKit/WebKit
-
Notifications
You must be signed in to change notification settings - Fork 13
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[CSS Container Queries] Rename container-type value 'none' to 'normal'
https://bugs.webkit.org/show_bug.cgi?id=242311 Reviewed by Alan Bujtas. Implement w3c/csswg-drafts#7402 Also exclude some values from container-name (per https://drafts.csswg.org/css-contain-3/#container-name). Also re-import container query WPT tests. * LayoutTests/imported/w3c/resources/import-expectations.json: * LayoutTests/imported/w3c/resources/resource-files.json: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-parsing-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-parsing.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-style-serialization-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-style-serialization.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/calc-evaluation-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/calc-evaluation.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/canvas-as-container-001.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/canvas-as-container-002.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/canvas-as-container-003.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/canvas-as-container-004.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/column-spanner-in-container-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/column-spanner-in-container.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-computed-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-computed.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-inheritance-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-inheritance.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-name-parsing-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-name-parsing.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-parsing-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-parsing.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-size-nested-invalidation-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-size-nested-invalidation.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-type-computed-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-type-computed.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-type-parsing-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-type-parsing.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-in-at-container-dynamic-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-in-at-container-dynamic.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-in-at-container-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-in-at-container-fallback-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-in-at-container-fallback.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-in-at-container.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-invalidation-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-invalidation.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/crashtests/columns-in-table-002-crash.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/crashtests/w3c-import.log: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/font-relative-calc-dynamic-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/font-relative-calc-dynamic.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/font-relative-units-dynamic-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/font-relative-units-dynamic.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/grid-container-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/grid-container.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/grid-item-container-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/grid-item-container.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/w3c-import.log: * Source/WebCore/css/CSSComputedStyleDeclaration.cpp: (WebCore::hasValidStyleForProperty): (WebCore::ComputedStyleExtractor::valueForPropertyInStyle): * Source/WebCore/css/CSSPrimitiveValueMappings.h: (WebCore::CSSPrimitiveValue::CSSPrimitiveValue): (WebCore::CSSPrimitiveValue::operator ContainerType const): * Source/WebCore/css/CSSValueKeywords.in: * Source/WebCore/css/StyleProperties.cpp: (WebCore::isCSSWideValueKeyword): Drive-by fix. (WebCore::isNormalValue): (WebCore::StyleProperties::getPropertyValue const): * Source/WebCore/css/parser/CSSParserFastPaths.cpp: (WebCore::CSSParserFastPaths::isValidKeywordPropertyAndValue): * Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp: (WebCore::CSSPropertyParserHelpers::consumeSingleContainerName): * Source/WebCore/dom/Document.cpp: (WebCore::Document::updateLayoutIfDimensionsOutOfDate): * Source/WebCore/rendering/RenderBox.cpp: (WebCore::RenderBox::willBeDestroyed): (WebCore::RenderBox::styleWillChange): * Source/WebCore/rendering/style/RenderStyle.h: (WebCore::RenderStyle::initialContainerType): * Source/WebCore/rendering/style/RenderStyleConstants.h: * Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp: (WebCore::StyleRareNonInheritedData::effectiveContainment const): * Source/WebCore/style/ContainerQueryEvaluator.cpp: (WebCore::Style::ContainerQueryEvaluator::selectContainer): (WebCore::Style::ContainerQueryEvaluator::evaluateSizeFeature const): * Source/WebCore/style/StyleScope.cpp: (WebCore::Style::Scope::updateQueryContainerState): * Source/WebCore/style/StyleSharingResolver.cpp: (WebCore::Style::SharingResolver::canShareStyleWithElement const): * Source/WebCore/style/StyleTreeResolver.cpp: (WebCore::Style::TreeResolver::pushParent): (WebCore::Style::TreeResolver::resolveComposedTree): (WebCore::Style::TreeResolver::determineQueryContainerAction): Canonical link: https://commits.webkit.org/252116@main
- Loading branch information
1 parent
fd5fb72
commit eef7b41
Showing
66 changed files
with
899 additions
and
106 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
8 changes: 8 additions & 0 deletions
8
...orm-tests/css/css-contain/container-queries/at-container-style-serialization-expected.txt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
|
||
FAIL Normalize spaces assert_equals: expected "style(--foo: bar)" but got "style( --foo:bar)" | ||
FAIL Empty declaration value - spaces assert_equals: expected "style(--foo: )" but got "STyle(--foo: )" | ||
FAIL Empty declaration value assert_equals: expected "style(--foo: )" but got "STyle(--foo:)" | ||
PASS Missing declaration value | ||
FAIL Unknown CSS property after 'or' assert_equals: expected "style((--FOO: BAR) or ( prop: val ))" but got "style( ( --FOO: BAR) OR ( prop: val ) )" | ||
FAIL Not a style function with space before '(' assert_equals: expected "(--foo: bar)" but got "(--foo: )" | ||
|
34 changes: 34 additions & 0 deletions
34
...eb-platform-tests/css/css-contain/container-queries/at-container-style-serialization.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
<!doctype html> | ||
<title>CSS Container Queries: style() conditionText serialization</title> | ||
<link rel="help" href="https://drafts.csswg.org/css-contain-3/#container-queries"> | ||
<link rel="help" href="https://drafts.csswg.org/cssom/#serialize-a-css-rule"> | ||
<script src="/resources/testharness.js"></script> | ||
<script src="/resources/testharnessreport.js"></script> | ||
<script src="support/cq-testcommon.js"></script> | ||
<style id="testSheet"> | ||
@container style( --foo:bar) { } | ||
@container STyle(--foo: ) { } | ||
@container STyle(--foo:) { } | ||
@container STyle(--foo) { } | ||
@container style( ( --FOO: BAR) OR ( prop: val ) ) { } | ||
@container style (--foo: bar) { } | ||
</style> | ||
<script> | ||
setup(() => { | ||
assert_implements_container_queries(); | ||
assert_equals(testSheet.sheet.cssRules.length, 6); | ||
}); | ||
|
||
const tests = [ | ||
["style(--foo: bar)", "Normalize spaces"], | ||
["style(--foo: )", "Empty declaration value - spaces"], | ||
["style(--foo: )", "Empty declaration value"], | ||
["STyle(--foo)", "Missing declaration value"], | ||
["style((--FOO: BAR) or ( prop: val ))", "Unknown CSS property after 'or'"], | ||
["(--foo: bar)", "Not a style function with space before '('"] | ||
].map((e, i) => [testSheet.sheet.cssRules[i], ...e]); | ||
|
||
tests.forEach((t) => { | ||
test(() => assert_equals(t[0].conditionText, t[1]), t[2]); | ||
}); | ||
</script> |
3 changes: 3 additions & 0 deletions
3
...ted/w3c/web-platform-tests/css/css-contain/container-queries/calc-evaluation-expected.txt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
|
||
PASS em relative inline-size | ||
|
32 changes: 32 additions & 0 deletions
32
...ts/imported/w3c/web-platform-tests/css/css-contain/container-queries/calc-evaluation.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
<!DOCTYPE html> | ||
<title>CSS Container Queries Test: calc()</title> | ||
<link rel="help" href="https://drafts.csswg.org/css-contain-3/#size-container"> | ||
<link rel="help" href="https://drafts.csswg.org/mediaqueries-4/#units"> | ||
<script src="/resources/testharness.js"></script> | ||
<script src="/resources/testharnessreport.js"></script> | ||
<script src="support/cq-testcommon.js"></script> | ||
<style> | ||
:root { font-size: 10px; } | ||
|
||
/* To make output more readable */ | ||
:root > * { font-size: initial; } | ||
|
||
#container { | ||
container-type: size; | ||
width: 200px; | ||
height: 50px; | ||
} | ||
@container (width = calc(100px + 10rem)) { | ||
#target { color: green; } | ||
} | ||
</style> | ||
<div id=container> | ||
<div id=target></div> | ||
</div> | ||
<script> | ||
setup(() => assert_implements_container_queries()); | ||
|
||
test(() => { | ||
assert_equals(getComputedStyle(target).color, 'rgb(0, 128, 0)'); | ||
}, 'em relative inline-size'); | ||
</script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
5 changes: 5 additions & 0 deletions
5
...platform-tests/css/css-contain/container-queries/column-spanner-in-container-expected.txt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
|
||
PASS #spanner matching container with column-width 300px, getting column-span:all | ||
PASS Reducing #multicol width means #spanner no longer gets column-span:all | ||
PASS Back to matching 300px and column-span:all | ||
|
41 changes: 41 additions & 0 deletions
41
...w3c/web-platform-tests/css/css-contain/container-queries/column-spanner-in-container.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
<!doctype html> | ||
<title>CSS Container Queries Test: Column-spanner depending on container in column</title> | ||
<link rel="help" href="https://drafts.csswg.org/css-contain-3/#size-container"> | ||
<script src="/resources/testharness.js"></script> | ||
<script src="/resources/testharnessreport.js"></script> | ||
<script src="support/cq-testcommon.js"></script> | ||
<style> | ||
#multicol { | ||
container-type: inline-size; | ||
width: 600px; | ||
columns: 2; | ||
column-gap: 0; | ||
height: 200px; | ||
} | ||
#spanner { height: 100px; } | ||
@container (width = 600px) { | ||
#spanner { | ||
column-span: all; | ||
} | ||
} | ||
</style> | ||
<div id="multicol"> | ||
<div id="spanner"></div> | ||
</div> | ||
<script> | ||
setup(() => assert_implements_container_queries()); | ||
|
||
test(() => { | ||
assert_equals(getComputedStyle(spanner).width, "600px"); | ||
}, "#spanner matching container with column-width 300px, getting column-span:all"); | ||
|
||
test(() => { | ||
multicol.style.width = "500px"; | ||
assert_equals(getComputedStyle(spanner).width, "250px"); | ||
}, "Reducing #multicol width means #spanner no longer gets column-span:all"); | ||
|
||
test(() => { | ||
multicol.style.width = ""; | ||
assert_equals(getComputedStyle(spanner).width, "600px"); | ||
}, "Back to matching 300px and column-span:all"); | ||
</script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
...c/web-platform-tests/css/css-contain/container-queries/container-inheritance-expected.txt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,6 @@ | ||
|
||
PASS Property container-name has initial value none | ||
PASS Property container-name does not inherit | ||
PASS Property container-type has initial value none | ||
PASS Property container-type has initial value normal | ||
PASS Property container-type does not inherit | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.