Diff
Modified: trunk/LayoutTests/imported/w3c/ChangeLog (292116 => 292117)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2022-03-30 19:14:24 UTC (rev 292116)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2022-03-30 20:20:21 UTC (rev 292117)
@@ -1,3 +1,13 @@
+2022-03-30 Antti Koivisto <[email protected]>
+
+ [CSS Container Queries] Keep colon syntax when serializing container condition
+ https://bugs.webkit.org/show_bug.cgi?id=238542
+
+ Reviewed by Tim Nguyen.
+
+ * web-platform-tests/css/css-contain/container-queries/at-container-serialization-expected.txt:
+ * web-platform-tests/css/css-contain/container-queries/at-container-serialization.html:
+
2022-03-30 Youenn Fablet <[email protected]>
Implement ServiceWorker WindowClient.ancestorOrigins
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization-expected.txt (292116 => 292117)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization-expected.txt 2022-03-30 19:14:24 UTC (rev 292116)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization-expected.txt 2022-03-30 20:20:21 UTC (rev 292117)
@@ -2,4 +2,7 @@
PASS Serialization of conditionText
PASS Serialization of inner @container rule
PASS Serialization of nested @container rule
+PASS Serialization of boolean condition syntax
+PASS Serialization of colon condition syntax
+PASS Serialization of range condition syntax
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization.html (292116 => 292117)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization.html 2022-03-30 19:14:24 UTC (rev 292116)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/at-container-serialization.html 2022-03-30 20:20:21 UTC (rev 292117)
@@ -12,6 +12,18 @@
}
#id { color: green }
}
+ @container ( wiDTh ) { }
+ @container (width:100px) { }
+ @container (min-width: 100px) { }
+ @container ( MAX-WIDTH:100px ) { }
+ @container (width > 100px) { }
+ @container (width < 100px) { }
+ @container (widTH >= 100px) { }
+ @container (width <= 100px) { }
+ @container (10px < width < 100px) { }
+ @container (10px <= width <= 100px) { }
+ @container (100px>WIDTH>10px) { }
+ @container ( 100px >= width >= 10px ) { }
</style>
<script>
setup(() => assert_implements_container_queries());
@@ -19,7 +31,7 @@
let rules = testSheet.sheet.cssRules;
test(() => {
- assert_equals(rules.length, 1);
+ assert_equals(rules.length, 13);
assert_equals(rules[0].cssRules.length, 2);
assert_equals(rules[0].conditionText, "(width = 100px)");
@@ -34,4 +46,24 @@
assert_equals(rules[0].cssText, "@container (width = 100px) {\n @container \\!-name (inline-size > 200px) {\n #id { color: lime; }\n}\n #id { color: green; }\n}");
}, "Serialization of nested @container rule");
+ test(() => {
+ assert_equals(rules[1].conditionText, "(width)");
+ }, "Serialization of boolean condition syntax");
+
+ test(() => {
+ assert_equals(rules[2].conditionText, "(width: 100px)");
+ assert_equals(rules[3].conditionText, "(min-width: 100px)");
+ assert_equals(rules[4].conditionText, "(max-width: 100px)");
+ }, "Serialization of colon condition syntax");
+
+ test(() => {
+ assert_equals(rules[5].conditionText, "(width > 100px)");
+ assert_equals(rules[6].conditionText, "(width < 100px)");
+ assert_equals(rules[7].conditionText, "(width >= 100px)");
+ assert_equals(rules[8].conditionText, "(width <= 100px)");
+ assert_equals(rules[9].conditionText, "(10px < width < 100px)");
+ assert_equals(rules[10].conditionText, "(10px <= width <= 100px)");
+ assert_equals(rules[11].conditionText, "(100px > width > 10px)");
+ assert_equals(rules[12].conditionText, "(100px >= width >= 10px)");
+ }, "Serialization of range condition syntax");
</script>
Modified: trunk/Source/WebCore/ChangeLog (292116 => 292117)
--- trunk/Source/WebCore/ChangeLog 2022-03-30 19:14:24 UTC (rev 292116)
+++ trunk/Source/WebCore/ChangeLog 2022-03-30 20:20:21 UTC (rev 292117)
@@ -1,3 +1,26 @@
+2022-03-30 Antti Koivisto <[email protected]>
+
+ [CSS Container Queries] Keep colon syntax when serializing container condition
+ https://bugs.webkit.org/show_bug.cgi?id=238542
+
+ Reviewed by Tim Nguyen.
+
+ Don't switch to the range syntax when serializing (min-width: 100px) and similar.
+
+ * css/ContainerQuery.cpp:
+ (WebCore::CQ::serialize):
+
+ Add an enum that remembers the syntax used and use it when deciding how to serialize.
+
+ * css/ContainerQuery.h:
+ * css/ContainerQueryParser.cpp:
+ (WebCore::consumeFeatureName):
+ (WebCore::ContainerQueryParser::consumePlainSizeFeature):
+
+ Also fix a bug where plain size feature names were not lowercased.
+
+ (WebCore::ContainerQueryParser::consumeRangeSizeFeature):
+
2022-03-30 Youenn Fablet <[email protected]>
Implement persistent notification handling
Modified: trunk/Source/WebCore/css/ContainerQuery.cpp (292116 => 292117)
--- trunk/Source/WebCore/css/ContainerQuery.cpp 2022-03-30 19:14:24 UTC (rev 292116)
+++ trunk/Source/WebCore/css/ContainerQuery.cpp 2022-03-30 20:20:21 UTC (rev 292117)
@@ -114,7 +114,7 @@
void serialize(StringBuilder& builder, const SizeFeature& sizeFeature)
{
- auto serializeComparisonOperator = [&](ComparisonOperator op) {
+ auto serializeRangeComparisonOperator = [&](ComparisonOperator op) {
builder.append(' ');
switch (op) {
case ComparisonOperator::LessThan:
@@ -136,16 +136,45 @@
builder.append(' ');
};
- if (sizeFeature.leftComparison) {
- builder.append(sizeFeature.leftComparison->value->cssText());
- serializeComparisonOperator(sizeFeature.leftComparison->op);
- }
+ switch (sizeFeature.syntax) {
+ case Syntax::Boolean:
+ serializeIdentifier(sizeFeature.name, builder);
+ break;
- serializeIdentifier(sizeFeature.name, builder);
+ case Syntax::Colon:
+ switch (sizeFeature.rightComparison->op) {
+ case ComparisonOperator::LessThanOrEqual:
+ builder.append("max-");
+ break;
+ case ComparisonOperator::Equal:
+ break;
+ case ComparisonOperator::GreaterThanOrEqual:
+ builder.append("min-");
+ break;
+ case ComparisonOperator::LessThan:
+ case ComparisonOperator::GreaterThan:
+ ASSERT_NOT_REACHED();
+ break;
+ }
+ serializeIdentifier(sizeFeature.name, builder);
- if (sizeFeature.rightComparison) {
- serializeComparisonOperator(sizeFeature.rightComparison->op);
+ builder.append(": ");
builder.append(sizeFeature.rightComparison->value->cssText());
+ break;
+
+ case Syntax::Range:
+ if (sizeFeature.leftComparison) {
+ builder.append(sizeFeature.leftComparison->value->cssText());
+ serializeRangeComparisonOperator(sizeFeature.leftComparison->op);
+ }
+
+ serializeIdentifier(sizeFeature.name, builder);
+
+ if (sizeFeature.rightComparison) {
+ serializeRangeComparisonOperator(sizeFeature.rightComparison->op);
+ builder.append(sizeFeature.rightComparison->value->cssText());
+ }
+ break;
}
}
Modified: trunk/Source/WebCore/css/ContainerQuery.h (292116 => 292117)
--- trunk/Source/WebCore/css/ContainerQuery.h 2022-03-30 19:14:24 UTC (rev 292116)
+++ trunk/Source/WebCore/css/ContainerQuery.h 2022-03-30 20:20:21 UTC (rev 292117)
@@ -49,6 +49,7 @@
enum class LogicalOperator : uint8_t { And, Or, Not };
enum class ComparisonOperator : uint8_t { LessThan, LessThanOrEqual, Equal, GreaterThan, GreaterThanOrEqual };
+enum class Syntax : uint8_t { Boolean, Colon, Range };
struct ContainerCondition {
LogicalOperator logicalOperator { LogicalOperator::And };
@@ -67,6 +68,7 @@
struct SizeFeature {
AtomString name;
+ Syntax syntax;
std::optional<Comparison> leftComparison;
std::optional<Comparison> rightComparison;
};
Modified: trunk/Source/WebCore/css/ContainerQueryParser.cpp (292116 => 292117)
--- trunk/Source/WebCore/css/ContainerQueryParser.cpp 2022-03-30 19:14:24 UTC (rev 292116)
+++ trunk/Source/WebCore/css/ContainerQueryParser.cpp 2022-03-30 20:20:21 UTC (rev 292117)
@@ -176,19 +176,25 @@
return consumeRangeSizeFeature(range);
}
+static String consumeFeatureName(CSSParserTokenRange& range)
+{
+ if (range.peek().type() != IdentToken)
+ return nullAtom();
+ return range.consumeIncludingWhitespace().value().convertToASCIILowercase();
+}
+
std::optional<CQ::SizeFeature> ContainerQueryParser::consumePlainSizeFeature(CSSParserTokenRange& range)
{
auto consumePlainFeatureName = [&]() -> std::pair<AtomString, CQ::ComparisonOperator> {
- if (range.peek().type() != IdentToken)
+ auto name = consumeFeatureName(range);
+ if (name.isEmpty())
return { };
- auto token = range.consumeIncludingWhitespace();
- auto name = token.value();
if (name.startsWith("min-"))
- return { name.substring(4).toAtomString(), CQ::ComparisonOperator::GreaterThanOrEqual };
+ return { name.substring(4), CQ::ComparisonOperator::GreaterThanOrEqual };
if (name.startsWith("max-"))
- return { name.substring(4).toAtomString(), CQ::ComparisonOperator::LessThanOrEqual };
+ return { name.substring(4), CQ::ComparisonOperator::LessThanOrEqual };
- return { name.toAtomString(), CQ::ComparisonOperator::Equal };
+ return { name, CQ::ComparisonOperator::Equal };
};
auto [featureName, op] = consumePlainFeatureName();
@@ -200,7 +206,7 @@
if (range.atEnd()) {
if (op != CQ::ComparisonOperator::Equal)
return { };
- return CQ::SizeFeature { featureName, { }, { } };
+ return CQ::SizeFeature { featureName, CQ::Syntax::Boolean, { }, { } };
}
if (range.peek().type() != ColonToken)
@@ -212,17 +218,11 @@
auto value = consumeValue(range);
- return CQ::SizeFeature { featureName, { }, CQ::Comparison { op, WTFMove(value) } };
+ return CQ::SizeFeature { featureName, CQ::Syntax::Colon, { }, CQ::Comparison { op, WTFMove(value) } };
}
std::optional<CQ::SizeFeature> ContainerQueryParser::consumeRangeSizeFeature(CSSParserTokenRange& range)
{
- auto consumeFeatureName = [&]() -> AtomString {
- if (range.peek().type() != IdentToken)
- return { };
- return range.consumeIncludingWhitespace().value().toAtomString();
- };
-
auto consumeRangeOperator = [&]() -> std::optional<CQ::ComparisonOperator> {
if (range.atEnd())
return { };
@@ -275,7 +275,7 @@
auto leftComparison = consumeLeftComparison();
- auto featureName = consumeFeatureName();
+ auto featureName = consumeFeatureName(range);
if (featureName.isEmpty())
return { };
@@ -284,7 +284,7 @@
if (!leftComparison && !rightComparison)
return { };
- return CQ::SizeFeature { WTFMove(featureName), WTFMove(leftComparison), WTFMove(rightComparison) };
+ return CQ::SizeFeature { WTFMove(featureName), CQ::Syntax::Range, WTFMove(leftComparison), WTFMove(rightComparison) };
}
RefPtr<CSSValue> ContainerQueryParser::consumeValue(CSSParserTokenRange& range)
