LibWeb/CSS: Disallow third argument in 2D scale functions

This commit is contained in:
Tim Ledbetter 2025-06-15 05:03:22 +01:00 committed by Alexander Kalenik
commit a3f6e71e33
Notes: github-actions[bot] 2025-06-15 13:59:55 +00:00
5 changed files with 73 additions and 6 deletions

View file

@ -116,7 +116,7 @@ static RefPtr<CSSStyleValue const> interpolate_scale(DOM::Element& element, Calc
return TransformationStyleValue::create(
PropertyID::Scale,
TransformFunction::Scale,
new_values.size() == 3 ? TransformFunction::Scale3d : TransformFunction::Scale,
move(new_values));
}

View file

@ -4141,7 +4141,7 @@ RefPtr<CSSStyleValue const> Parser::parse_scale_value(TokenStream<ComponentValue
return nullptr;
transaction.commit();
return TransformationStyleValue::create(PropertyID::Scale, TransformFunction::Scale, { maybe_x.release_nonnull(), maybe_y.release_nonnull(), maybe_z.release_nonnull() });
return TransformationStyleValue::create(PropertyID::Scale, TransformFunction::Scale3d, { maybe_x.release_nonnull(), maybe_y.release_nonnull(), maybe_z.release_nonnull() });
}
// https://drafts.csswg.org/css-scrollbars/#propdef-scrollbar-color

View file

@ -161,10 +161,6 @@
"type": "<number-percentage>",
"required": true
},
{
"type": "<number-percentage>",
"required": false
},
{
"type": "<number-percentage>",
"required": false

View file

@ -0,0 +1,24 @@
Harness status: OK
Found 19 tests
19 Pass
Pass e.style['transform'] = "none scale(2)" should not set the property value
Pass e.style['transform'] = "translateX(3%) none" should not set the property value
Pass e.style['transform'] = "matrix(1, 2)" should not set the property value
Pass e.style['transform'] = "translate(1px, 2px, 3px)" should not set the property value
Pass e.style['transform'] = "translateX(-4px, 5px)" should not set the property value
Pass e.style['transform'] = "translateY(4%, 5%)" should not set the property value
Pass e.style['transform'] = "scale(6, 7, 8)" should not set the property value
Pass e.style['transform'] = "scale(6%, 7%, 8%)" should not set the property value
Pass e.style['transform'] = "scaleX(1, 2)" should not set the property value
Pass e.style['transform'] = "scaleX(1%, 2%)" should not set the property value
Pass e.style['transform'] = "scaleY(3, 4)" should not set the property value
Pass e.style['transform'] = "scaleY(3%, 4%)" should not set the property value
Pass e.style['transform'] = "rotate(0, 0)" should not set the property value
Pass e.style['transform'] = "rotate(0, 0, 0)" should not set the property value
Pass e.style['transform'] = "rotate(0, 0, 0, 0)" should not set the property value
Pass e.style['transform'] = "skew(0, 0, 0)" should not set the property value
Pass e.style['transform'] = "skewX(0, 0)" should not set the property value
Pass e.style['transform'] = "skewY(0, 0)" should not set the property value
Pass e.style['transform'] = "scaleX(2), scaleY(3)" should not set the property value

View file

@ -0,0 +1,47 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Transform Module Level 2: parsing transform with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#transform-property">
<meta name="assert" content="transform supports only the grammar 'none | <transform-list>'.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("transform", "none scale(2)");
test_invalid_value("transform", "translateX(3%) none");
test_invalid_value("transform", "matrix(1, 2)");
test_invalid_value("transform", "translate(1px, 2px, 3px)");
test_invalid_value("transform", "translateX(-4px, 5px)");
test_invalid_value("transform", "translateY(4%, 5%)");
test_invalid_value("transform", "scale(6, 7, 8)");
test_invalid_value("transform", "scale(6%, 7%, 8%)");
test_invalid_value("transform", "scaleX(1, 2)");
test_invalid_value("transform", "scaleX(1%, 2%)");
test_invalid_value("transform", "scaleY(3, 4)");
test_invalid_value("transform", "scaleY(3%, 4%)");
test_invalid_value("transform", "rotate(0, 0)");
test_invalid_value("transform", "rotate(0, 0, 0)");
test_invalid_value("transform", "rotate(0, 0, 0, 0)");
test_invalid_value("transform", "skew(0, 0, 0)");
test_invalid_value("transform", "skewX(0, 0)");
test_invalid_value("transform", "skewY(0, 0)");
test_invalid_value("transform", "scaleX(2), scaleY(3)");
</script>
</body>
</html>