Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-10-19 07:33:20 +00:00
Code Issues Projects Releases Packages Wiki Activity

Compare commits

base: Stowage:62c00712faa2cd923f18feb3c72a1348aef51145
Branches Tags
Stowage:master
...
compare: Stowage:1a3635cda573bea2f2fcb190d3a4d536964b59cd
Branches Tags
Stowage:master

9 commits
62c00712fa ... 1a3635cda5

Author SHA1 Message Date
Callum Law
1a3635cda5 LibWeb: Parse the shape-margin property 2025-10-17 11:10:05 +01:00
Callum Law
9c7202e3f3 LibWeb: Parse the shape-image-threshold property 2025-10-17 11:10:05 +01:00
Callum Law
0e82ab2966 LibWeb: Define <opacity-value> as a ValueType 
Since `<opacity-value>` is used across multiple properties it makes
sense to have it defined as a value.
 2025-10-17 11:10:05 +01:00
Callum Law
01c5b6f74f LibWeb: Parse the shape-outside property 2025-10-17 11:10:05 +01:00
Callum Law
fb64be2f78 Tests: Import some css-shapes tests 2025-10-17 11:10:05 +01:00
Andreas Kling
383dd28217 LibWebView: Add CLI option to run with content filters disabled 
Let's have a way to run all the JavaScript the web wants to give us.
This was previously available as a Debug menu option, and this makes
it available from process startup.
 2025-10-17 11:24:57 +02:00
stelar7
ced862c460 LibWeb/IDB: Apply default cursor direction 
IDBGetAllOptions is supposed to have a default value for direction.
When the value passed is not a potentially valid key range, we
need to default the direction argument, and not assume its set

Spec issue: https://github.com/w3c/IndexedDB/pull/478
 2025-10-17 09:42:39 +02:00
Callum Law
cdbf4f49e1 LibWeb: Support '<zero>' in '<color-stop-angle>` 
`<color-stop-angle> = [ <angle-percentage> | <zero> ]{1,2}` but we were
previously parsing instead as `<angle-percentage>{1,2}`.
 2025-10-17 08:37:18 +01:00
Callum Law
cc2c8e8615 LibWeb: Resolve percentages in <angular-color-stop-list> as angles 2025-10-17 08:37:18 +01:00
89 changed files with 2934 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

6
Libraries/LibWeb/CSS/Enums.json
View file

@ -703,6 +703,12 @@
"thin",
"none"
],
"shape-box": [
"content-box",
"padding-box",
"border-box",
"margin-box"
],
"shape-rendering": [
"auto",
"optimizespeed",

1
Libraries/LibWeb/CSS/Keywords.json
View file

@ -327,6 +327,7 @@
"luminance",
"luminosity",
"manipulation",
"margin-box",
"mark",
"markers",
"marktext",

15
Libraries/LibWeb/CSS/Parser/GradientParsing.cpp
View file

@ -120,11 +120,24 @@ Optional<Vector<LinearColorStopListElement>> Parser::parse_linear_color_stop_lis
Optional<Vector<AngularColorStopListElement>> Parser::parse_angular_color_stop_list(TokenStream<ComponentValue>& tokens)
{
auto context_guard = push_temporary_value_parsing_context(SpecialContext::AngularColorStopList);
// <angular-color-stop-list> =
// <angular-color-stop> , [ <angular-color-hint>? , <angular-color-stop> ]#
return parse_color_stop_list<AngularColorStopListElement>(
tokens,
[&](auto& it) { return parse_angle_percentage(it); });
[&](TokenStream<ComponentValue>& it) -> Optional<AnglePercentage> {
if (tokens.next_token().is(Token::Type::Number)) {
auto transaction = tokens.begin_transaction();
auto numeric_value = tokens.consume_a_token().token().number_value();
if (numeric_value == 0) {
transaction.commit();
return Angle::make_degrees(0);
}
}
return parse_angle_percentage(it);
});
}
Optional<InterpolationMethod> Parser::parse_interpolation_method(TokenStream<ComponentValue>& tokens)

4
Libraries/LibWeb/CSS/Parser/Parser.h
View file

@ -398,6 +398,7 @@ private:
RefPtr<StyleValue const> parse_contain_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_container_type_value(TokenStream<ComponentValue>&);
RefPtr<StringStyleValue const> parse_opentype_tag_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_opacity_value(TokenStream<ComponentValue>&);
RefPtr<FontSourceStyleValue const> parse_font_source_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_anchor(TokenStream<ComponentValue>&);
@ -460,7 +461,6 @@ private:
RefPtr<StyleValue const> parse_list_style_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_mask_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_math_depth_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_opacity_value(PropertyID property_id, TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_overflow_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_paint_order_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_place_content_value(TokenStream<ComponentValue>&);
@ -478,6 +478,7 @@ private:
RefPtr<StyleValue const> parse_scrollbar_gutter_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_shadow_value(TokenStream<ComponentValue>&, ShadowStyleValue::ShadowType);
RefPtr<StyleValue const> parse_single_shadow_value(TokenStream<ComponentValue>&, ShadowStyleValue::ShadowType);
RefPtr<StyleValue const> parse_shape_outside_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_text_decoration_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_text_decoration_line_value(TokenStream<ComponentValue>&);
RefPtr<StyleValue const> parse_text_underline_position_value(TokenStream<ComponentValue>&);
@ -564,6 +565,7 @@ private:
DescriptorID descriptor;
};
enum SpecialContext : u8 {
AngularColorStopList,
ShadowBlurRadius,
TranslateZArgument
};

81
Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp
View file

@ -172,6 +172,8 @@ Optional<Parser::PropertyAndValue> Parser::parse_css_value_for_properties(Readon
return parsed.release_value();
if (auto parsed = parse_for_type(ValueType::Ratio); parsed.has_value())
return parsed.release_value();
if (auto parsed = parse_for_type(ValueType::Opacity); parsed.has_value())
return parsed.release_value();
if (auto parsed = parse_for_type(ValueType::OpentypeTag); parsed.has_value())
return parsed.release_value();
if (auto parsed = parse_for_type(ValueType::Rect); parsed.has_value())
@ -721,14 +723,6 @@ Parser::ParseErrorOr<NonnullRefPtr<StyleValue const>> Parser::parse_css_value(Pr
if (auto parsed_value = parse_comma_separated_value_list(tokens, [this, property_id](auto& tokens) { return parse_single_background_size_value(property_id, tokens); }))
return parsed_value.release_nonnull();
return ParseError::SyntaxError;
case PropertyID::Opacity:
case PropertyID::FillOpacity:
case PropertyID::FloodOpacity:
case PropertyID::StopOpacity:
case PropertyID::StrokeOpacity:
if (auto parsed_value = parse_opacity_value(property_id, tokens); parsed_value && !tokens.has_next_token())
return parsed_value.release_nonnull();
return ParseError::SyntaxError;
// FIXME: This can be removed once we have generic logic for parsing "positional-value-list-shorthand"s
case PropertyID::Overflow:
if (auto parsed_value = parse_overflow_value(tokens); parsed_value && !tokens.has_next_token())
@ -782,6 +776,10 @@ Parser::ParseErrorOr<NonnullRefPtr<StyleValue const>> Parser::parse_css_value(Pr
if (auto parsed_value = parse_scrollbar_gutter_value(tokens); parsed_value && !tokens.has_next_token())
return parsed_value.release_nonnull();
return ParseError::SyntaxError;
case PropertyID::ShapeOutside:
if (auto parsed_value = parse_shape_outside_value(tokens); parsed_value && !tokens.has_next_token())
return parsed_value.release_nonnull();
return ParseError::SyntaxError;
case PropertyID::StrokeDasharray:
if (auto parsed_value = parse_stroke_dasharray_value(tokens); parsed_value && !tokens.has_next_token())
return parsed_value.release_nonnull();
@ -2282,6 +2280,60 @@ RefPtr<StyleValue const> Parser::parse_single_shadow_value(TokenStream<Component
return ShadowStyleValue::create(shadow_type, color, offset_x.release_nonnull(), offset_y.release_nonnull(), blur_radius, spread_distance, placement.release_value());
}
RefPtr<StyleValue const> Parser::parse_shape_outside_value(TokenStream<ComponentValue>& tokens)
{
// none | [ <basic-shape> || <shape-box> ] | <image>
auto transaction = tokens.begin_transaction();
// none
if (auto maybe_none = parse_all_as_single_keyword_value(tokens, Keyword::None)) {
transaction.commit();
return maybe_none;
}
// <image>
if (auto maybe_image = parse_image_value(tokens)) {
transaction.commit();
return maybe_image;
}
// [ <basic-shape> || <shape-box> ]
RefPtr<StyleValue const> basic_shape_value;
RefPtr<StyleValue const> shape_box_value;
while (tokens.has_next_token()) {
if (auto maybe_basic_shape_value = parse_basic_shape_value(tokens)) {
if (basic_shape_value)
return nullptr;
basic_shape_value = maybe_basic_shape_value;
continue;
}
if (auto maybe_keyword_value = parse_keyword_value(tokens)) {
if (shape_box_value)
return nullptr;
if (!keyword_to_shape_box(maybe_keyword_value->to_keyword()).has_value())
return nullptr;
shape_box_value = maybe_keyword_value;
continue;
}
return nullptr;
}
if (!basic_shape_value && !shape_box_value)
return nullptr;
transaction.commit();
if (basic_shape_value && !shape_box_value)
return basic_shape_value;
if (!basic_shape_value && shape_box_value)
return shape_box_value;
return StyleValueList::create({ basic_shape_value.release_nonnull(), shape_box_value.release_nonnull() }, StyleValueList::Separator::Space);
}
RefPtr<StyleValue const> Parser::parse_rotate_value(TokenStream<ComponentValue>& tokens)
{
// Value: none | <angle> | [ x | y | z | <number>{3} ] && <angle>
@ -4003,19 +4055,6 @@ RefPtr<StyleValue const> Parser::parse_math_depth_value(TokenStream<ComponentVal
return nullptr;
}
RefPtr<StyleValue const> Parser::parse_opacity_value(PropertyID property_id, TokenStream<ComponentValue>& tokens)
{
auto value = parse_css_value_for_property(property_id, tokens);
if (!value)
return nullptr;
// Percentages map to the range [0,1] for opacity values
if (value->is_percentage())
value = NumberStyleValue::create(value->as_percentage().percentage().as_fraction());
return value;
}
RefPtr<StyleValue const> Parser::parse_overflow_value(TokenStream<ComponentValue>& tokens)
{
auto transaction = tokens.begin_transaction();

22
Libraries/LibWeb/CSS/Parser/ValueParsing.cpp
View file

@ -4110,7 +4110,8 @@ RefPtr<CalculatedStyleValue const> Parser::parse_calculated_value(ComponentValue
return CalculationContext::for_property(PropertyNameAndID::from_id(property_id));
},
[](FunctionContext const& function) -> Optional<CalculationContext> {
// Gradients resolve percentages as lengths relative to the gradient-box.
// Gradients resolve percentages as lengths relative to the gradient-box (except within
// <angular-color-stop-list>s which are handled by a special context)
if (function.name.is_one_of_ignoring_ascii_case(
"linear-gradient"sv, "repeating-linear-gradient"sv,
"radial-gradient"sv, "repeating-radial-gradient"sv,
@ -4140,6 +4141,8 @@ RefPtr<CalculatedStyleValue const> Parser::parse_calculated_value(ComponentValue
},
[](SpecialContext special_context) -> Optional<CalculationContext> {
switch (special_context) {
case SpecialContext::AngularColorStopList:
return CalculationContext { .percentages_resolve_as = ValueType::Angle };
case SpecialContext::ShadowBlurRadius:
return CalculationContext { .accepted_type_ranges = { { ValueType::Length, { 0, NumericLimits<float>::max() } } } };
case SpecialContext::TranslateZArgument:
@ -4455,6 +4458,21 @@ RefPtr<CalculationNode const> Parser::parse_a_calculation(Vector<ComponentValue>
return simplify_a_calculation_tree(*calculation_tree, context, CalculationResolutionContext {});
}
// https://drafts.csswg.org/css-color-4/#typedef-opacity-opacity-value
RefPtr<StyleValue const> Parser::parse_opacity_value(TokenStream<ComponentValue>& tokens)
{
auto value = parse_number_percentage_value(tokens);
if (!value)
return nullptr;
// Percentages map to the range [0,1] for opacity values
if (value->is_percentage())
return NumberStyleValue::create(value->as_percentage().percentage().as_fraction());
return value;
}
// https://drafts.csswg.org/css-fonts/#typedef-opentype-tag
RefPtr<StringStyleValue const> Parser::parse_opentype_tag_value(TokenStream<ComponentValue>& tokens)
{
@ -4866,6 +4884,8 @@ RefPtr<StyleValue const> Parser::parse_value(ValueType value_type, TokenStream<C
return parse_length_value(tokens);
case ValueType::Number:
return parse_number_value(tokens);
case ValueType::Opacity:
return parse_opacity_value(tokens);
case ValueType::OpentypeTag:
return parse_opentype_tag_value(tokens);
case ValueType::Paint:

49
Libraries/LibWeb/CSS/Properties.json
View file

@ -1717,8 +1717,7 @@
"inherited": true,
"initial": "1",
"valid-types": [
"number [-∞,∞]",
"percentage [-∞,∞]"
"opacity"
]
},
"fill-rule": {
@ -1834,8 +1833,7 @@
"inherited": false,
"initial": "1",
"valid-types": [
"number [-∞,∞]",
"percentage [-∞,∞]"
"opacity"
]
},
"font": {
@ -2950,10 +2948,8 @@
"inherited": false,
"initial": "1",
"valid-types": [
"number [-∞,∞]",
"percentage [-∞,∞]"
],
"__comment": "We don't have a percentages-resolve-to here because even though we're supposed to map percentages to [0,1], calc(10%) should resolve to 10% not 0.1."
"opacity"
]
},
"order": {
"animation-type": "by-computed-value",
@ -3449,6 +3445,31 @@
"none"
]
},
"shape-image-threshold": {
"affects-layout": false,
"animation-type": "by-computed-value",
"inherited": false,
"initial": "0",
"valid-types": [
"opacity"
]
},
"shape-margin": {
"animation-type": "by-computed-value",
"inherited": false,
"initial": "0",
"valid-types": [
"length [0,∞]",
"percentage [0,∞]"
],
"percentages-resolve-to": "length"
},
"shape-outside": {
"affects-layout": true,
"animation-type": "by-computed-value",
"inherited": false,
"initial": "none"
},
"shape-rendering": {
"affects-layout": true,
"animation-type": "discrete",
@ -3473,10 +3494,8 @@
"inherited": false,
"initial": "1",
"valid-types": [
"number [-∞,∞]",
"percentage [-∞,∞]"
],
"__comment": "We don't have a percentages-resolve-to here for the same reason as for opacity."
"opacity"
]
},
"stroke": {
"affects-layout": false,
@ -3539,10 +3558,8 @@
"inherited": true,
"initial": "1",
"valid-types": [
"number [-∞,∞]",
"percentage [-∞,∞]"
],
"__comment": "We don't have a percentages-resolve-to here for the same reason as for opacity."
"opacity"
]
},
"stroke-width": {
"affects-layout": false,

1
Libraries/LibWeb/CSS/StyleComputer.cpp
View file

@ -3254,6 +3254,7 @@ NonnullRefPtr<StyleValue const> StyleComputer::compute_value_of_property(Propert
case PropertyID::Opacity:
case PropertyID::StopOpacity:
case PropertyID::StrokeOpacity:
case PropertyID::ShapeImageThreshold:
return compute_opacity(absolutized_value);
case PropertyID::PositionArea:
return compute_position_area(absolutized_value);

4
Libraries/LibWeb/CSS/ValueType.cpp
View file

@ -43,6 +43,8 @@ Optional<ValueType> value_type_from_string(StringView string)
return ValueType::Length;
if (string.equals_ignoring_ascii_case("number"sv))
return ValueType::Number;
if (string.equals_ignoring_ascii_case("opacity"sv))
return ValueType::Opacity;
if (string.equals_ignoring_ascii_case("opentype-tag"sv))
return ValueType::OpentypeTag;
if (string.equals_ignoring_ascii_case("paint"sv))
@ -109,6 +111,8 @@ StringView value_type_to_string(ValueType value_type)
return "Length"sv;
case Web::CSS::ValueType::Number:
return "Number"sv;
case Web::CSS::ValueType::Opacity:
return "Opacity"sv;
case Web::CSS::ValueType::OpentypeTag:
return "OpenTypeTag"sv;
case Web::CSS::ValueType::Paint:

1
Libraries/LibWeb/CSS/ValueType.h
View file

@ -31,6 +31,7 @@ enum class ValueType : u8 {
Integer,
Length,
Number,
Opacity,
OpentypeTag,
Paint,
Percentage,

10
Libraries/LibWeb/IndexedDB/Internal/Algorithms.cpp
View file

@ -2405,17 +2405,15 @@ WebIDL::ExceptionOr<GC::Ref<IDBRequest>> create_a_request_to_retrieve_multiple_i
// 6. Let range be a key range.
GC::Ptr<IDBKeyRange> range;
// 7. Let direction be a cursor direction.
Bindings::IDBCursorDirection direction;
// 7. Let direction be "next".
// FIXME: Spec bug: https://github.com/w3c/IndexedDB/pull/478
Bindings::IDBCursorDirection direction = Bindings::IDBCursorDirection::Next;
// 8. If running is a potentially valid key range with queryOrOptions is true, then:
// AD-HOC: Check if query_or_options is null following https://github.com/w3c/IndexedDB/issues/475
if (query_or_options.is_nullish() || is_a_potentially_valid_key_range(realm, query_or_options)) {
// 1. Set range to the result of converting a value to a key range with queryOrOptions. Rethrow any exceptions.
range = TRY(convert_a_value_to_a_key_range(realm, query_or_options));
// 2. Set direction to "next".
direction = Bindings::IDBCursorDirection::Next;
}
// 9. Else:
@ -2436,8 +2434,6 @@ WebIDL::ExceptionOr<GC::Ref<IDBRequest>> create_a_request_to_retrieve_multiple_i
direction = Bindings::IDBCursorDirection::Prev;
else if (direction_value == "prevunique")
direction = Bindings::IDBCursorDirection::Prevunique;
else
return WebIDL::SimpleException { WebIDL::SimpleExceptionType::TypeError, "Invalid direction value"_string };
}
// 10. Let operation be an algorithm to run.

5
Libraries/LibWebView/Application.cpp
View file

@ -118,6 +118,7 @@ ErrorOr<void> Application::initialize(Main::Arguments const& arguments)
bool enable_idl_tracing = false;
bool disable_http_cache = false;
bool enable_http_disk_cache = false;
bool disable_content_filter = false;
bool enable_autoplay = false;
bool expose_internals_object = false;
bool force_cpu_painting = false;
@ -166,6 +167,7 @@ ErrorOr<void> Application::initialize(Main::Arguments const& arguments)
args_parser.add_option(enable_idl_tracing, "Enable IDL tracing", "enable-idl-tracing");
args_parser.add_option(disable_http_cache, "Disable HTTP cache", "disable-http-cache");
args_parser.add_option(enable_http_disk_cache, "Enable HTTP disk cache", "enable-http-disk-cache");
args_parser.add_option(disable_content_filter, "Disable content filter", "disable-content-filter");
args_parser.add_option(enable_autoplay, "Enable multimedia autoplay", "enable-autoplay");
args_parser.add_option(expose_internals_object, "Expose internals object", "expose-internals-object");
args_parser.add_option(force_cpu_painting, "Force CPU painting", "force-cpu-painting");
@ -243,6 +245,7 @@ ErrorOr<void> Application::initialize(Main::Arguments const& arguments)
: DNSSettings(DNSOverUDP(dns_server_address.release_value(), *dns_server_port, validate_dnssec_locally)) }
: OptionalNone()),
.devtools_port = devtools_port,
.enable_content_filter = disable_content_filter ? EnableContentFilter::No : EnableContentFilter::Yes,
};
if (window_width.has_value())
@ -856,7 +859,7 @@ void Application::initialize_actions()
m_debug_menu->add_action(*m_enable_scripting_action);
m_enable_content_filtering_action = Action::create_checkable("Enable Content Filtering"sv, ActionID::EnableContentFiltering, check(m_enable_content_filtering_action, "content-filtering"sv));
m_enable_content_filtering_action->set_checked(true);
m_enable_content_filtering_action->set_checked(m_browser_options.enable_content_filter == WebView::EnableContentFilter::Yes);
m_debug_menu->add_action(*m_enable_content_filtering_action);
m_block_pop_ups_action = Action::create_checkable("Block Pop-ups"sv, ActionID::BlockPopUps, check(m_block_pop_ups_action, "block-pop-ups"sv));

6
Libraries/LibWebView/Options.h
View file

@ -68,6 +68,11 @@ using DNSSettings = Variant<SystemDNS, DNSOverTLS, DNSOverUDP>;
constexpr inline u16 default_devtools_port = 6000;
enum class EnableContentFilter {
No,
Yes,
};
struct BrowserOptions {
Vector<URL::URL> urls;
Vector<ByteString> raw_urls;
@ -84,6 +89,7 @@ struct BrowserOptions {
Optional<ByteString> webdriver_content_ipc_path {};
Optional<DNSSettings> dns_settings {};
Optional<u16> devtools_port;
EnableContentFilter enable_content_filter { EnableContentFilter::Yes };
};
enum class EnableHTTPDiskCache {

17
Meta/Lagom/Tools/CodeGenerators/LibWeb/GenerateCSSPropertyID.cpp
View file

@ -234,6 +234,7 @@ enum class PropertyID : @property_id_underlying_type@ {
generator.set("first_inherited_longhand_property_id", title_casify(inherited_longhand_property_ids.first()));
generator.set("last_inherited_longhand_property_id", title_casify(inherited_longhand_property_ids.last()));
// FIXME: property_accepts_{number,percentage}() has a different range from accepted_type_ranges() despite the names sounding similar.
generator.append(R"~~~(
};
@ -923,17 +924,16 @@ AcceptedTypeRangeMap property_accepted_type_ranges(PropertyID property_id)
StringBuilder ranges_builder;
// Opacity values are unique in that the range which calculated and interpolated values should be clamped
// to [0,1] is different from the range of allowed values [-∞,∞]. To handle this we set the allowed range
// in Properties.json to [-∞,∞] but overwrite it to [0,1] here.
// FIXME: This is confusing as property_accepts_{number,percentage}() has a different range from this
// despite the names sounding similar.
if (first_is_one_of(name, "opacity"sv, "fill-opacity"sv, "flood-opacity"sv, "stop-opacity"sv, "stroke-opacity"sv)) {
ranges_builder.append("{ ValueType::Number, { 0, 1 } }, { ValueType::Percentage, { 0, 100 } }"sv);
} else {
for (auto& type : valid_types.values()) {
VERIFY(type.is_string());
// Opacity values should have their calculated and interpolated values clamped to [0,1] which is
// different from the range of allowed values [-∞,∞].
if (type.as_string() == "opacity"sv) {
ranges_builder.append("{ ValueType::Number, { 0, 1 } }, { ValueType::Percentage, { 0, 100 } }"sv);
continue;
}
Vector<String> type_parts = MUST(type.as_string().split(' '));
if (type_parts.size() < 2)
@ -961,7 +961,6 @@ AcceptedTypeRangeMap property_accepted_type_ranges(PropertyID property_id)
ranges_builder.appendff("{{ ValueType::{}, {{ {}, {} }} }}", title_casify(type_name), min, max);
}
}
property_generator.set("ranges", ranges_builder.to_string_without_validation());

3
Tests/LibWeb/Text/expected/css/CSSStyleDeclaration-has-indexed-property-getter.txt
View file

@ -260,6 +260,9 @@ All properties associated with getComputedStyle(document.body):
"scrollbar-color",
"scrollbar-gutter",
"scrollbar-width",
"shape-image-threshold",
"shape-margin",
"shape-outside",
"stop-color",
"stop-opacity",
"table-layout",

6
Tests/LibWeb/Text/expected/css/CSSStyleProperties-all-supported-properties-and-default-values.txt
View file

@ -697,6 +697,12 @@ All supported properties and their default values exposed from CSSStylePropertie
'scrollbar-gutter': 'auto'
'scrollbarWidth': 'auto'
'scrollbar-width': 'auto'
'shapeImageThreshold': '0'
'shape-image-threshold': '0'
'shapeMargin': '0px'
'shape-margin': '0px'
'shapeOutside': 'none'
'shape-outside': 'none'
'shapeRendering': 'auto'
'shape-rendering': 'auto'
'stopColor': 'rgb(0, 0, 0)'

3
Tests/LibWeb/Text/expected/css/getComputedStyle-print-all.txt
View file

@ -258,6 +258,9 @@ scale: none
scrollbar-color: auto
scrollbar-gutter: auto
scrollbar-width: auto
shape-image-threshold: 0
shape-margin: 0px
shape-outside: none
stop-color: rgb(0, 0, 0)
stop-opacity: 1
table-layout: auto

7
Tests/LibWeb/Text/expected/wpt-import/css/css-cascade/all-prop-revert-layer.txt
View file

@ -1,8 +1,8 @@
Harness status: OK
Found 266 tests
Found 269 tests
260 Pass
263 Pass
6 Fail
Pass accent-color
Pass border-collapse
@ -242,6 +242,9 @@ Pass scale
Pass scrollbar-color
Pass scrollbar-gutter
Pass scrollbar-width
Pass shape-image-threshold
Pass shape-margin
Pass shape-outside
Pass stop-color
Pass stop-opacity
Pass table-layout

11
Tests/LibWeb/Text/expected/wpt-import/css/css-images/gradient/color-stops-parsing.txt
View file

File diff suppressed because one or more lines are too long

125
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-image-threshold-interpolation.txt Normal file
View file

@ -0,0 +1,125 @@
Harness status: OK
Found 120 tests
120 Pass
Pass CSS Transitions: property <shape-image-threshold> from neutral to [0.8] at (-1.5) should be [0.3]
Pass CSS Transitions: property <shape-image-threshold> from neutral to [0.8] at (-0.5) should be [0.5]
Pass CSS Transitions: property <shape-image-threshold> from neutral to [0.8] at (0) should be [0.6]
Pass CSS Transitions: property <shape-image-threshold> from neutral to [0.8] at (0.5) should be [0.7]
Pass CSS Transitions: property <shape-image-threshold> from neutral to [0.8] at (1) should be [0.8]
Pass CSS Transitions: property <shape-image-threshold> from neutral to [0.8] at (1.5) should be [0.9]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from neutral to [0.8] at (-1.5) should be [0.3]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from neutral to [0.8] at (-0.5) should be [0.5]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from neutral to [0.8] at (0) should be [0.6]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from neutral to [0.8] at (0.5) should be [0.7]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from neutral to [0.8] at (1) should be [0.8]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from neutral to [0.8] at (1.5) should be [0.9]
Pass CSS Animations: property <shape-image-threshold> from neutral to [0.8] at (-1.5) should be [0.3]
Pass CSS Animations: property <shape-image-threshold> from neutral to [0.8] at (-0.5) should be [0.5]
Pass CSS Animations: property <shape-image-threshold> from neutral to [0.8] at (0) should be [0.6]
Pass CSS Animations: property <shape-image-threshold> from neutral to [0.8] at (0.5) should be [0.7]
Pass CSS Animations: property <shape-image-threshold> from neutral to [0.8] at (1) should be [0.8]
Pass CSS Animations: property <shape-image-threshold> from neutral to [0.8] at (1.5) should be [0.9]
Pass Web Animations: property <shape-image-threshold> from neutral to [0.8] at (-1.5) should be [0.3]
Pass Web Animations: property <shape-image-threshold> from neutral to [0.8] at (-0.5) should be [0.5]
Pass Web Animations: property <shape-image-threshold> from neutral to [0.8] at (0) should be [0.6]
Pass Web Animations: property <shape-image-threshold> from neutral to [0.8] at (0.5) should be [0.7]
Pass Web Animations: property <shape-image-threshold> from neutral to [0.8] at (1) should be [0.8]
Pass Web Animations: property <shape-image-threshold> from neutral to [0.8] at (1.5) should be [0.9]
Pass CSS Transitions: property <shape-image-threshold> from [initial] to [0.8] at (-1.5) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [initial] to [0.8] at (-0.5) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [initial] to [0.8] at (0) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [initial] to [0.8] at (0.5) should be [0.4]
Pass CSS Transitions: property <shape-image-threshold> from [initial] to [0.8] at (1) should be [0.8]
Pass CSS Transitions: property <shape-image-threshold> from [initial] to [0.8] at (1.5) should be [1]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [initial] to [0.8] at (-1.5) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [initial] to [0.8] at (-0.5) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [initial] to [0.8] at (0) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [initial] to [0.8] at (0.5) should be [0.4]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [initial] to [0.8] at (1) should be [0.8]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [initial] to [0.8] at (1.5) should be [1]
Pass CSS Animations: property <shape-image-threshold> from [initial] to [0.8] at (-1.5) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [initial] to [0.8] at (-0.5) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [initial] to [0.8] at (0) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [initial] to [0.8] at (0.5) should be [0.4]
Pass CSS Animations: property <shape-image-threshold> from [initial] to [0.8] at (1) should be [0.8]
Pass CSS Animations: property <shape-image-threshold> from [initial] to [0.8] at (1.5) should be [1]
Pass Web Animations: property <shape-image-threshold> from [initial] to [0.8] at (-1.5) should be [0]
Pass Web Animations: property <shape-image-threshold> from [initial] to [0.8] at (-0.5) should be [0]
Pass Web Animations: property <shape-image-threshold> from [initial] to [0.8] at (0) should be [0]
Pass Web Animations: property <shape-image-threshold> from [initial] to [0.8] at (0.5) should be [0.4]
Pass Web Animations: property <shape-image-threshold> from [initial] to [0.8] at (1) should be [0.8]
Pass Web Animations: property <shape-image-threshold> from [initial] to [0.8] at (1.5) should be [1]
Pass CSS Transitions: property <shape-image-threshold> from [inherit] to [0.8] at (-1.5) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [inherit] to [0.8] at (-0.5) should be [0.2]
Pass CSS Transitions: property <shape-image-threshold> from [inherit] to [0.8] at (0) should be [0.4]
Pass CSS Transitions: property <shape-image-threshold> from [inherit] to [0.8] at (0.5) should be [0.6]
Pass CSS Transitions: property <shape-image-threshold> from [inherit] to [0.8] at (1) should be [0.8]
Pass CSS Transitions: property <shape-image-threshold> from [inherit] to [0.8] at (1.5) should be [1]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [inherit] to [0.8] at (-1.5) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [inherit] to [0.8] at (-0.5) should be [0.2]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [inherit] to [0.8] at (0) should be [0.4]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [inherit] to [0.8] at (0.5) should be [0.6]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [inherit] to [0.8] at (1) should be [0.8]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [inherit] to [0.8] at (1.5) should be [1]
Pass CSS Animations: property <shape-image-threshold> from [inherit] to [0.8] at (-1.5) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [inherit] to [0.8] at (-0.5) should be [0.2]
Pass CSS Animations: property <shape-image-threshold> from [inherit] to [0.8] at (0) should be [0.4]
Pass CSS Animations: property <shape-image-threshold> from [inherit] to [0.8] at (0.5) should be [0.6]
Pass CSS Animations: property <shape-image-threshold> from [inherit] to [0.8] at (1) should be [0.8]
Pass CSS Animations: property <shape-image-threshold> from [inherit] to [0.8] at (1.5) should be [1]
Pass Web Animations: property <shape-image-threshold> from [inherit] to [0.8] at (-1.5) should be [0]
Pass Web Animations: property <shape-image-threshold> from [inherit] to [0.8] at (-0.5) should be [0.2]
Pass Web Animations: property <shape-image-threshold> from [inherit] to [0.8] at (0) should be [0.4]
Pass Web Animations: property <shape-image-threshold> from [inherit] to [0.8] at (0.5) should be [0.6]
Pass Web Animations: property <shape-image-threshold> from [inherit] to [0.8] at (1) should be [0.8]
Pass Web Animations: property <shape-image-threshold> from [inherit] to [0.8] at (1.5) should be [1]
Pass CSS Transitions: property <shape-image-threshold> from [unset] to [0.8] at (-1.5) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [unset] to [0.8] at (-0.5) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [unset] to [0.8] at (0) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [unset] to [0.8] at (0.5) should be [0.4]
Pass CSS Transitions: property <shape-image-threshold> from [unset] to [0.8] at (1) should be [0.8]
Pass CSS Transitions: property <shape-image-threshold> from [unset] to [0.8] at (1.5) should be [1]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [unset] to [0.8] at (-1.5) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [unset] to [0.8] at (-0.5) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [unset] to [0.8] at (0) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [unset] to [0.8] at (0.5) should be [0.4]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [unset] to [0.8] at (1) should be [0.8]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [unset] to [0.8] at (1.5) should be [1]
Pass CSS Animations: property <shape-image-threshold> from [unset] to [0.8] at (-1.5) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [unset] to [0.8] at (-0.5) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [unset] to [0.8] at (0) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [unset] to [0.8] at (0.5) should be [0.4]
Pass CSS Animations: property <shape-image-threshold> from [unset] to [0.8] at (1) should be [0.8]
Pass CSS Animations: property <shape-image-threshold> from [unset] to [0.8] at (1.5) should be [1]
Pass Web Animations: property <shape-image-threshold> from [unset] to [0.8] at (-1.5) should be [0]
Pass Web Animations: property <shape-image-threshold> from [unset] to [0.8] at (-0.5) should be [0]
Pass Web Animations: property <shape-image-threshold> from [unset] to [0.8] at (0) should be [0]
Pass Web Animations: property <shape-image-threshold> from [unset] to [0.8] at (0.5) should be [0.4]
Pass Web Animations: property <shape-image-threshold> from [unset] to [0.8] at (1) should be [0.8]
Pass Web Animations: property <shape-image-threshold> from [unset] to [0.8] at (1.5) should be [1]
Pass CSS Transitions: property <shape-image-threshold> from [0.5] to [1] at (-1.5) should be [0]
Pass CSS Transitions: property <shape-image-threshold> from [0.5] to [1] at (-0.5) should be [0.25]
Pass CSS Transitions: property <shape-image-threshold> from [0.5] to [1] at (0) should be [0.5]
Pass CSS Transitions: property <shape-image-threshold> from [0.5] to [1] at (0.5) should be [0.75]
Pass CSS Transitions: property <shape-image-threshold> from [0.5] to [1] at (1) should be [1]
Pass CSS Transitions: property <shape-image-threshold> from [0.5] to [1] at (1.5) should be [1]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [0.5] to [1] at (-1.5) should be [0]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [0.5] to [1] at (-0.5) should be [0.25]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [0.5] to [1] at (0) should be [0.5]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [0.5] to [1] at (0.5) should be [0.75]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [0.5] to [1] at (1) should be [1]
Pass CSS Transitions with transition: all: property <shape-image-threshold> from [0.5] to [1] at (1.5) should be [1]
Pass CSS Animations: property <shape-image-threshold> from [0.5] to [1] at (-1.5) should be [0]
Pass CSS Animations: property <shape-image-threshold> from [0.5] to [1] at (-0.5) should be [0.25]
Pass CSS Animations: property <shape-image-threshold> from [0.5] to [1] at (0) should be [0.5]
Pass CSS Animations: property <shape-image-threshold> from [0.5] to [1] at (0.5) should be [0.75]
Pass CSS Animations: property <shape-image-threshold> from [0.5] to [1] at (1) should be [1]
Pass CSS Animations: property <shape-image-threshold> from [0.5] to [1] at (1.5) should be [1]
Pass Web Animations: property <shape-image-threshold> from [0.5] to [1] at (-1.5) should be [0]
Pass Web Animations: property <shape-image-threshold> from [0.5] to [1] at (-0.5) should be [0.25]
Pass Web Animations: property <shape-image-threshold> from [0.5] to [1] at (0) should be [0.5]
Pass Web Animations: property <shape-image-threshold> from [0.5] to [1] at (0.5) should be [0.75]
Pass Web Animations: property <shape-image-threshold> from [0.5] to [1] at (1) should be [1]
Pass Web Animations: property <shape-image-threshold> from [0.5] to [1] at (1.5) should be [1]

26
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-margin-composition.txt Normal file
View file

@ -0,0 +1,26 @@
Harness status: OK
Found 20 tests
16 Pass
4 Fail
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to add [200px] at (-0.3) should be [120px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to add [200px] at (0) should be [150px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to add [200px] at (0.5) should be [200px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to add [200px] at (1) should be [250px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to add [200px] at (1.5) should be [300px]
Pass Compositing: property <shape-margin> underlying [100px] from add [10px] to add [2px] at (-0.5) should be [114px]
Pass Compositing: property <shape-margin> underlying [100px] from add [10px] to add [2px] at (0) should be [110px]
Pass Compositing: property <shape-margin> underlying [100px] from add [10px] to add [2px] at (0.5) should be [106px]
Pass Compositing: property <shape-margin> underlying [100px] from add [10px] to add [2px] at (1) should be [102px]
Pass Compositing: property <shape-margin> underlying [100px] from add [10px] to add [2px] at (1.5) should be [98px]
Fail Compositing: property <shape-margin> underlying [10%] from add [100px] to add [20%] at (-0.3) should be [calc(130px + 4%)]
Fail Compositing: property <shape-margin> underlying [10%] from add [100px] to add [20%] at (0) should be [calc(100px + 10%)]
Fail Compositing: property <shape-margin> underlying [10%] from add [100px] to add [20%] at (0.5) should be [calc(50px + 20%)]
Pass Compositing: property <shape-margin> underlying [10%] from add [100px] to add [20%] at (1) should be [30%]
Fail Compositing: property <shape-margin> underlying [10%] from add [100px] to add [20%] at (1.5) should be [calc(-50px + 40%)]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to replace [200px] at (-0.3) should be [135px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to replace [200px] at (0) should be [150px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to replace [200px] at (0.5) should be [175px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to replace [200px] at (1) should be [200px]
Pass Compositing: property <shape-margin> underlying [50px] from add [100px] to replace [200px] at (1.5) should be [225px]

125
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-margin-interpolation.txt Normal file
View file

@ -0,0 +1,125 @@
Harness status: OK
Found 120 tests
120 Pass
Pass CSS Transitions: property <shape-margin> from neutral to [20px] at (-0.3) should be [7px]
Pass CSS Transitions: property <shape-margin> from neutral to [20px] at (0) should be [10px]
Pass CSS Transitions: property <shape-margin> from neutral to [20px] at (0.3) should be [13px]
Pass CSS Transitions: property <shape-margin> from neutral to [20px] at (0.6) should be [16px]
Pass CSS Transitions: property <shape-margin> from neutral to [20px] at (1) should be [20px]
Pass CSS Transitions: property <shape-margin> from neutral to [20px] at (1.5) should be [25px]
Pass CSS Transitions with transition: all: property <shape-margin> from neutral to [20px] at (-0.3) should be [7px]
Pass CSS Transitions with transition: all: property <shape-margin> from neutral to [20px] at (0) should be [10px]
Pass CSS Transitions with transition: all: property <shape-margin> from neutral to [20px] at (0.3) should be [13px]
Pass CSS Transitions with transition: all: property <shape-margin> from neutral to [20px] at (0.6) should be [16px]
Pass CSS Transitions with transition: all: property <shape-margin> from neutral to [20px] at (1) should be [20px]
Pass CSS Transitions with transition: all: property <shape-margin> from neutral to [20px] at (1.5) should be [25px]
Pass CSS Animations: property <shape-margin> from neutral to [20px] at (-0.3) should be [7px]
Pass CSS Animations: property <shape-margin> from neutral to [20px] at (0) should be [10px]
Pass CSS Animations: property <shape-margin> from neutral to [20px] at (0.3) should be [13px]
Pass CSS Animations: property <shape-margin> from neutral to [20px] at (0.6) should be [16px]
Pass CSS Animations: property <shape-margin> from neutral to [20px] at (1) should be [20px]
Pass CSS Animations: property <shape-margin> from neutral to [20px] at (1.5) should be [25px]
Pass Web Animations: property <shape-margin> from neutral to [20px] at (-0.3) should be [7px]
Pass Web Animations: property <shape-margin> from neutral to [20px] at (0) should be [10px]
Pass Web Animations: property <shape-margin> from neutral to [20px] at (0.3) should be [13px]
Pass Web Animations: property <shape-margin> from neutral to [20px] at (0.6) should be [16px]
Pass Web Animations: property <shape-margin> from neutral to [20px] at (1) should be [20px]
Pass Web Animations: property <shape-margin> from neutral to [20px] at (1.5) should be [25px]
Pass CSS Transitions: property <shape-margin> from [initial] to [20px] at (-0.3) should be [0px]
Pass CSS Transitions: property <shape-margin> from [initial] to [20px] at (0) should be [0px]
Pass CSS Transitions: property <shape-margin> from [initial] to [20px] at (0.3) should be [6px]
Pass CSS Transitions: property <shape-margin> from [initial] to [20px] at (0.6) should be [12px]
Pass CSS Transitions: property <shape-margin> from [initial] to [20px] at (1) should be [20px]
Pass CSS Transitions: property <shape-margin> from [initial] to [20px] at (1.5) should be [30px]
Pass CSS Transitions with transition: all: property <shape-margin> from [initial] to [20px] at (-0.3) should be [0px]
Pass CSS Transitions with transition: all: property <shape-margin> from [initial] to [20px] at (0) should be [0px]
Pass CSS Transitions with transition: all: property <shape-margin> from [initial] to [20px] at (0.3) should be [6px]
Pass CSS Transitions with transition: all: property <shape-margin> from [initial] to [20px] at (0.6) should be [12px]
Pass CSS Transitions with transition: all: property <shape-margin> from [initial] to [20px] at (1) should be [20px]
Pass CSS Transitions with transition: all: property <shape-margin> from [initial] to [20px] at (1.5) should be [30px]
Pass CSS Animations: property <shape-margin> from [initial] to [20px] at (-0.3) should be [0px]
Pass CSS Animations: property <shape-margin> from [initial] to [20px] at (0) should be [0px]
Pass CSS Animations: property <shape-margin> from [initial] to [20px] at (0.3) should be [6px]
Pass CSS Animations: property <shape-margin> from [initial] to [20px] at (0.6) should be [12px]
Pass CSS Animations: property <shape-margin> from [initial] to [20px] at (1) should be [20px]
Pass CSS Animations: property <shape-margin> from [initial] to [20px] at (1.5) should be [30px]
Pass Web Animations: property <shape-margin> from [initial] to [20px] at (-0.3) should be [0px]
Pass Web Animations: property <shape-margin> from [initial] to [20px] at (0) should be [0px]
Pass Web Animations: property <shape-margin> from [initial] to [20px] at (0.3) should be [6px]
Pass Web Animations: property <shape-margin> from [initial] to [20px] at (0.6) should be [12px]
Pass Web Animations: property <shape-margin> from [initial] to [20px] at (1) should be [20px]
Pass Web Animations: property <shape-margin> from [initial] to [20px] at (1.5) should be [30px]
Pass CSS Transitions: property <shape-margin> from [inherit] to [20px] at (-0.3) should be [33px]
Pass CSS Transitions: property <shape-margin> from [inherit] to [20px] at (0) should be [30px]
Pass CSS Transitions: property <shape-margin> from [inherit] to [20px] at (0.3) should be [27px]
Pass CSS Transitions: property <shape-margin> from [inherit] to [20px] at (0.6) should be [24px]
Pass CSS Transitions: property <shape-margin> from [inherit] to [20px] at (1) should be [20px]
Pass CSS Transitions: property <shape-margin> from [inherit] to [20px] at (1.5) should be [15px]
Pass CSS Transitions with transition: all: property <shape-margin> from [inherit] to [20px] at (-0.3) should be [33px]
Pass CSS Transitions with transition: all: property <shape-margin> from [inherit] to [20px] at (0) should be [30px]
Pass CSS Transitions with transition: all: property <shape-margin> from [inherit] to [20px] at (0.3) should be [27px]
Pass CSS Transitions with transition: all: property <shape-margin> from [inherit] to [20px] at (0.6) should be [24px]
Pass CSS Transitions with transition: all: property <shape-margin> from [inherit] to [20px] at (1) should be [20px]
Pass CSS Transitions with transition: all: property <shape-margin> from [inherit] to [20px] at (1.5) should be [15px]
Pass CSS Animations: property <shape-margin> from [inherit] to [20px] at (-0.3) should be [33px]
Pass CSS Animations: property <shape-margin> from [inherit] to [20px] at (0) should be [30px]
Pass CSS Animations: property <shape-margin> from [inherit] to [20px] at (0.3) should be [27px]
Pass CSS Animations: property <shape-margin> from [inherit] to [20px] at (0.6) should be [24px]
Pass CSS Animations: property <shape-margin> from [inherit] to [20px] at (1) should be [20px]
Pass CSS Animations: property <shape-margin> from [inherit] to [20px] at (1.5) should be [15px]
Pass Web Animations: property <shape-margin> from [inherit] to [20px] at (-0.3) should be [33px]
Pass Web Animations: property <shape-margin> from [inherit] to [20px] at (0) should be [30px]
Pass Web Animations: property <shape-margin> from [inherit] to [20px] at (0.3) should be [27px]
Pass Web Animations: property <shape-margin> from [inherit] to [20px] at (0.6) should be [24px]
Pass Web Animations: property <shape-margin> from [inherit] to [20px] at (1) should be [20px]
Pass Web Animations: property <shape-margin> from [inherit] to [20px] at (1.5) should be [15px]
Pass CSS Transitions: property <shape-margin> from [unset] to [20px] at (-0.3) should be [0px]
Pass CSS Transitions: property <shape-margin> from [unset] to [20px] at (0) should be [0px]
Pass CSS Transitions: property <shape-margin> from [unset] to [20px] at (0.3) should be [6px]
Pass CSS Transitions: property <shape-margin> from [unset] to [20px] at (0.6) should be [12px]
Pass CSS Transitions: property <shape-margin> from [unset] to [20px] at (1) should be [20px]
Pass CSS Transitions: property <shape-margin> from [unset] to [20px] at (1.5) should be [30px]
Pass CSS Transitions with transition: all: property <shape-margin> from [unset] to [20px] at (-0.3) should be [0px]
Pass CSS Transitions with transition: all: property <shape-margin> from [unset] to [20px] at (0) should be [0px]
Pass CSS Transitions with transition: all: property <shape-margin> from [unset] to [20px] at (0.3) should be [6px]
Pass CSS Transitions with transition: all: property <shape-margin> from [unset] to [20px] at (0.6) should be [12px]
Pass CSS Transitions with transition: all: property <shape-margin> from [unset] to [20px] at (1) should be [20px]
Pass CSS Transitions with transition: all: property <shape-margin> from [unset] to [20px] at (1.5) should be [30px]
Pass CSS Animations: property <shape-margin> from [unset] to [20px] at (-0.3) should be [0px]
Pass CSS Animations: property <shape-margin> from [unset] to [20px] at (0) should be [0px]
Pass CSS Animations: property <shape-margin> from [unset] to [20px] at (0.3) should be [6px]
Pass CSS Animations: property <shape-margin> from [unset] to [20px] at (0.6) should be [12px]
Pass CSS Animations: property <shape-margin> from [unset] to [20px] at (1) should be [20px]
Pass CSS Animations: property <shape-margin> from [unset] to [20px] at (1.5) should be [30px]
Pass Web Animations: property <shape-margin> from [unset] to [20px] at (-0.3) should be [0px]
Pass Web Animations: property <shape-margin> from [unset] to [20px] at (0) should be [0px]
Pass Web Animations: property <shape-margin> from [unset] to [20px] at (0.3) should be [6px]
Pass Web Animations: property <shape-margin> from [unset] to [20px] at (0.6) should be [12px]
Pass Web Animations: property <shape-margin> from [unset] to [20px] at (1) should be [20px]
Pass Web Animations: property <shape-margin> from [unset] to [20px] at (1.5) should be [30px]
Pass CSS Transitions: property <shape-margin> from [0px] to [100px] at (-0.3) should be [0px]
Pass CSS Transitions: property <shape-margin> from [0px] to [100px] at (0) should be [0px]
Pass CSS Transitions: property <shape-margin> from [0px] to [100px] at (0.3) should be [30px]
Pass CSS Transitions: property <shape-margin> from [0px] to [100px] at (0.6) should be [60px]
Pass CSS Transitions: property <shape-margin> from [0px] to [100px] at (1) should be [100px]
Pass CSS Transitions: property <shape-margin> from [0px] to [100px] at (1.5) should be [150px]
Pass CSS Transitions with transition: all: property <shape-margin> from [0px] to [100px] at (-0.3) should be [0px]
Pass CSS Transitions with transition: all: property <shape-margin> from [0px] to [100px] at (0) should be [0px]
Pass CSS Transitions with transition: all: property <shape-margin> from [0px] to [100px] at (0.3) should be [30px]
Pass CSS Transitions with transition: all: property <shape-margin> from [0px] to [100px] at (0.6) should be [60px]
Pass CSS Transitions with transition: all: property <shape-margin> from [0px] to [100px] at (1) should be [100px]
Pass CSS Transitions with transition: all: property <shape-margin> from [0px] to [100px] at (1.5) should be [150px]
Pass CSS Animations: property <shape-margin> from [0px] to [100px] at (-0.3) should be [0px]
Pass CSS Animations: property <shape-margin> from [0px] to [100px] at (0) should be [0px]
Pass CSS Animations: property <shape-margin> from [0px] to [100px] at (0.3) should be [30px]
Pass CSS Animations: property <shape-margin> from [0px] to [100px] at (0.6) should be [60px]
Pass CSS Animations: property <shape-margin> from [0px] to [100px] at (1) should be [100px]
Pass CSS Animations: property <shape-margin> from [0px] to [100px] at (1.5) should be [150px]
Pass Web Animations: property <shape-margin> from [0px] to [100px] at (-0.3) should be [0px]
Pass Web Animations: property <shape-margin> from [0px] to [100px] at (0) should be [0px]
Pass Web Animations: property <shape-margin> from [0px] to [100px] at (0.3) should be [30px]
Pass Web Animations: property <shape-margin> from [0px] to [100px] at (0.6) should be [60px]
Pass Web Animations: property <shape-margin> from [0px] to [100px] at (1) should be [100px]
Pass Web Animations: property <shape-margin> from [0px] to [100px] at (1.5) should be [150px]

70
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-outside-composition.txt Normal file
View file

@ -0,0 +1,70 @@
Harness status: OK
Found 64 tests
9 Pass
55 Fail
Fail Compositing: property <shape-outside> underlying [circle(100px at 25px 25%)] from add [circle(10px at 25px 75%)] to add [circle(50px at 50px center)] at (-0.3) should be [circle(98px at 42.5px 107.5%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 25px 25%)] from add [circle(10px at 25px 75%)] to add [circle(50px at 50px center)] at (0) should be [circle(110px at 50px 100%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 25px 25%)] from add [circle(10px at 25px 75%)] to add [circle(50px at 50px center)] at (0.3) should be [circle(122px at 57.5px 92.5%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 25px 25%)] from add [circle(10px at 25px 75%)] to add [circle(50px at 50px center)] at (0.6) should be [circle(134px at 65px 85%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 25px 25%)] from add [circle(10px at 25px 75%)] to add [circle(50px at 50px center)] at (1) should be [circle(150px at 75px 75%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 25px 25%)] from add [circle(10px at 25px 75%)] to add [circle(50px at 50px center)] at (1.5) should be [circle(170px at 87.5px 62.5%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 20px 20%)] from add [circle(50px at 50px 50%)] to replace [circle(50% at 150px 150%)] at (-0.3) should be [circle(calc(195px + -15%) at 46px 46%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 20px 20%)] from add [circle(50px at 50px 50%)] to replace [circle(50% at 150px 150%)] at (0) should be [circle(calc(150px + 0%) at 70px 70%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 20px 20%)] from add [circle(50px at 50px 50%)] to replace [circle(50% at 150px 150%)] at (0.3) should be [circle(calc(105px + 15%) at 94px 94%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 20px 20%)] from add [circle(50px at 50px 50%)] to replace [circle(50% at 150px 150%)] at (0.6) should be [circle(calc(60px + 30%) at 118px 118%)]
Pass Compositing: property <shape-outside> underlying [circle(100px at 20px 20%)] from add [circle(50px at 50px 50%)] to replace [circle(50% at 150px 150%)] at (1) should be [circle(50% at 150px 150%)]
Fail Compositing: property <shape-outside> underlying [circle(100px at 20px 20%)] from add [circle(50px at 50px 50%)] to replace [circle(50% at 150px 150%)] at (1.5) should be [circle(calc(-75px + 75%) at 190px 190%)]
Pass Compositing: property <shape-outside> underlying [circle(farthest-side at 25px 75%)] from add [circle(farthest-side at 25px 75%)] to add [circle(farthest-side at 50px center)] at (0.25) should be [circle(farthest-side at 25px 75%)]
Pass Compositing: property <shape-outside> underlying [circle(farthest-side at 25px 75%)] from add [circle(farthest-side at 25px 75%)] to add [circle(farthest-side at 50px center)] at (0.75) should be [circle(farthest-side at 50px 50%)]
Fail Compositing: property <shape-outside> underlying [circle(50px at 10px 20px)] from add [circle(50px at 10px 20px)] to add [circle(farthest-side at 30px 40px)] at (0.25) should be [circle(100px at 20px 40px)]
Pass Compositing: property <shape-outside> underlying [circle(50px at 10px 20px)] from add [circle(50px at 10px 20px)] to add [circle(farthest-side at 30px 40px)] at (0.75) should be [circle(farthest-side at 30px 40px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from add [ellipse(40px 30px at 20px 10px)] to add [ellipse(140px 130px at 120px 110px)] at (-0.3) should be [ellipse(20px 20px at 20px 20px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from add [ellipse(40px 30px at 20px 10px)] to add [ellipse(140px 130px at 120px 110px)] at (0) should be [ellipse(50px 50px at 50px 50px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from add [ellipse(40px 30px at 20px 10px)] to add [ellipse(140px 130px at 120px 110px)] at (0.3) should be [ellipse(80px 80px at 80px 80px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from add [ellipse(40px 30px at 20px 10px)] to add [ellipse(140px 130px at 120px 110px)] at (0.6) should be [ellipse(110px 110px at 110px 110px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from add [ellipse(40px 30px at 20px 10px)] to add [ellipse(140px 130px at 120px 110px)] at (1) should be [ellipse(150px 150px at 150px 150px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from add [ellipse(40px 30px at 20px 10px)] to add [ellipse(140px 130px at 120px 110px)] at (1.5) should be [ellipse(200px 200px at 200px 200px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from replace [ellipse(40px 30px at 20px 10px)] to add [ellipse(40px 30px at 20px 10px)] at (-0.3) should be [ellipse(37px 24px at 11px -2px)]
Pass Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from replace [ellipse(40px 30px at 20px 10px)] to add [ellipse(40px 30px at 20px 10px)] at (0) should be [ellipse(40px 30px at 20px 10px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from replace [ellipse(40px 30px at 20px 10px)] to add [ellipse(40px 30px at 20px 10px)] at (0.3) should be [ellipse(43px 36px at 29px 22px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from replace [ellipse(40px 30px at 20px 10px)] to add [ellipse(40px 30px at 20px 10px)] at (0.6) should be [ellipse(46px 42px at 38px 34px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from replace [ellipse(40px 30px at 20px 10px)] to add [ellipse(40px 30px at 20px 10px)] at (1) should be [ellipse(50px 50px at 50px 50px)]
Fail Compositing: property <shape-outside> underlying [ellipse(10px 20px at 30px 40px)] from replace [ellipse(40px 30px at 20px 10px)] to add [ellipse(40px 30px at 20px 10px)] at (1.5) should be [ellipse(55px 60px at 65px 70px)]
Pass Compositing: property <shape-outside> underlying [ellipse(25px 75%)] from add [ellipse()] to add [ellipse(closest-side farthest-side)] at (0.25) should be [ellipse()]
Pass Compositing: property <shape-outside> underlying [ellipse(25px 75%)] from add [ellipse()] to add [ellipse(closest-side farthest-side)] at (0.75) should be [ellipse(closest-side farthest-side)]
Fail Compositing: property <shape-outside> underlying [inset(20px)] from add [inset(20px)] to add [inset(40%)] at (-0.3) should be [inset(calc(46px + -12%))]
Fail Compositing: property <shape-outside> underlying [inset(20px)] from add [inset(20px)] to add [inset(40%)] at (0) should be [inset(calc(40px + 0%))]
Fail Compositing: property <shape-outside> underlying [inset(20px)] from add [inset(20px)] to add [inset(40%)] at (0.3) should be [inset(calc(34px + 12%))]
Fail Compositing: property <shape-outside> underlying [inset(20px)] from add [inset(20px)] to add [inset(40%)] at (0.6) should be [inset(calc(28px + 24%))]
Fail Compositing: property <shape-outside> underlying [inset(20px)] from add [inset(20px)] to add [inset(40%)] at (1) should be [inset(calc(20px + 40%))]
Fail Compositing: property <shape-outside> underlying [inset(20px)] from add [inset(20px)] to add [inset(40%)] at (1.5) should be [inset(calc(10px + 60%))]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] from add [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] to replace [inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)] at (-0.3) should be [inset(-28px -26px -24px -22px round 0px 10px 30px 50px / 70px 90px 110px 130px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] from add [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] to replace [inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)] at (0) should be [inset(2px 4px 6px 8px round 20px 40px 60px 80px / 100px 120px 140px 160px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] from add [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] to replace [inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)] at (0.25) should be [inset(27px 29px 31px 33px round 45px 65px 85px 105px / 125px 145px 165px 185px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] from add [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] to replace [inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)] at (0.75) should be [inset(77px 79px 81px 83px round 95px 115px 135px 155px / 175px 195px 215px 235px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] from add [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] to replace [inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)] at (1) should be [inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] from add [inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)] to replace [inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)] at (1.5) should be [inset(152px 154px 156px 158px round 170px 190px 210px 230px / 250px 270px 290px 310px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px round 100px 200px)] from add [inset(1px 2px round 100px 200px)] to add [inset(101px 102px 101px 102px)] at (-0.3) should be [inset(-28px -26px round 230px 460px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px round 100px 200px)] from add [inset(1px 2px round 100px 200px)] to add [inset(101px 102px 101px 102px)] at (0) should be [inset(2px 4px round 200px 400px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px round 100px 200px)] from add [inset(1px 2px round 100px 200px)] to add [inset(101px 102px 101px 102px)] at (0.3) should be [inset(32px 34px round 170px 340px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px round 100px 200px)] from add [inset(1px 2px round 100px 200px)] to add [inset(101px 102px 101px 102px)] at (0.6) should be [inset(62px 64px round 140px 280px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px round 100px 200px)] from add [inset(1px 2px round 100px 200px)] to add [inset(101px 102px 101px 102px)] at (1) should be [inset(102px 104px round 100px 200px)]
Fail Compositing: property <shape-outside> underlying [inset(1px 2px round 100px 200px)] from add [inset(1px 2px round 100px 200px)] to add [inset(101px 102px 101px 102px)] at (1.5) should be [inset(152px 154px round 50px 100px)]
Fail Compositing: property <shape-outside> underlying [polygon(10px 20%, 30px 40%)] from add [polygon(10px 20%, 30px 40%)] to add [polygon(110px 120%, 130px 140%)] at (-0.3) should be [polygon(-10px 10%, 30px 50%)]
Fail Compositing: property <shape-outside> underlying [polygon(10px 20%, 30px 40%)] from add [polygon(10px 20%, 30px 40%)] to add [polygon(110px 120%, 130px 140%)] at (0) should be [polygon(20px 40%, 60px 80%)]
Fail Compositing: property <shape-outside> underlying [polygon(10px 20%, 30px 40%)] from add [polygon(10px 20%, 30px 40%)] to add [polygon(110px 120%, 130px 140%)] at (0.3) should be [polygon(50px 70%, 90px 110%)]
Fail Compositing: property <shape-outside> underlying [polygon(10px 20%, 30px 40%)] from add [polygon(10px 20%, 30px 40%)] to add [polygon(110px 120%, 130px 140%)] at (0.6) should be [polygon(80px 100%, 120px 140%)]
Fail Compositing: property <shape-outside> underlying [polygon(10px 20%, 30px 40%)] from add [polygon(10px 20%, 30px 40%)] to add [polygon(110px 120%, 130px 140%)] at (1) should be [polygon(120px 140%, 160px 180%)]
Fail Compositing: property <shape-outside> underlying [polygon(10px 20%, 30px 40%)] from add [polygon(10px 20%, 30px 40%)] to add [polygon(110px 120%, 130px 140%)] at (1.5) should be [polygon(170px 190%, 210px 230%)]
Fail Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(evenodd, 110px 120px)] at (-0.3) should be [polygon(evenodd, -10px 10px)]
Fail Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(evenodd, 110px 120px)] at (0) should be [polygon(evenodd, 20px 40px)]
Fail Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(evenodd, 110px 120px)] at (0.3) should be [polygon(evenodd, 50px 70px)]
Fail Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(evenodd, 110px 120px)] at (0.6) should be [polygon(evenodd, 80px 100px)]
Fail Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(evenodd, 110px 120px)] at (1) should be [polygon(evenodd, 120px 140px)]
Fail Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(evenodd, 110px 120px)] at (1.5) should be [polygon(evenodd, 170px 190px)]
Fail Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(nonzero, 30px 40px)] at (0.25) should be [polygon(evenodd, 20px 40px)]
Pass Compositing: property <shape-outside> underlying [polygon(evenodd, 10px 20px)] from add [polygon(evenodd, 10px 20px)] to add [polygon(nonzero, 30px 40px)] at (0.75) should be [polygon(30px 40px)]
Fail Compositing: property <shape-outside> underlying [polygon(10px 20px, 30px 40px)] from add [polygon(10px 20px, 30px 40px)] to add [polygon(30px 40px)] at (0.25) should be [polygon(20px 40px, 60px 80px)]
Pass Compositing: property <shape-outside> underlying [polygon(10px 20px, 30px 40px)] from add [polygon(10px 20px, 30px 40px)] to add [polygon(30px 40px)] at (0.75) should be [polygon(30px 40px)]

330
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-outside-interpolation.txt Normal file
View file

@ -0,0 +1,330 @@
Harness status: OK
Found 324 tests
312 Pass
12 Fail
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
Pass CSS Transitions with transition: all: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
Pass CSS Transitions with transition: all: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
Pass CSS Transitions with transition: all: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
Pass CSS Transitions with transition: all: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
Pass CSS Transitions with transition: all: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
Pass CSS Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
Pass CSS Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
Pass CSS Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
Pass CSS Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
Pass CSS Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
Pass Web Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
Pass Web Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
Pass Web Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
Pass Web Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
Pass Web Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
Pass CSS Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
Pass CSS Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
Pass CSS Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
Pass Web Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
Pass Web Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
Pass Web Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
Pass CSS Transitions: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
Pass CSS Transitions: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
Pass CSS Transitions: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
Pass CSS Transitions: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
Pass CSS Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
Pass CSS Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
Pass CSS Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
Pass CSS Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
Pass CSS Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
Pass Web Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
Pass Web Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
Pass Web Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
Pass Web Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
Pass Web Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
Pass CSS Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
Pass CSS Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
Pass CSS Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass CSS Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
Pass Web Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
Pass Web Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
Pass Web Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
Pass Web Animations: property <shape-outside> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
Pass CSS Transitions: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
Pass CSS Transitions: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
Pass CSS Transitions: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
Pass CSS Transitions: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
Pass CSS Transitions: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
Pass CSS Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
Pass CSS Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
Pass CSS Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
Pass CSS Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
Pass CSS Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
Pass CSS Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
Pass Web Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
Pass Web Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
Pass Web Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
Pass Web Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
Pass Web Animations: property <shape-outside> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
Pass CSS Transitions: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
Pass CSS Transitions: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
Pass CSS Transitions: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
Pass CSS Transitions: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
Pass CSS Transitions: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
Pass CSS Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
Pass CSS Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
Pass CSS Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
Pass CSS Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
Pass CSS Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
Pass Web Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
Pass Web Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
Pass Web Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
Pass Web Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
Pass Web Animations: property <shape-outside> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
Pass CSS Transitions: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
Pass CSS Transitions: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
Pass CSS Transitions: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
Pass CSS Transitions: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
Pass CSS Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
Pass CSS Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
Pass CSS Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
Pass CSS Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
Pass Web Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
Pass Web Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
Pass Web Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
Pass Web Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
Pass Web Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass Web Animations: property <shape-outside> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions with transition: all: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass CSS Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass Web Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass Web Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass Web Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
Pass Web Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass Web Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass Web Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass Web Animations: property <shape-outside> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
Pass CSS Transitions: property <shape-outside> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
Pass CSS Transitions: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
Pass CSS Transitions: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
Pass CSS Transitions: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
Pass CSS Transitions: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
Pass CSS Transitions: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
Pass CSS Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
Pass CSS Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
Pass CSS Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
Pass CSS Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
Pass CSS Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
Pass CSS Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
Pass Web Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
Pass Web Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
Pass Web Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
Pass Web Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
Pass Web Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
Pass Web Animations: property <shape-outside> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Transitions with transition: all: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
Pass CSS Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
Pass CSS Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
Pass CSS Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass CSS Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Fail CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]

11
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-image-threshold-computed.txt Normal file
View file

@ -0,0 +1,11 @@
Harness status: OK
Found 6 tests
6 Pass
Pass Property shape-image-threshold value '-7'
Pass Property shape-image-threshold value '0.5'
Pass Property shape-image-threshold value '12.5'
Pass Property shape-image-threshold value '-100%'
Pass Property shape-image-threshold value '50%'
Pass Property shape-image-threshold value '300%'

7
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-image-threshold-invalid.txt Normal file
View file

@ -0,0 +1,7 @@
Harness status: OK
Found 2 tests
2 Pass
Pass e.style['shape-image-threshold'] = "auto" should not set the property value
Pass e.style['shape-image-threshold'] = "10px" should not set the property value

10
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-image-threshold-valid.txt Normal file
View file

@ -0,0 +1,10 @@
Harness status: OK
Found 5 tests
5 Pass
Pass e.style['shape-image-threshold'] = "12.5" should set the property value
Pass e.style['shape-image-threshold'] = "-7" should set the property value
Pass e.style['shape-image-threshold'] = "-100%" should set the property value
Pass e.style['shape-image-threshold'] = "50%" should set the property value
Pass e.style['shape-image-threshold'] = "300%" should set the property value

8
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-margin-computed.txt Normal file
View file

@ -0,0 +1,8 @@
Harness status: OK
Found 3 tests
3 Pass
Pass Property shape-margin value 'calc(10px + 0.5em)'
Pass Property shape-margin value 'calc(10px - 0.5em)'
Pass Property shape-margin value '50%'

7
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-margin-invalid.txt Normal file
View file

@ -0,0 +1,7 @@
Harness status: OK
Found 2 tests
2 Pass
Pass e.style['shape-margin'] = "none" should not set the property value
Pass e.style['shape-margin'] = "10" should not set the property value

9
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-margin-valid.txt Normal file
View file

@ -0,0 +1,9 @@
Harness status: OK
Found 4 tests
4 Pass
Pass e.style['shape-margin'] = "0" should set the property value
Pass e.style['shape-margin'] = "10px" should set the property value
Pass e.style['shape-margin'] = "20em" should set the property value
Pass e.style['shape-margin'] = "37.5%" should set the property value

18
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-outside-computed.txt Normal file
View file

@ -0,0 +1,18 @@
Harness status: OK
Found 12 tests
1 Pass
11 Fail
Fail Property shape-outside value 'circle(at 10% 20%)'
Fail Property shape-outside value 'circle(at calc(75% + 0px) calc(75% + 0px))'
Fail Property shape-outside value 'circle(calc(10px + 0.5em) at -50% 50%) border-box'
Fail Property shape-outside value 'circle(calc(10px - 0.5em) at 50% -50%) border-box'
Fail Property shape-outside value 'circle(at top 0% right calc(10% * sign(1em - 1px)))'
Fail Property shape-outside value 'circle(at top 0% right calc(10% * sibling-index()))'
Pass Property shape-outside value 'ellipse(60% closest-side at 50% 50%)'
Fail Property shape-outside value 'ellipse(calc(10px + 0.5em) calc(10px - 0.5em) at -50% 50%) padding-box'
Fail Property shape-outside value 'ellipse(calc(10px - 0.5em) calc(10px + 0.5em) at 50% -50%) border-box'
Fail Property shape-outside value 'polygon(evenodd, -10px, -20px, -30px, -40px, -50px, -60px) margin-box'
Fail Property shape-outside value 'polygon(10%, 20%, 30%, 40%, 50%, 60%) content-box'
Fail Property shape-outside value 'polygon(calc(10px - 0.5em), 20%, 30%, 40%, 50%, calc(10px - 0.5em))'

15
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-outside-invalid-position.txt Normal file
View file

@ -0,0 +1,15 @@
Harness status: OK
Found 10 tests
10 Pass
Pass e.style['shape-outside'] = "circle(at center left 1px)" should not set the property value
Pass e.style['shape-outside'] = "circle(at center top 2px)" should not set the property value
Pass e.style['shape-outside'] = "circle(at right 3% center)" should not set the property value
Pass e.style['shape-outside'] = "circle(at left 4px top)" should not set the property value
Pass e.style['shape-outside'] = "circle(at right 5px top)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(at right top 5px)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(at bottom 6% center)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(at bottom 7% left)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(at bottom right 8%)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(at right 10px top)" should not set the property value

25
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/parsing/shape-outside-valid-position.txt Normal file
View file

@ -0,0 +1,25 @@
Harness status: OK
Found 20 tests
20 Fail
Fail e.style['shape-outside'] = "circle(at 10%)" should set the property value
Fail e.style['shape-outside'] = "circle(at 20% 30px)" should set the property value
Fail e.style['shape-outside'] = "circle(at 30px center)" should set the property value
Fail e.style['shape-outside'] = "circle(at 40px top)" should set the property value
Fail e.style['shape-outside'] = "circle(at bottom 10% right 20%)" should set the property value
Fail e.style['shape-outside'] = "circle(at bottom right)" should set the property value
Fail e.style['shape-outside'] = "circle(at center)" should set the property value
Fail e.style['shape-outside'] = "circle(at center 50px)" should set the property value
Fail e.style['shape-outside'] = "circle(at center bottom)" should set the property value
Fail e.style['shape-outside'] = "circle(at center center)" should set the property value
Fail e.style['shape-outside'] = "circle(at center left)" should set the property value
Fail e.style['shape-outside'] = "circle(at left)" should set the property value
Fail e.style['shape-outside'] = "circle(at left bottom)" should set the property value
Fail e.style['shape-outside'] = "circle(at left center)" should set the property value
Fail e.style['shape-outside'] = "circle(at right 40%)" should set the property value
Fail e.style['shape-outside'] = "circle(at right 30% top 60px)" should set the property value
Fail e.style['shape-outside'] = "circle(at top)" should set the property value
Fail e.style['shape-outside'] = "circle(at top center)" should set the property value
Fail e.style['shape-outside'] = "circle(at top 0% right calc(10% * sign(1em - 1px)))" should set the property value
Fail e.style['shape-outside'] = "circle(at top 0% right calc(10% * sibling-index()))" should set the property value

20
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-computed.txt Normal file
View file

@ -0,0 +1,20 @@
Harness status: OK
Found 14 tests
4 Pass
10 Fail
Fail Property shape-outside value 'circle()'
Fail Property shape-outside value 'circle(1px)'
Pass Property shape-outside value 'circle(20px at center)'
Fail Property shape-outside value 'circle(at 10% 20%)'
Pass Property shape-outside value 'circle(4% at top right)'
Fail Property shape-outside value 'circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))'
Fail Property shape-outside value 'circle(closest-corner at center)'
Fail Property shape-outside value 'circle(closest-corner at 20px 50px)'
Fail Property shape-outside value 'circle(closest-side at center)'
Fail Property shape-outside value 'circle(closest-side at 20px 30%)'
Fail Property shape-outside value 'circle(farthest-corner at center top)'
Fail Property shape-outside value 'circle(farthest-corner at center)'
Pass Property shape-outside value 'circle(farthest-side at center top)'
Pass Property shape-outside value 'circle(farthest-side at center)'

15
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-invalid.txt Normal file
View file

@ -0,0 +1,15 @@
Harness status: OK
Found 10 tests
10 Pass
Pass e.style['shape-outside'] = "circle(123)" should not set the property value
Pass e.style['shape-outside'] = "circle(at)" should not set the property value
Pass e.style['shape-outside'] = "circle(4% 20%)" should not set the property value
Pass e.style['shape-outside'] = "circle(4% 20% at center)" should not set the property value
Pass e.style['shape-outside'] = "circle(4px 20px)" should not set the property value
Pass e.style['shape-outside'] = "circle(4px, 20px)" should not set the property value
Pass e.style['shape-outside'] = "circle(at 4px, 20px)" should not set the property value
Pass e.style['shape-outside'] = "circle(-10px at 20px 30px)" should not set the property value
Pass e.style['shape-outside'] = "circle(-10% at 20% 30%)" should not set the property value
Pass e.style['shape-outside'] = "circle(1% 2% at 0% 100%)" should not set the property value

19
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-valid.txt Normal file
View file

@ -0,0 +1,19 @@
Harness status: OK
Found 14 tests
14 Fail
Fail e.style['shape-outside'] = "circle()" should set the property value
Fail e.style['shape-outside'] = "circle(1px)" should set the property value
Fail e.style['shape-outside'] = "circle(20px at center)" should set the property value
Fail e.style['shape-outside'] = "circle(at 10% 20%)" should set the property value
Fail e.style['shape-outside'] = "circle(4% at top right)" should set the property value
Fail e.style['shape-outside'] = "circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))" should set the property value
Fail e.style['shape-outside'] = "circle(closest-corner at center)" should set the property value
Fail e.style['shape-outside'] = "circle(closest-corner at 20px 50px)" should set the property value
Fail e.style['shape-outside'] = "circle(closest-side at center)" should set the property value
Fail e.style['shape-outside'] = "circle(closest-side at 20px 30%)" should set the property value
Fail e.style['shape-outside'] = "circle(farthest-corner at center top)" should set the property value
Fail e.style['shape-outside'] = "circle(farthest-corner at center)" should set the property value
Fail e.style['shape-outside'] = "circle(farthest-side at center top)" should set the property value
Fail e.style['shape-outside'] = "circle(farthest-side at center)" should set the property value

20
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-computed.txt Normal file
View file

@ -0,0 +1,20 @@
Harness status: OK
Found 14 tests
5 Pass
9 Fail
Fail Property shape-outside value 'ellipse()'
Fail Property shape-outside value 'ellipse(1px 2px)'
Pass Property shape-outside value 'ellipse(20px 40px at center)'
Fail Property shape-outside value 'ellipse(closest-side 20%)'
Fail Property shape-outside value 'ellipse(farthest-side 20%)'
Fail Property shape-outside value 'ellipse(closest-corner 20%)'
Fail Property shape-outside value 'ellipse(farthest-corner 20%)'
Fail Property shape-outside value 'ellipse(at 10% 20%)'
Fail Property shape-outside value 'ellipse(at -10px -20%)'
Pass Property shape-outside value 'ellipse(4% 20% at top right)'
Fail Property shape-outside value 'ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))'
Pass Property shape-outside value 'ellipse(10px closest-side at top right)'
Pass Property shape-outside value 'ellipse(farthest-side 20px at center top)'
Pass Property shape-outside value 'ellipse(farthest-side farthest-side at top right)'

15
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-invalid.txt Normal file
View file

@ -0,0 +1,15 @@
Harness status: OK
Found 10 tests
10 Pass
Pass e.style['shape-outside'] = "ellipse(10px)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(10px -20px)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(20px, 40px at center)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(farthest-side at)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(1% 2% top right)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(3% at 100% 0%)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(closest-side)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(farthest-side at 100% 0%)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(10% -20% at 30% 40%)" should not set the property value
Pass e.style['shape-outside'] = "ellipse(-50px 60px at 70% 80%)" should not set the property value

19
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-valid.txt Normal file
View file

@ -0,0 +1,19 @@
Harness status: OK
Found 14 tests
14 Fail
Fail e.style['shape-outside'] = "ellipse()" should set the property value
Fail e.style['shape-outside'] = "ellipse(1px 2px)" should set the property value
Fail e.style['shape-outside'] = "ellipse(20px 40px at center)" should set the property value
Fail e.style['shape-outside'] = "ellipse(closest-side 20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(farthest-side 20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(closest-corner 20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(farthest-corner 20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(at 10% 20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(at -10px -20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(4% 20% at top right)" should set the property value
Fail e.style['shape-outside'] = "ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))" should set the property value
Fail e.style['shape-outside'] = "ellipse(10px closest-side at top right)" should set the property value
Fail e.style['shape-outside'] = "ellipse(farthest-side 20px at center top)" should set the property value
Fail e.style['shape-outside'] = "ellipse(farthest-side farthest-side at top right)" should set the property value

16
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-computed.txt Normal file
View file

@ -0,0 +1,16 @@
Harness status: OK
Found 11 tests
11 Fail
Fail Property shape-outside value 'inset(100%)'
Fail Property shape-outside value 'inset(0 1px)'
Fail Property shape-outside value 'inset(0px 1px 2%)'
Fail Property shape-outside value 'inset(-20px -20px 2%)'
Fail Property shape-outside value 'inset(0px 1px 2% 3em)'
Fail Property shape-outside value 'inset(0px calc(100% - 20px) 2% 3em)'
Fail Property shape-outside value 'inset(0px round 100%)'
Fail Property shape-outside value 'inset(0px round 0 1px)'
Fail Property shape-outside value 'inset(0px round 0px 1px 2%)'
Fail Property shape-outside value 'inset(0px round 0px 1px 2% 3em)'
Fail Property shape-outside value 'inset(10px round 20% / 0px 1px 2% 3em)'

17
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-invalid.txt Normal file
View file

@ -0,0 +1,17 @@
Harness status: OK
Found 12 tests
12 Pass
Pass e.style['shape-outside'] = "inset(0px, 1px)" should not set the property value
Pass e.style['shape-outside'] = "inset(0px round 0px, 1px)" should not set the property value
Pass e.style['shape-outside'] = "inset()" should not set the property value
Pass e.style['shape-outside'] = "inset(123)" should not set the property value
Pass e.style['shape-outside'] = "inset(1% 2% 3% 4% 5%)" should not set the property value
Pass e.style['shape-outside'] = "inset(round 0)" should not set the property value
Pass e.style['shape-outside'] = "inset(0px round)" should not set the property value
Pass e.style['shape-outside'] = "inset(0px round 123)" should not set the property value
Pass e.style['shape-outside'] = "inset(0px round 1% 2% 3% 4% 5%)" should not set the property value
Pass e.style['shape-outside'] = "inset(0px round / 1px)" should not set the property value
Pass e.style['shape-outside'] = "inset(10px round -20px)" should not set the property value
Pass e.style['shape-outside'] = "inset(30% round -40%)" should not set the property value

17
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-valid.txt Normal file
View file

@ -0,0 +1,17 @@
Harness status: OK
Found 11 tests
1 Pass
10 Fail
Fail e.style['shape-outside'] = "inset(100%)" should set the property value
Fail e.style['shape-outside'] = "inset(0 1px)" should set the property value
Fail e.style['shape-outside'] = "inset(0px 1px 2%)" should set the property value
Fail e.style['shape-outside'] = "inset(-20px -20px 2%)" should set the property value
Pass e.style['shape-outside'] = "inset(0px 1px 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "inset(0px calc(100% - 20px) 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "inset(0px round 100%)" should set the property value
Fail e.style['shape-outside'] = "inset(0px round 0 1px)" should set the property value
Fail e.style['shape-outside'] = "inset(0px round 0px 1px 2%)" should set the property value
Fail e.style['shape-outside'] = "inset(0px round 0px 1px 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "inset(10px round 20% / 0px 1px 2% 3em)" should set the property value

9
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/polygon-function-computed.txt Normal file
View file

@ -0,0 +1,9 @@
Harness status: OK
Found 4 tests
4 Fail
Fail Property shape-outside value 'polygon(1% 2%)'
Fail Property shape-outside value 'polygon(calc(100% - 20px) calc(30% + 10px))'
Fail Property shape-outside value 'polygon(nonzero, 1px 2px, 3em 4em)'
Fail Property shape-outside value 'polygon(evenodd, 1px 2px, 3em 4em, 6pt 6%)'

8
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/polygon-function-invalid.txt Normal file
View file

@ -0,0 +1,8 @@
Harness status: OK
Found 3 tests
3 Pass
Pass e.style['shape-outside'] = "polygon(100px)" should not set the property value
Pass e.style['shape-outside'] = "polygon(1%)" should not set the property value
Pass e.style['shape-outside'] = "polygon(evenodd, 1px, 2px, 3em 4em, 5pt 6%)" should not set the property value

10
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/polygon-function-valid.txt Normal file
View file

@ -0,0 +1,10 @@
Harness status: OK
Found 4 tests
1 Pass
3 Fail
Fail e.style['shape-outside'] = "polygon(1% 2%)" should set the property value
Fail e.style['shape-outside'] = "polygon(calc(100% - 20px) calc(30% + 10px))" should set the property value
Fail e.style['shape-outside'] = "polygon(nonzero, 1px 2px, 3em 4em)" should set the property value
Pass e.style['shape-outside'] = "polygon(evenodd, 1px 2px, 3em 4em, 5pt 6%)" should set the property value

16
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/rect-function-computed.txt Normal file
View file

@ -0,0 +1,16 @@
Harness status: OK
Found 11 tests
11 Fail
Fail Property clip-path value 'rect(0 0 0 0)'
Fail Property clip-path value 'rect(10px auto 20px 30px)'
Fail Property clip-path value 'rect(auto auto auto auto)'
Fail Property clip-path value 'rect(10% 20% 15% 12%)'
Fail Property clip-path value 'rect(10% 95% 97% 12%)'
Fail Property clip-path value 'rect(-10% -20% -15% -12%)'
Fail Property clip-path value 'rect(10px 12% 20px 30px round 100%)'
Fail Property clip-path value 'rect(10px 12% 20px 30px round 0 1px)'
Fail Property clip-path value 'rect(10px 12% 20px 30px round 0px 1px 2%)'
Fail Property clip-path value 'rect(10px 12% 20px 30px round 0px 1px 2% 3em)'
Fail Property clip-path value 'rect(10px 12% 20px 30px round 20% / 0px 1px 2% 3em)'

19
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/rect-function-invalid.txt Normal file
View file

@ -0,0 +1,19 @@
Harness status: OK
Found 14 tests
14 Pass
Pass e.style['clip-path'] = "rect()" should not set the property value
Pass e.style['clip-path'] = "rect(0px)" should not set the property value
Pass e.style['clip-path'] = "rect(0px 1px)" should not set the property value
Pass e.style['clip-path'] = "rect(0px 1px 2px)" should not set the property value
Pass e.style['clip-path'] = "rect(0px, 1px, 2px, 3px)" should not set the property value
Pass e.style['clip-path'] = "rect(0, 1, 2, 3)" should not set the property value
Pass e.style['clip-path'] = "rect(1% 2% 3% 4% 5%)" should not set the property value
Pass e.style['clip-path'] = "rect(round 0)" should not set the property value
Pass e.style['clip-path'] = "rect(10px auto 20px 30px round)" should not set the property value
Pass e.style['clip-path'] = "rect(10px auto 20px 30px round 123)" should not set the property value
Pass e.style['clip-path'] = "rect(10px auto 20px 30px round 1% 2% 3% 4% 5%)" should not set the property value
Pass e.style['clip-path'] = "rect(10px auto 20px 30px round / 1px)" should not set the property value
Pass e.style['clip-path'] = "rect(10px auto 20px 30px round -20px)" should not set the property value
Pass e.style['clip-path'] = "rect(10px auto 20px 30px round -40%)" should not set the property value

17
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/rect-function-valid.txt Normal file
View file

@ -0,0 +1,17 @@
Harness status: OK
Found 11 tests
6 Pass
5 Fail
Pass e.style['clip-path'] = "rect(0 0 0 0)" should set the property value
Pass e.style['clip-path'] = "rect(10px auto 20px 30px)" should set the property value
Pass e.style['clip-path'] = "rect(auto auto auto auto)" should set the property value
Pass e.style['clip-path'] = "rect(10% 20% 15% 12%)" should set the property value
Pass e.style['clip-path'] = "rect(10% 95% 97% 12%)" should set the property value
Pass e.style['clip-path'] = "rect(-10% -20% -15% -12%)" should set the property value
Fail e.style['clip-path'] = "rect(10px 12% 20px 30px round 100%)" should set the property value
Fail e.style['clip-path'] = "rect(10px 12% 20px 30px round 0 1px)" should set the property value
Fail e.style['clip-path'] = "rect(10px 12% 20px 30px round 0px 1px 2%)" should set the property value
Fail e.style['clip-path'] = "rect(10px 12% 20px 30px round 0px 1px 2% 3em)" should set the property value
Fail e.style['clip-path'] = "rect(10px 12% 20px 30px round 20% / 0px 1px 2% 3em)" should set the property value

36
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/shape-function-computed.txt Normal file
View file

@ -0,0 +1,36 @@
Harness status: OK
Found 31 tests
31 Fail
Fail Property clip-path value 'shape(from 20px 40px, line to 20px 30px)'
Fail Property clip-path value 'shape(from 20px 40px, line to 20px 30px )'
Fail Property clip-path value 'shape(from 0 0, line to 100% 100%)'
Fail Property clip-path value 'shape(from 20px 40px, move to 20px 30px, line by 20px 30px)'
Fail Property clip-path value 'shape(from 20px 40px, move to 20px 30px, hline to 100px)'
Fail Property clip-path value 'shape(from 20px 40px, move to 20px 30px, hline by 100%)'
Fail Property clip-path value 'shape(from 20px 40px, move to 20px 30px, vline to 100px)'
Fail Property clip-path value 'shape(from 20px 40px, move to 20px 30px, vline by 100%)'
Fail Property clip-path value 'shape(from 20px 40px, curve by 20px 20px with 10px 30px)'
Fail Property clip-path value 'shape(from 20px 40px, curve by 20px 20px with 10px 30px / 12px 32px)'
Fail Property clip-path value 'shape(from center, curve to center bottom with top right / bottom right)'
Fail Property clip-path value 'shape(from center, curve by 20px 20px with 10px 30px from end / 12px 32px from start)'
Fail Property clip-path value 'shape(from center right, curve by 20px 20px with 10px 30px from origin / 12px 32px from origin)'
Fail Property clip-path value 'shape(from 20px 40px, curve to top right with 10px 30px from origin / 12px 32px from origin)'
Fail Property clip-path value 'shape(from 20px 40px, smooth by 20px 20px)'
Fail Property clip-path value 'shape(from 20px 40px, smooth by 20px 20px with 12px 32px)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10%)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 0)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 0)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% rotate 0deg)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20%)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% cw)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% large)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of -10% -20% large)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% rotate 1deg)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% cw rotate 12deg)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% cw rotate 3.14159265rad)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% large rotate 12deg)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% large cw)'
Fail Property clip-path value 'shape(from 20px 40px, arc by 20px 20px of 10% 20% rotate 12deg large)'

45
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/shape-function-invalid.txt Normal file
View file

@ -0,0 +1,45 @@
Harness status: OK
Found 40 tests
40 Pass
Pass e.style['clip-path'] = "shape(from 20px 40px line to 20px 30px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px line to 20px 30px,)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px, 40px, line to 20px, 30px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to top)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to bottom)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to y-start)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to y-end)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline to left)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline to right)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline to x-start)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline to x-end)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to top 20px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to right, vline to bottom left, close)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline by left)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline by right)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline by top)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline by bottom)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve to 20px 20px, using 10px 30px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve to 20px 20px using 10px 30px, 12px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px, using 10px 30px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px using 10px 30px, 12px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px via 10px 30px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px via 10px 30px 12px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, smooth by 20px 20px via 10px 30px / 12px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, smooth by 20px 20px using 10px 30px 12px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve to 20px 20px with 10px 30px 12px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px with 10px 30px 12px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px with 10px 30px /)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by top left using 10px 30px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 30px using top right)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve to 20px 30px using top right / 20px from end)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, arc by top right of 10% 20%)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, arc by 10px 20px of top right small cw)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 30px from start, using 23px 32px)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, curve to 20px 20px using top left from origin / 12px 32px from end)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% 12deg)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% rotate 12deg rotate 13deg)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large 12deg)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% small large)" should not set the property value
Pass e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw ccw)" should not set the property value

56
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/shape-function-valid.txt Normal file
View file

@ -0,0 +1,56 @@
Harness status: OK
Found 51 tests
51 Fail
Fail e.style['clip-path'] = "shape(from 20px 40px, line to 20px 30px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, line to 20px 30px )" should set the property value
Fail e.style['clip-path'] = "shape(from 0 0, line to 100% 100%)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, line by 20px 30px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to 100px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline by 100%)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline to 100px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline by 100%)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to left, hline to center, hline to right)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, hline to x-start, vline to y-start)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline to top, vline to center, vline to bottom)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, move to 20px 30px, vline to y-start, vline to y-end)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to 20px 20px with 10px 30px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to 20em 20pt with 10vw 30vh)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to 10% 20% with 10px 30px / 12px 32px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to top left with 10px 30px / 12px 32px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20% 40%, curve to center with center right / bottom center)" should set the property value
Fail e.style['clip-path'] = "shape(from bottom right, curve to left with center right / bottom center)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to bottom left with 10px 30px from end)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to right center with 10px 30px from start / 12px 32px from end)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to right center with 10px 30px from start/12px 32px from end)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to right center with 10px 30px from end / 12px 32px from origin)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve to right center with 10px 30px from origin / 12px 32px from start)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px with 10px 30px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px with 10px 30px from origin)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve by 20px 20px with 10px 30px / 12px 32px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve by 20% 20em with 10px 30px from start / 12px 32px from end)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, curve by 20% 20em with 10.3% 30px from origin / 12pt 5.4% from start)" should set the property value
Fail e.style['clip-path'] = "shape(from top left, smooth to top right)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, smooth to center 20%)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, smooth by 20px 20px)" should set the property value
Fail e.style['clip-path'] = "shape(from right bottom, smooth by 20px 20px with 12px 32px)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, smooth by 20pt 20px with 12px 32px from start)" should set the property value
Fail e.style['clip-path'] = "shape(from center 40px, smooth by 20% 20% with 12px 32px from end)" should set the property value
Fail e.style['clip-path'] = "shape(from center, smooth by 20px 20px with 12px 32px from origin)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc to top right of 10%)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10%)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 0)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 0)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20% 20pt of 10% rotate 0deg)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20%)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% large)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of -10% -20% large)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% rotate 1deg)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw rotate 12deg)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10px 20px cw rotate 0.52rad)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% large rotate 12deg)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% large cw)" should set the property value
Fail e.style['clip-path'] = "shape(from 20px 40px, arc by 20px 20px of 10% 20% rotate 12deg large)" should set the property value

12
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-computed.txt Normal file
View file

@ -0,0 +1,12 @@
Harness status: OK
Found 7 tests
7 Fail
Fail Property shape-outside value 'xywh(0px 1px 2% 3em)'
Fail Property shape-outside value 'xywh(0px calc(100% - 20px) 2% 3em)'
Fail Property shape-outside value 'xywh(10px 20px 30px 25px round 100%)'
Fail Property shape-outside value 'xywh(10px 20px 30px 25px round 0 1px)'
Fail Property shape-outside value 'xywh(10px 20px 30px 25px round 0px 1px 2%)'
Fail Property shape-outside value 'xywh(10px 20px 30px 25px round 0px 1px 2% 3em)'
Fail Property shape-outside value 'xywh(10px 20px 30px 25px round 20% / 0px 1px 2% 3em)'

11
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-invalid.txt Normal file
View file

@ -0,0 +1,11 @@
Harness status: OK
Found 6 tests
6 Pass
Pass e.style['shape-outside'] = "xywh(0px 1px -2% 3em)" should not set the property value
Pass e.style['shape-outside'] = "xywh(0px 1px 2% -3em)" should not set the property value
Pass e.style['shape-outside'] = "xywh(10px 20px)" should not set the property value
Pass e.style['shape-outside'] = "xywh(10px 20px 30px)" should not set the property value
Pass e.style['shape-outside'] = "xywh(10px 20px, 30px 25px)" should not set the property value
Pass e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 0px -1px 2%)" should not set the property value

13
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-valid.txt Normal file
View file

@ -0,0 +1,13 @@
Harness status: OK
Found 7 tests
1 Pass
6 Fail
Pass e.style['shape-outside'] = "xywh(0px 1px 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "xywh(0px calc(100% - 20px) 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 100%)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 0 1px)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 0px 1px 2%)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 0px 1px 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 20% / 0px 1px 2% 3em)" should set the property value

87
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/animation/shape-image-threshold-interpolation.html Normal file
View file

@ -0,0 +1,87 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>shape-image-threshold interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-image-threshold-property">
<meta name="assert" content="shape-image-threshold supports animation by computed value">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/interpolation-testcommon.js"></script>
<style>
.parent {
shape-image-threshold: 0.4;
}
.target {
shape-image-threshold: 0.6;
}
</style>
<body></body>
<script>
test_interpolation({
property: 'shape-image-threshold',
from: neutralKeyframe,
to: '0.8',
}, [
{at: -1.5, expect: '0.3'},
{at: -0.5, expect: '0.5'},
{at: 0, expect: '0.6'},
{at: 0.5, expect: '0.7'},
{at: 1, expect: '0.8'},
{at: 1.5, expect: '0.9'},
]);
test_interpolation({
property: 'shape-image-threshold',
from: 'initial',
to: '0.8',
}, [
{at: -1.5, expect: '0'},
{at: -0.5, expect: '0'},
{at: 0, expect: '0'},
{at: 0.5, expect: '0.4'},
{at: 1, expect: '0.8'},
{at: 1.5, expect: '1'},
]);
test_interpolation({
property: 'shape-image-threshold',
from: 'inherit',
to: '0.8',
}, [
{at: -1.5, expect: '0'},
{at: -0.5, expect: '0.2'},
{at: 0, expect: '0.4'},
{at: 0.5, expect: '0.6'},
{at: 1, expect: '0.8'},
{at: 1.5, expect: '1'},
]);
test_interpolation({
property: 'shape-image-threshold',
from: 'unset',
to: '0.8',
}, [
{at: -1.5, expect: '0'},
{at: -0.5, expect: '0'},
{at: 0, expect: '0'},
{at: 0.5, expect: '0.4'},
{at: 1, expect: '0.8'},
{at: 1.5, expect: '1'},
]);
test_interpolation({
property: 'shape-image-threshold',
from: '0.5',
to: '1'
}, [
{at: -1.5, expect: '0'},
{at: -0.5, expect: '0.25'},
{at: 0, expect: '0.5'},
{at: 0.5, expect: '0.75'},
{at: 1, expect: '1'},
{at: 1.5, expect: '1'}
]);
</script>

65
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/animation/shape-margin-composition.html Normal file
View file

@ -0,0 +1,65 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>shape-margin composition</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-margin-property">
<meta name="assert" content="shape-margin supports animation by computed value">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'shape-margin',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'shape-margin',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'}, // Value clamping should happen after composition.
]);
test_composition({
property: 'shape-margin',
underlying: '10%',
addFrom: '100px',
addTo: '20%',
}, [
{at: -0.3, expect: 'calc(130px + 4%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 20%)'},
{at: 1, expect: '30%'},
{at: 1.5, expect: 'calc(-50px + 40%)'},
]);
test_composition({
property: 'shape-margin',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
</script>
</body>

87
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/animation/shape-margin-interpolation.html Normal file
View file

@ -0,0 +1,87 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>shape-margin interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-margin-property">
<meta name="assert" content="shape-margin supports animation by computed value">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/interpolation-testcommon.js"></script>
<style>
.parent {
shape-margin: 30px;
}
.target {
shape-margin: 10px;
}
</style>
<body></body>
<script>
test_interpolation({
property: 'shape-margin',
from: neutralKeyframe,
to: '20px',
}, [
{at: -0.3, expect: '7px'},
{at: 0, expect: '10px'},
{at: 0.3, expect: '13px'},
{at: 0.6, expect: '16px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '25px'},
]);
test_interpolation({
property: 'shape-margin',
from: 'initial',
to: '20px',
}, [
{at: -0.3, expect: '0px'},
{at: 0, expect: '0px'},
{at: 0.3, expect: '6px'},
{at: 0.6, expect: '12px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '30px'},
]);
test_interpolation({
property: 'shape-margin',
from: 'inherit',
to: '20px',
}, [
{at: -0.3, expect: '33px'},
{at: 0, expect: '30px'},
{at: 0.3, expect: '27px'},
{at: 0.6, expect: '24px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '15px'},
]);
test_interpolation({
property: 'shape-margin',
from: 'unset',
to: '20px',
}, [
{at: -0.3, expect: '0px'},
{at: 0, expect: '0px'},
{at: 0.3, expect: '6px'},
{at: 0.6, expect: '12px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '30px'},
]);
test_interpolation({
property: 'shape-margin',
from: '0px',
to: '100px'
}, [
{at: -0.3, expect: '0px'}, // CSS shape-margin can't be negative.
{at: 0, expect: '0px'},
{at: 0.3, expect: '30px'},
{at: 0.6, expect: '60px'},
{at: 1, expect: '100px'},
{at: 1.5, expect: '150px'},
]);
</script>

189
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/animation/shape-outside-composition.html Normal file
View file

@ -0,0 +1,189 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>shape-outside composition</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-outside-property">
<meta name="assert" content="shape-outside supports animation as <basic-shape> or discrete">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'shape-outside',
underlying: 'circle(100px at 25px 25%)',
addFrom: 'circle(10px at 25px 75%)',
addTo: 'circle(50px at 50px center)',
}, [
{at: -0.3, expect: 'circle(98px at 42.5px 107.5%)'},
{at: 0, expect: 'circle(110px at 50px 100%)'},
{at: 0.3, expect: 'circle(122px at 57.5px 92.5%)'},
{at: 0.6, expect: 'circle(134px at 65px 85%)'},
{at: 1, expect: 'circle(150px at 75px 75%)'},
{at: 1.5, expect: 'circle(170px at 87.5px 62.5%)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'circle(100px at 20px 20%)',
addFrom: 'circle(50px at 50px 50%)',
replaceTo: 'circle(50% at 150px 150%)',
}, [
{at: -0.3, expect: 'circle(calc(195px + -15%) at 46px 46%)'},
{at: 0, expect: 'circle(calc(150px + 0%) at 70px 70%)'},
{at: 0.3, expect: 'circle(calc(105px + 15%) at 94px 94%)'},
{at: 0.6, expect: 'circle(calc(60px + 30%) at 118px 118%)'},
{at: 1, expect: 'circle(50% at 150px 150%)'},
{at: 1.5, expect: 'circle(calc(-75px + 75%) at 190px 190%)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'circle(farthest-side at 25px 75%)',
addFrom: 'circle(farthest-side at 25px 75%)',
addTo: 'circle(farthest-side at 50px center)',
}, [
{at: 0.25, expect: 'circle(farthest-side at 25px 75%)'},
{at: 0.75, expect: 'circle(farthest-side at 50px 50%)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'circle(50px at 10px 20px)',
addFrom: 'circle(50px at 10px 20px)',
addTo: 'circle(farthest-side at 30px 40px)',
}, [
{at: 0.25, expect: 'circle(100px at 20px 40px)'},
{at: 0.75, expect: 'circle(farthest-side at 30px 40px)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'ellipse(10px 20px at 30px 40px)',
addFrom: 'ellipse(40px 30px at 20px 10px)',
addTo: 'ellipse(140px 130px at 120px 110px)',
}, [
{at: -0.3, expect: 'ellipse(20px 20px at 20px 20px)'},
{at: 0, expect: 'ellipse(50px 50px at 50px 50px)'},
{at: 0.3, expect: 'ellipse(80px 80px at 80px 80px)'},
{at: 0.6, expect: 'ellipse(110px 110px at 110px 110px)'},
{at: 1, expect: 'ellipse(150px 150px at 150px 150px)'},
{at: 1.5, expect: 'ellipse(200px 200px at 200px 200px)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'ellipse(10px 20px at 30px 40px)',
replaceFrom: 'ellipse(40px 30px at 20px 10px)',
addTo: 'ellipse(40px 30px at 20px 10px)',
}, [
{at: -0.3, expect: 'ellipse(37px 24px at 11px -2px)'},
{at: 0, expect: 'ellipse(40px 30px at 20px 10px)'},
{at: 0.3, expect: 'ellipse(43px 36px at 29px 22px)'},
{at: 0.6, expect: 'ellipse(46px 42px at 38px 34px)'},
{at: 1, expect: 'ellipse(50px 50px at 50px 50px)'},
{at: 1.5, expect: 'ellipse(55px 60px at 65px 70px)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'ellipse(25px 75%)',
addFrom: 'ellipse()',
addTo: 'ellipse(closest-side farthest-side)',
}, [
{at: 0.25, expect: 'ellipse()'},
{at: 0.75, expect: 'ellipse(closest-side farthest-side)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'inset(20px)',
addFrom: 'inset(20px)',
addTo: 'inset(40%)',
}, [
{at: -0.3, expect: 'inset(calc(46px + -12%))'},
{at: 0, expect: 'inset(calc(40px + 0%))'},
{at: 0.3, expect: 'inset(calc(34px + 12%))'},
{at: 0.6, expect: 'inset(calc(28px + 24%))'},
{at: 1, expect: 'inset(calc(20px + 40%))'},
{at: 1.5, expect: 'inset(calc(10px + 60%))'},
]);
test_composition({
property: 'shape-outside',
underlying: 'inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)',
addFrom: 'inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)',
replaceTo: 'inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)',
}, [
{at: -0.3, expect: 'inset(-28px -26px -24px -22px round 0px 10px 30px 50px / 70px 90px 110px 130px)'},
{at: 0, expect: 'inset(2px 4px 6px 8px round 20px 40px 60px 80px / 100px 120px 140px 160px)'},
{at: 0.25, expect: 'inset(27px 29px 31px 33px round 45px 65px 85px 105px / 125px 145px 165px 185px)'},
{at: 0.75, expect: 'inset(77px 79px 81px 83px round 95px 115px 135px 155px / 175px 195px 215px 235px)'},
{at: 1, expect: 'inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)'},
{at: 1.5, expect: 'inset(152px 154px 156px 158px round 170px 190px 210px 230px / 250px 270px 290px 310px)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'inset(1px 2px round 100px 200px)',
addFrom: 'inset(1px 2px round 100px 200px)',
addTo: 'inset(101px 102px 101px 102px)',
}, [
{at: -0.3, expect: 'inset(-28px -26px round 230px 460px)'},
{at: 0, expect: 'inset(2px 4px round 200px 400px)'},
{at: 0.3, expect: 'inset(32px 34px round 170px 340px)'},
{at: 0.6, expect: 'inset(62px 64px round 140px 280px)'},
{at: 1, expect: 'inset(102px 104px round 100px 200px)'},
{at: 1.5, expect: 'inset(152px 154px round 50px 100px)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'polygon(10px 20%, 30px 40%)',
addFrom: 'polygon(10px 20%, 30px 40%)',
addTo: 'polygon(110px 120%, 130px 140%)',
}, [
{at: -0.3, expect: 'polygon(-10px 10%, 30px 50%)'},
{at: 0, expect: 'polygon(20px 40%, 60px 80%)'},
{at: 0.3, expect: 'polygon(50px 70%, 90px 110%)'},
{at: 0.6, expect: 'polygon(80px 100%, 120px 140%)'},
{at: 1, expect: 'polygon(120px 140%, 160px 180%)'},
{at: 1.5, expect: 'polygon(170px 190%, 210px 230%)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'polygon(evenodd, 10px 20px)',
addFrom: 'polygon(evenodd, 10px 20px)',
addTo: 'polygon(evenodd, 110px 120px)',
}, [
{at: -0.3, expect: 'polygon(evenodd, -10px 10px)'},
{at: 0, expect: 'polygon(evenodd, 20px 40px)'},
{at: 0.3, expect: 'polygon(evenodd, 50px 70px)'},
{at: 0.6, expect: 'polygon(evenodd, 80px 100px)'},
{at: 1, expect: 'polygon(evenodd, 120px 140px)'},
{at: 1.5, expect: 'polygon(evenodd, 170px 190px)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'polygon(evenodd, 10px 20px)',
addFrom: 'polygon(evenodd, 10px 20px)',
addTo: 'polygon(nonzero, 30px 40px)',
}, [
{at: 0.25, expect: 'polygon(evenodd, 20px 40px)'},
{at: 0.75, expect: 'polygon(30px 40px)'},
]);
test_composition({
property: 'shape-outside',
underlying: 'polygon(10px 20px, 30px 40px)',
addFrom: 'polygon(10px 20px, 30px 40px)',
addTo: 'polygon(30px 40px)',
}, [
{at: 0.25, expect: 'polygon(20px 40px, 60px 80px)'},
{at: 0.75, expect: 'polygon(30px 40px)'},
]);
</script>
</body>

137
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/animation/shape-outside-interpolation.html Normal file
View file

@ -0,0 +1,137 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>shape-outside interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-outside-property">
<meta name="assert" content="shape-outside supports animation as <basic-shape> or discrete">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/interpolation-testcommon.js"></script>
<style>
.parent {
shape-outside: circle(80% at 30% 10%);
}
.target {
shape-outside: circle(60% at 10% 30%);
}
</style>
<body></body>
<script>
/* TODO: add inset test once blend() works for it */
test_interpolation({
property: 'shape-outside',
from: neutralKeyframe,
to: 'circle(40% at 20% 20%)',
}, [
{at: -0.3, expect: 'circle(66% at 7% 33%)'},
{at: 0, expect: 'circle(60% at 10% 30%)'},
{at: 0.3, expect: 'circle(54% at 13% 27%)'},
{at: 0.6, expect: 'circle(48% at 16% 24%)'},
{at: 1, expect: 'circle(40% at 20% 20%)'},
{at: 1.5, expect: 'circle(30% at 25% 15%)'},
]);
test_no_interpolation({
property: 'shape-outside',
from: 'initial',
to: 'circle(40% at 20% 20%)',
});
test_interpolation({
property: 'shape-outside',
from: 'inherit',
to: 'circle(40% at 20% 20%)',
}, [
{at: -0.3, expect: 'circle(92% at 33% 7%)'},
{at: 0, expect: 'circle(80% at 30% 10%)'},
{at: 0.3, expect: 'circle(68% at 27% 13%)'},
{at: 0.6, expect: 'circle(56% at 24% 16%)'},
{at: 1, expect: 'circle(40% at 20% 20%)'},
{at: 1.5, expect: 'circle(20% at 15% 25%)'},
]);
test_no_interpolation({
property: 'shape-outside',
from: 'unset',
to: 'circle(40% at 20% 20%)',
});
test_interpolation({
property: 'shape-outside',
from: 'circle(100% at 0% 0%)',
to: 'circle(50% at 25% 25%)',
}, [
{at: -0.3, expect: 'circle(115% at -7.5% -7.5%)'},
{at: 0, expect: 'circle(100% at 0% 0%)'},
{at: 0.3, expect: 'circle(85% at 7.5% 7.5%)'},
{at: 0.6, expect: 'circle(70% at 15% 15%)'},
{at: 1, expect: 'circle(50% at 25% 25%)'},
{at: 1.5, expect: 'circle(25% at 37.5% 37.5%)'}
]);
test_interpolation({
property: 'shape-outside',
from: 'ellipse(100% 100% at 0% 0%)',
to: 'ellipse(50% 50% at 25% 25%)',
}, [
{at: -0.3, expect: 'ellipse(115% 115% at -7.5% -7.5%)'},
{at: 0, expect: 'ellipse(100% 100% at 0% 0%)'},
{at: 0.3, expect: 'ellipse(85% 85% at 7.5% 7.5%)'},
{at: 0.6, expect: 'ellipse(70% 70% at 15% 15%)'},
{at: 1, expect: 'ellipse(50% 50% at 25% 25%)'},
{at: 1.5, expect: 'ellipse(25% 25% at 37.5% 37.5%)'}
]);
test_interpolation({
property: 'shape-outside',
from: 'polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)',
to: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)',
}, [
{at: -0.3, expect: 'polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)'},
{at: 0, expect: 'polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)'},
{at: 0.3, expect: 'polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)'},
{at: 0.6, expect: 'polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)'},
{at: 1, expect: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)'},
{at: 1.5, expect: 'polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)'}
]);
test_no_interpolation({
property: 'shape-outside',
from: 'polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)',
to: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)',
});
test_interpolation({
property: 'shape-outside',
from: 'inset(100%)',
to: 'inset(120%)',
}, [
{at: -0.3, expect: 'inset(94%)'},
{at: 0, expect: 'inset(100%)'},
{at: 0.3, expect: 'inset(106%)'},
{at: 0.6, expect: 'inset(112%)'},
{at: 1, expect: 'inset(120%)'},
{at: 1.5, expect: 'inset(130%)'},
]);
test_no_interpolation({
property: 'shape-outside',
from: 'none',
to: 'ellipse(100% 100% at 0% 0%)',
});
// TODO: add intermediate keyframe tests when CSS shapes position computed values are cleaned up
test_interpolation({
property: 'shape-outside',
from: 'circle(25% at right 5% bottom 15px)',
to: 'circle(45% at right 25% bottom 35px)',
}, [
{at: 0.25, expect: 'circle(30% at 90% calc(-20px + 100%))'},
{at: 0.5, expect: 'circle(35% at 85% calc(-25px + 100%))'},
{at: 0.75, expect: 'circle(40% at 80% calc(-30px + 100%))'},
]);
</script>

25
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-image-threshold-computed.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: getComputedStyle().shapeImageThreshold</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-image-threshold-property">
<meta name="assert" content="shape-image-threshold computed value is as specified, clamped to [0,1].">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("shape-image-threshold", "-7", "0");
test_computed_value("shape-image-threshold", "0.5");
test_computed_value("shape-image-threshold", "12.5", "1");
// https://github.com/w3c/csswg-drafts/issues/4102
test_computed_value("shape-image-threshold", "-100%", "0");
test_computed_value("shape-image-threshold", "50%", "0.5");
test_computed_value("shape-image-threshold", "300%", "1");
</script>
</body>
</html>

19
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-image-threshold-invalid.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing shape-image-threshold with invalid values</title>
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-image-threshold-property">
<meta name="assert" content="shape-image-threshold supports only the grammar '<number>'.">
<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("shape-image-threshold", "auto");
test_invalid_value("shape-image-threshold", "10px");
</script>
</body>
</html>

24
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-image-threshold-valid.html Normal file
View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing shape-image-threshold with valid values</title>
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-image-threshold-property">
<meta name="assert" content="shape-image-threshold supports the full grammar '<number>'.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("shape-image-threshold", "12.5");
test_valid_value("shape-image-threshold", "-7");
// https://github.com/w3c/csswg-drafts/issues/4102
test_valid_value("shape-image-threshold", "-100%", "-1");
test_valid_value("shape-image-threshold", "50%", "0.5");
test_valid_value("shape-image-threshold", "300%", "3");
</script>
</body>
</html>

25
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-margin-computed.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: getComputedStyle().shapeMargin</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-margin-property">
<meta name="assert" content="shape-margin computed value is non-negative <length-percentage>.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<style>
#target {
font-size: 40px;
}
</style>
<div id="target"></div>
<script>
test_computed_value("shape-margin", "calc(10px + 0.5em)", "30px");
test_computed_value("shape-margin", "calc(10px - 0.5em)", "0px");
test_computed_value("shape-margin", "50%");
</script>
</body>
</html>

19
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-margin-invalid.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing shape-margin with invalid values</title>
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-margin-property">
<meta name="assert" content="shape-margin supports only the grammar '<length> | <percentage>'.">
<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("shape-margin", "none");
test_invalid_value("shape-margin", "10");
</script>
</body>
</html>

21
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-margin-valid.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing shape-margin with valid values</title>
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-margin-property">
<meta name="assert" content="shape-margin supports the full grammar '<length> | <percentage>'.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("shape-margin", "0", "0px");
test_valid_value("shape-margin", "10px");
test_valid_value("shape-margin", "20em");
test_valid_value("shape-margin", "37.5%");
</script>
</body>
</html>

40
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-outside-computed.html Normal file
View file

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: getComputedStyle().shapeOutside</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes/#shape-outside-property">
<meta name="assert" content="shape-outside computed value is as specified.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<style>
#target {
font-size: 40px;
}
</style>
<div>
<div id="target"></div>
</div>
<script>
// TODO: Add inset() tests
test_computed_value("shape-outside", "circle(at 10% 20%)");
test_computed_value("shape-outside", "circle(at calc(75% + 0px) calc(75% + 0px))", "circle(at 75% 75%)");
test_computed_value("shape-outside", "circle(calc(10px + 0.5em) at -50% 50%) border-box", "circle(30px at -50% 50%) border-box");
test_computed_value("shape-outside", "circle(calc(10px - 0.5em) at 50% -50%) border-box", "circle(0px at 50% -50%) border-box");
test_computed_value("shape-outside", "circle(at top 0% right calc(10% * sign(1em - 1px)))", "circle(at 90% 0%)");
test_computed_value("shape-outside", "circle(at top 0% right calc(10% * sibling-index()))", "circle(at 90% 0%)");
test_computed_value("shape-outside", "ellipse(60% closest-side at 50% 50%)");
test_computed_value("shape-outside", "ellipse(calc(10px + 0.5em) calc(10px - 0.5em) at -50% 50%) padding-box", "ellipse(30px 0px at -50% 50%) padding-box");
test_computed_value("shape-outside", "ellipse(calc(10px - 0.5em) calc(10px + 0.5em) at 50% -50%) border-box", "ellipse(0px 30px at 50% -50%) border-box");
test_computed_value("shape-outside", "polygon(evenodd, -10px, -20px, -30px, -40px, -50px, -60px) margin-box");
test_computed_value("shape-outside", "polygon(10%, 20%, 30%, 40%, 50%, 60%) content-box");
test_computed_value("shape-outside", "polygon(calc(10px - 0.5em), 20%, 30%, 40%, 50%, calc(10px - 0.5em))", "polygon(-10px, 20%, 30%, 40%, 50%, -10px)");
</script>
</body>
</html>

29
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-outside-invalid-position.html Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing shape-outside with invalid position values</title>
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-values-4/#typedef-position">
<meta name="assert" content="shape-outside positions support only the '<position>' grammar.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
// The following were supported in an earlier version of the spec.
// https://github.com/w3c/csswg-drafts/issues/2140
test_invalid_value("shape-outside", "circle(at center left 1px)");
test_invalid_value("shape-outside", "circle(at center top 2px)");
test_invalid_value("shape-outside", "circle(at right 3% center)");
test_invalid_value("shape-outside", "circle(at left 4px top)");
test_invalid_value("shape-outside", "circle(at right 5px top)");
test_invalid_value("shape-outside", "ellipse(at right top 5px)");
test_invalid_value("shape-outside", "ellipse(at bottom 6% center)");
test_invalid_value("shape-outside", "ellipse(at bottom 7% left)");
test_invalid_value("shape-outside", "ellipse(at bottom right 8%)");
test_invalid_value("shape-outside", "ellipse(at right 10px top)");
</script>
</body>
</html>

38
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/parsing/shape-outside-valid-position.html Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing shape-outside with valid position values</title>
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-values-4/#typedef-position">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8695">
<meta name="assert" content="shape-outside positions support the full '<position>' grammar.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("shape-outside", "circle(at 10%)", "circle(at 10% 50%)");
test_valid_value("shape-outside", "circle(at 20% 30px)");
test_valid_value("shape-outside", "circle(at 30px center)", "circle(at 30px 50%)");
test_valid_value("shape-outside", "circle(at 40px top)", "circle(at 40px 0%)");
test_valid_value("shape-outside", "circle(at bottom 10% right 20%)", "circle(at calc(80%) calc(90%))");
test_valid_value("shape-outside", "circle(at bottom right)", "circle(at 100% 100%)");
test_valid_value("shape-outside", "circle(at center)", "circle(at 50% 50%)");
test_valid_value("shape-outside", "circle(at center 50px)", "circle(at 50% 50px)");
test_valid_value("shape-outside", "circle(at center bottom)", "circle(at 50% 100%)");
test_valid_value("shape-outside", "circle(at center center)", "circle(at 50% 50%)");
test_valid_value("shape-outside", "circle(at center left)", "circle(at 0% 50%)");
test_valid_value("shape-outside", "circle(at left)", "circle(at 0% 50%)");
test_valid_value("shape-outside", "circle(at left bottom)", "circle(at 0% 100%)");
test_valid_value("shape-outside", "circle(at left center)", "circle(at 0% 50%)");
test_valid_value("shape-outside", "circle(at right 40%)", "circle(at 100% 40%)");
test_valid_value("shape-outside", "circle(at right 30% top 60px)", "circle(at calc(70%) 60px)");
test_valid_value("shape-outside", "circle(at top)", "circle(at 50% 0%)");
test_valid_value("shape-outside", "circle(at top center)","circle(at 50% 0%)");
test_valid_value("shape-outside", "circle(at top 0% right calc(10% * sign(1em - 1px)))", "circle(at calc(100% - (10% * sign(1em - 1px))) 0%)");
test_valid_value("shape-outside", "circle(at top 0% right calc(10% * sibling-index()))", "circle(at calc(100% - (10% * sibling-index())) 0%)");
</script>
</body>
</html>

32
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/circle-function-computed.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: the computed value of the circle() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-circle">
<meta name="assert" content="Tests parsing of the circle() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("shape-outside", "circle()");
test_computed_value("shape-outside", "circle(1px)");
test_computed_value("shape-outside", "circle(20px at center)", "circle(20px at 50% 50%)");
test_computed_value("shape-outside", "circle(at 10% 20%)");
test_computed_value("shape-outside", "circle(4% at top right)", "circle(4% at 100% 0%)");
test_computed_value("shape-outside", "circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))", "circle(calc(100% - 20px) at calc(100% - 20px) 25%)");
test_computed_value("shape-outside", "circle(closest-corner at center)", "circle(closest-corner at 50% 50%)");
test_computed_value("shape-outside", "circle(closest-corner at 20px 50px)", "circle(closest-corner at 20px 50px)");
test_computed_value("shape-outside", "circle(closest-side at center)", "circle(at 50% 50%)");
test_computed_value("shape-outside", "circle(closest-side at 20px 30%)", "circle(at 20px 30%)");
test_computed_value("shape-outside", "circle(farthest-corner at center top)", "circle(farthest-corner at 50% 0%)");
test_computed_value("shape-outside", "circle(farthest-corner at center)", "circle(farthest-corner at 50% 50%)");
test_computed_value("shape-outside", "circle(farthest-side at center top)", "circle(farthest-side at 50% 0%)");
test_computed_value("shape-outside", "circle(farthest-side at center)", "circle(farthest-side at 50% 50%)");
</script>
</body>
</html>

26
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/circle-function-invalid.html Normal file
View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the circle() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-circle">
<meta name="assert" content="Tests parsing of the circle() function">
<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("shape-outside", "circle(123)");
test_invalid_value("shape-outside", "circle(at)");
test_invalid_value("shape-outside", "circle(4% 20%)");
test_invalid_value("shape-outside", "circle(4% 20% at center)");
test_invalid_value("shape-outside", "circle(4px 20px)");
test_invalid_value("shape-outside", "circle(4px, 20px)");
test_invalid_value("shape-outside", "circle(at 4px, 20px)");
test_invalid_value("shape-outside", "circle(-10px at 20px 30px)");
test_invalid_value("shape-outside", "circle(-10% at 20% 30%)");
test_invalid_value("shape-outside", "circle(1% 2% at 0% 100%)");
</script>
</body>
</html>

32
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/circle-function-valid.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the circle() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-circle">
<meta name="assert" content="Tests parsing of the circle() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_valid_value("shape-outside", "circle()");
test_valid_value("shape-outside", "circle(1px)");
test_valid_value("shape-outside", "circle(20px at center)", "circle(20px at 50% 50%)");
test_valid_value("shape-outside", "circle(at 10% 20%)");
test_valid_value("shape-outside", "circle(4% at top right)", "circle(4% at 100% 0%)");
test_valid_value("shape-outside", "circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))", "circle(calc(100% - 20px) at calc(100% - 20px) calc(25%))");
test_valid_value("shape-outside", "circle(closest-corner at center)", "circle(closest-corner at 50% 50%)");
test_valid_value("shape-outside", "circle(closest-corner at 20px 50px)", "circle(closest-corner at 20px 50px)");
test_valid_value("shape-outside", "circle(closest-side at center)", "circle(at 50% 50%)");
test_valid_value("shape-outside", "circle(closest-side at 20px 30%)", "circle(at 20px 30%)");
test_valid_value("shape-outside", "circle(farthest-corner at center top)", "circle(farthest-corner at 50% 0%)");
test_valid_value("shape-outside", "circle(farthest-corner at center)", "circle(farthest-corner at 50% 50%)");
test_valid_value("shape-outside", "circle(farthest-side at center top)", "circle(farthest-side at 50% 0%)");
test_valid_value("shape-outside", "circle(farthest-side at center)", "circle(farthest-side at 50% 50%)");
</script>
</body>
</html>

32
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/ellipse-function-computed.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: the computed value of the ellipse() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-ellipse">
<meta name="assert" content="Tests parsing of the ellipse() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("shape-outside", "ellipse()");
test_computed_value("shape-outside", "ellipse(1px 2px)");
test_computed_value("shape-outside", "ellipse(20px 40px at center)", "ellipse(20px 40px at 50% 50%)");
test_computed_value("shape-outside", "ellipse(closest-side 20%)");
test_computed_value("shape-outside", "ellipse(farthest-side 20%)");
test_computed_value("shape-outside", "ellipse(closest-corner 20%)");
test_computed_value("shape-outside", "ellipse(farthest-corner 20%)");
test_computed_value("shape-outside", "ellipse(at 10% 20%)");
test_computed_value("shape-outside", "ellipse(at -10px -20%)");
test_computed_value("shape-outside", "ellipse(4% 20% at top right)", "ellipse(4% 20% at 100% 0%)");
test_computed_value("shape-outside", "ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))", "ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) 25%)");
test_computed_value("shape-outside", "ellipse(10px closest-side at top right)", "ellipse(10px closest-side at 100% 0%)");
test_computed_value("shape-outside", "ellipse(farthest-side 20px at center top)", "ellipse(farthest-side 20px at 50% 0%)");
test_computed_value("shape-outside", "ellipse(farthest-side farthest-side at top right)", "ellipse(farthest-side farthest-side at 100% 0%)");
</script>
</body>
</html>

26
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/ellipse-function-invalid.html Normal file
View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the ellipse() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-ellipse">
<meta name="assert" content="Tests parsing of the ellipse() function">
<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("shape-outside", "ellipse(10px)");
test_invalid_value("shape-outside", "ellipse(10px -20px)");
test_invalid_value("shape-outside", "ellipse(20px, 40px at center)");
test_invalid_value("shape-outside", "ellipse(farthest-side at)");
test_invalid_value("shape-outside", "ellipse(1% 2% top right)");
test_invalid_value("shape-outside", "ellipse(3% at 100% 0%)");
test_invalid_value("shape-outside", "ellipse(closest-side)");
test_invalid_value("shape-outside", "ellipse(farthest-side at 100% 0%)");
test_invalid_value("shape-outside", "ellipse(10% -20% at 30% 40%)");
test_invalid_value("shape-outside", "ellipse(-50px 60px at 70% 80%)");
</script>
</body>
</html>

31
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/ellipse-function-valid.html Normal file
View file

@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the ellipse() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-ellipse">
<meta name="assert" content="Tests parsing of the ellipse() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("shape-outside", "ellipse()");
test_valid_value("shape-outside", "ellipse(1px 2px)");
test_valid_value("shape-outside", "ellipse(20px 40px at center)", "ellipse(20px 40px at 50% 50%)");
test_valid_value("shape-outside", "ellipse(closest-side 20%)");
test_valid_value("shape-outside", "ellipse(farthest-side 20%)");
test_valid_value("shape-outside", "ellipse(closest-corner 20%)");
test_valid_value("shape-outside", "ellipse(farthest-corner 20%)");
test_valid_value("shape-outside", "ellipse(at 10% 20%)");
test_valid_value("shape-outside", "ellipse(at -10px -20%)");
test_valid_value("shape-outside", "ellipse(4% 20% at top right)", "ellipse(4% 20% at 100% 0%)");
test_valid_value("shape-outside", "ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))", "ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(25%))");
test_valid_value("shape-outside", "ellipse(10px closest-side at top right)", "ellipse(10px closest-side at 100% 0%)");
test_valid_value("shape-outside", "ellipse(farthest-side 20px at center top)", "ellipse(farthest-side 20px at 50% 0%)");
test_valid_value("shape-outside", "ellipse(farthest-side farthest-side at top right)", "ellipse(farthest-side farthest-side at 100% 0%)");
</script>
</body>
</html>

28
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/inset-function-computed.html Normal file
View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: the computed value of the inset() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-inset">
<meta name="assert" content="Tests parsing of the inset() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("shape-outside", "inset(100%)");
test_computed_value("shape-outside", "inset(0 1px)", "inset(0px 1px)");
test_computed_value("shape-outside", "inset(0px 1px 2%)");
test_computed_value("shape-outside", "inset(-20px -20px 2%)");
test_computed_value("shape-outside", "inset(0px 1px 2% 3em)", "inset(0px 1px 2% 48px)");
test_computed_value("shape-outside", "inset(0px calc(100% - 20px) 2% 3em)", "inset(0px calc(100% - 20px) 2% 48px)");
test_computed_value("shape-outside", "inset(0px round 100%)");
test_computed_value("shape-outside", "inset(0px round 0 1px)", "inset(0px round 0px 1px)");
test_computed_value("shape-outside", "inset(0px round 0px 1px 2%)");
test_computed_value("shape-outside", "inset(0px round 0px 1px 2% 3em)", "inset(0px round 0px 1px 2% 48px)");
test_computed_value("shape-outside", "inset(10px round 20% / 0px 1px 2% 3em)", "inset(10px round 20% / 0px 1px 2% 48px)");
</script>
</body>
</html>

28
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/inset-function-invalid.html Normal file
View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the inset() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-inset">
<meta name="assert" content="Tests parsing of the inset() function">
<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("shape-outside", "inset(0px, 1px)");
test_invalid_value("shape-outside", "inset(0px round 0px, 1px)");
test_invalid_value("shape-outside", "inset()");
test_invalid_value("shape-outside", "inset(123)");
test_invalid_value("shape-outside", "inset(1% 2% 3% 4% 5%)");
test_invalid_value("shape-outside", "inset(round 0)");
test_invalid_value("shape-outside", "inset(0px round)");
test_invalid_value("shape-outside", "inset(0px round 123)");
test_invalid_value("shape-outside", "inset(0px round 1% 2% 3% 4% 5%)");
test_invalid_value("shape-outside", "inset(0px round / 1px)");
test_invalid_value("shape-outside", "inset(10px round -20px)");
test_invalid_value("shape-outside", "inset(30% round -40%)");
</script>
</body>
</html>

27
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/inset-function-valid.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the inset() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-inset">
<meta name="assert" content="Tests parsing of the inset() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("shape-outside", "inset(100%)");
test_valid_value("shape-outside", "inset(0 1px)", "inset(0px 1px)");
test_valid_value("shape-outside", "inset(0px 1px 2%)");
test_valid_value("shape-outside", "inset(-20px -20px 2%)");
test_valid_value("shape-outside", "inset(0px 1px 2% 3em)");
test_valid_value("shape-outside", "inset(0px calc(100% - 20px) 2% 3em)");
test_valid_value("shape-outside", "inset(0px round 100%)");
test_valid_value("shape-outside", "inset(0px round 0 1px)", "inset(0px round 0px 1px)");
test_valid_value("shape-outside", "inset(0px round 0px 1px 2%)");
test_valid_value("shape-outside", "inset(0px round 0px 1px 2% 3em)");
test_valid_value("shape-outside", "inset(10px round 20% / 0px 1px 2% 3em)");
</script>
</body>
</html>

21
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/polygon-function-computed.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the polygon() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-polygon">
<meta name="assert" content="Tests parsing of the polygon() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("shape-outside", "polygon(1% 2%)");
test_computed_value("shape-outside", "polygon(calc(100% - 20px) calc(30% + 10px))");
test_computed_value("shape-outside", "polygon(nonzero, 1px 2px, 3em 4em)", "polygon(1px 2px, 48px 64px)");
test_computed_value("shape-outside", "polygon(evenodd, 1px 2px, 3em 4em, 6pt 6%)", "polygon(evenodd, 1px 2px, 48px 64px, 8px 6%)");
</script>
</body>
</html>

19
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/polygon-function-invalid.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the polygon() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-polygon">
<meta name="assert" content="Tests parsing of the polygon() function">
<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("shape-outside", "polygon(100px)");
test_invalid_value("shape-outside", "polygon(1%)");
test_invalid_value("shape-outside", "polygon(evenodd, 1px, 2px, 3em 4em, 5pt 6%)");
</script>
</body>
</html>

20
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/polygon-function-valid.html Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the polygon() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-polygon">
<meta name="assert" content="Tests parsing of the polygon() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("shape-outside", "polygon(1% 2%)");
test_valid_value("shape-outside", "polygon(calc(100% - 20px) calc(30% + 10px))");
test_valid_value("shape-outside", "polygon(nonzero, 1px 2px, 3em 4em)", "polygon(1px 2px, 3em 4em)");
test_valid_value("shape-outside", "polygon(evenodd, 1px 2px, 3em 4em, 5pt 6%)");
</script>
</body>
</html>

28
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/rect-function-computed.html Normal file
View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: the computed value of the rect() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-rect">
<meta name="assert" content="Tests parsing of the inset() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("clip-path", "rect(0 0 0 0)", "inset(0px 100% 100% 0px)");
test_computed_value("clip-path", "rect(10px auto 20px 30px)", "inset(10px 0% calc(100% - 20px) 30px)");
test_computed_value("clip-path", "rect(auto auto auto auto)", "inset(0%)");
test_computed_value("clip-path", "rect(10% 20% 15% 12%)", "inset(10% 80% 85% 12%)");
test_computed_value("clip-path", "rect(10% 95% 97% 12%)", "inset(10% 5% 3% 12%)");
test_computed_value("clip-path", "rect(-10% -20% -15% -12%)", "inset(-10% 120% 115% -12%)");
test_computed_value("clip-path", "rect(10px 12% 20px 30px round 100%)", "inset(10px 88% calc(100% - 20px) 30px round 100%)");
test_computed_value("clip-path", "rect(10px 12% 20px 30px round 0 1px)", "inset(10px 88% calc(100% - 20px) 30px round 0px 1px)");
test_computed_value("clip-path", "rect(10px 12% 20px 30px round 0px 1px 2%)", "inset(10px 88% calc(100% - 20px) 30px round 0px 1px 2%)");
test_computed_value("clip-path", "rect(10px 12% 20px 30px round 0px 1px 2% 3em)", "inset(10px 88% calc(100% - 20px) 30px round 0px 1px 2% 48px)");
test_computed_value("clip-path", "rect(10px 12% 20px 30px round 20% / 0px 1px 2% 3em)", "inset(10px 88% calc(100% - 20px) 30px round 20% / 0px 1px 2% 48px)");
</script>
</body>
</html>

30
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/rect-function-invalid.html Normal file
View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the rect() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-rect">
<meta name="assert" content="Tests parsing of the inset() function">
<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("clip-path", "rect()");
test_invalid_value("clip-path", "rect(0px)");
test_invalid_value("clip-path", "rect(0px 1px)");
test_invalid_value("clip-path", "rect(0px 1px 2px)");
test_invalid_value("clip-path", "rect(0px, 1px, 2px, 3px)");
test_invalid_value("clip-path", "rect(0, 1, 2, 3)");
test_invalid_value("clip-path", "rect(1% 2% 3% 4% 5%)");
test_invalid_value("clip-path", "rect(round 0)");
test_invalid_value("clip-path", "rect(10px auto 20px 30px round)");
test_invalid_value("clip-path", "rect(10px auto 20px 30px round 123)");
test_invalid_value("clip-path", "rect(10px auto 20px 30px round 1% 2% 3% 4% 5%)");
test_invalid_value("clip-path", "rect(10px auto 20px 30px round / 1px)");
test_invalid_value("clip-path", "rect(10px auto 20px 30px round -20px)");
test_invalid_value("clip-path", "rect(10px auto 20px 30px round -40%)");
</script>
</body>
</html>

27
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/rect-function-valid.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the rect() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-rect">
<meta name="assert" content="Tests parsing of the inset() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("clip-path", "rect(0 0 0 0)", "rect(0px 0px 0px 0px)");
test_valid_value("clip-path", "rect(10px auto 20px 30px)");
test_valid_value("clip-path", "rect(auto auto auto auto)");
test_valid_value("clip-path", "rect(10% 20% 15% 12%)");
test_valid_value("clip-path", "rect(10% 95% 97% 12%)");
test_valid_value("clip-path", "rect(-10% -20% -15% -12%)");
test_valid_value("clip-path", "rect(10px 12% 20px 30px round 100%)");
test_valid_value("clip-path", "rect(10px 12% 20px 30px round 0 1px)", "rect(10px 12% 20px 30px round 0px 1px)");
test_valid_value("clip-path", "rect(10px 12% 20px 30px round 0px 1px 2%)");
test_valid_value("clip-path", "rect(10px 12% 20px 30px round 0px 1px 2% 3em)");
test_valid_value("clip-path", "rect(10px 12% 20px 30px round 20% / 0px 1px 2% 3em)");
</script>
</body>
</html>

65
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/shape-function-computed.html Normal file
View file

@ -0,0 +1,65 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 2: computed values for the shape() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-2/#shape-function">
<meta name="assert" content="Tests parsing of the circle() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("clip-path", "shape(from 20px 40px, line to 20px 30px)");
test_computed_value("clip-path", "shape(from 20px 40px, line to 20px 30px )", "shape(from 20px 40px, line to 20px 30px)");
test_computed_value("clip-path", "shape(from 0 0, line to 100% 100%)", "shape(from 0px 0px, line to 100% 100%)");
test_computed_value("clip-path", "shape(from 20px 40px, move to 20px 30px, line by 20px 30px)");
test_computed_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to 100px)");
test_computed_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline by 100%)");
test_computed_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to 100px)");
test_computed_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline by 100%)");
test_computed_value("clip-path", "shape(from 20px 40px, curve by 20px 20px with 10px 30px)");
test_computed_value("clip-path", "shape(from 20px 40px, curve by 20px 20px with 10px 30px / 12px 32px)");
test_computed_value("clip-path", "shape(from center, curve to center bottom with top right / bottom right)",
"shape(from 50% 50%, curve to 50% 100% with 100% 0% / 100% 100%)");
test_computed_value("clip-path", "shape(from center, curve by 20px 20px with 10px 30px from end / 12px 32px from start)",
"shape(from 50% 50%, curve by 20px 20px with 10px 30px from end / 12px 32px)");
test_computed_value("clip-path", "shape(from center right, curve by 20px 20px with 10px 30px from origin / 12px 32px from origin)",
"shape(from 100% 50%, curve by 20px 20px with 10px 30px from origin / 12px 32px from origin)");
test_computed_value("clip-path", "shape(from 20px 40px, curve to top right with 10px 30px from origin / 12px 32px from origin)",
"shape(from 20px 40px, curve to 100% 0% with 10px 30px / 12px 32px)");
test_computed_value("clip-path", "shape(from 20px 40px, smooth by 20px 20px)");
test_computed_value("clip-path", "shape(from 20px 40px, smooth by 20px 20px with 12px 32px)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10%)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 0)", "shape(from 20px 40px, arc by 20px 20px of 0px)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 0)", "shape(from 20px 40px, arc by 20px 20px of 10% 0px)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% rotate 0deg)", "shape(from 20px 40px, arc by 20px 20px of 10%)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20%)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of -10% -20% large)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% rotate 1deg)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw rotate 12deg)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw rotate 3.14159265rad)", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw rotate 180deg)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large rotate 12deg)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large cw)", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large)");
test_computed_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% rotate 12deg large)", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large rotate 12deg)");
document.getElementById('target').remove();
</script>
</body>
</html>

74
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/shape-function-invalid.html Normal file
View file

@ -0,0 +1,74 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the shape() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-2/#shape-function">
<meta name="assert" content="Tests parsing of the circle() function">
<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("clip-path", "shape(from 20px 40px line to 20px 30px)");
test_invalid_value("clip-path", "shape(from 20px 40px line to 20px 30px,)");
test_invalid_value("clip-path", "shape(from 20px, 40px, line to 20px, 30px)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to top)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to bottom)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to y-start)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to y-end)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to left)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to right)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to x-start)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to x-end)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to top 20px)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to right, vline to bottom left, close)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline by left)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline by right)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline by top)");
test_invalid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline by bottom)");
// Control points start after "with"
test_invalid_value("clip-path", "shape(from 20px 40px, curve to 20px 20px, using 10px 30px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve to 20px 20px using 10px 30px, 12px 32px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px, using 10px 30px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px using 10px 30px, 12px 32px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px via 10px 30px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px via 10px 30px 12px 32px)");
test_invalid_value("clip-path", "shape(from 20px 40px, smooth by 20px 20px via 10px 30px / 12px 32px)");
test_invalid_value("clip-path", "shape(from 20px 40px, smooth by 20px 20px using 10px 30px 12px 32px)");
// Multiple control points should be separated by /
test_invalid_value("clip-path", "shape(from 20px 40px, curve to 20px 20px with 10px 30px 12px 32px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px with 10px 30px 12px 32px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px with 10px 30px /)");
// <position> in places that only accept <coordinate-pair>
test_invalid_value("clip-path", "shape(from 20px 40px, curve by top left using 10px 30px)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 30px using top right)");
test_invalid_value("clip-path", "shape(from 20px 40px, curve to 20px 30px using top right / 20px from end)");
test_invalid_value("clip-path", "shape(from 20px 40px, arc by top right of 10% 20%)");
test_invalid_value("clip-path", "shape(from 20px 40px, arc by 10px 20px of top right small cw)");
// "from start" only applies to control points
test_invalid_value("clip-path", "shape(from 20px 40px, curve by 20px 30px from start, using 23px 32px)");
// 'from origin' not allowed for <position> control points
test_invalid_value("clip-path", "shape(from 20px 40px, curve to 20px 20px using top left from origin / 12px 32px from end)");
test_invalid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% 12deg)");
test_invalid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% rotate 12deg rotate 13deg)");
test_invalid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large 12deg)");
test_invalid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% small large)");
test_invalid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw ccw)");
</script>
</body>
</html>

103
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/shape-function-valid.html Normal file
View file

@ -0,0 +1,103 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 2: parsing the shape() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-2/#shape-function">
<meta name="assert" content="Tests parsing of the circle() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("clip-path", "shape(from 20px 40px, line to 20px 30px)");
test_valid_value("clip-path", "shape(from 20px 40px, line to 20px 30px )", "shape(from 20px 40px, line to 20px 30px)");
test_valid_value("clip-path", "shape(from 0 0, line to 100% 100%)", "shape(from 0px 0px, line to 100% 100%)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, line by 20px 30px)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to 100px)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline by 100%)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to 100px)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline by 100%)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to left, hline to center, hline to right)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, hline to x-start, vline to y-start)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to top, vline to center, vline to bottom)");
test_valid_value("clip-path", "shape(from 20px 40px, move to 20px 30px, vline to y-start, vline to y-end)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to 20px 20px with 10px 30px)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to 20em 20pt with 10vw 30vh)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to 10% 20% with 10px 30px / 12px 32px)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to top left with 10px 30px / 12px 32px)",
"shape(from 20px 40px, curve to left top with 10px 30px / 12px 32px)");
test_valid_value("clip-path", "shape(from 20% 40%, curve to center with center right / bottom center)",
"shape(from 20% 40%, curve to center center with right center / center bottom)");
test_valid_value("clip-path", "shape(from bottom right, curve to left with center right / bottom center)",
"shape(from right bottom, curve to left center with right center / center bottom)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to bottom left with 10px 30px from end)",
"shape(from 20px 40px, curve to left bottom with 10px 30px from end)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to right center with 10px 30px from start / 12px 32px from end)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to right center with 10px 30px from start/12px 32px from end)"
, "shape(from 20px 40px, curve to right center with 10px 30px from start / 12px 32px from end)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to right center with 10px 30px from end / 12px 32px from origin)",
"shape(from 20px 40px, curve to right center with 10px 30px from end / 12px 32px)");
test_valid_value("clip-path", "shape(from 20px 40px, curve to right center with 10px 30px from origin / 12px 32px from start)",
"shape(from 20px 40px, curve to right center with 10px 30px / 12px 32px from start)");
test_valid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px with 10px 30px)");
test_valid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px with 10px 30px from origin)");
test_valid_value("clip-path", "shape(from 20px 40px, curve by 20px 20px with 10px 30px / 12px 32px)");
test_valid_value("clip-path", "shape(from 20px 40px, curve by 20% 20em with 10px 30px from start / 12px 32px from end)",
"shape(from 20px 40px, curve by 20% 20em with 10px 30px / 12px 32px from end)");
test_valid_value("clip-path", "shape(from 20px 40px, curve by 20% 20em with 10.3% 30px from origin / 12pt 5.4% from start)",
"shape(from 20px 40px, curve by 20% 20em with 10.3% 30px from origin / 12pt 5.4%)");
test_valid_value("clip-path", "shape(from top left, smooth to top right)",
"shape(from left top, smooth to right top)");
test_valid_value("clip-path", "shape(from 20px 40px, smooth to center 20%)");
test_valid_value("clip-path", "shape(from 20px 40px, smooth by 20px 20px)");
test_valid_value("clip-path", "shape(from right bottom, smooth by 20px 20px with 12px 32px)");
test_valid_value("clip-path", "shape(from 20px 40px, smooth by 20pt 20px with 12px 32px from start)",
"shape(from 20px 40px, smooth by 20pt 20px with 12px 32px)");
test_valid_value("clip-path", "shape(from center 40px, smooth by 20% 20% with 12px 32px from end)");
test_valid_value("clip-path", "shape(from center, smooth by 20px 20px with 12px 32px from origin)",
"shape(from center center, smooth by 20px 20px with 12px 32px from origin)");
test_valid_value("clip-path", "shape(from 20px 40px, arc to top right of 10%)",
"shape(from 20px 40px, arc to right top of 10%)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10%)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 0)", "shape(from 20px 40px, arc by 20px 20px of 0px)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 0)", "shape(from 20px 40px, arc by 20px 20px of 10% 0px)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20% 20pt of 10% rotate 0deg)",
"shape(from 20px 40px, arc by 20% 20pt of 10%)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20%)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of -10% -20% large)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% rotate 1deg)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw rotate 12deg)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10px 20px cw rotate 0.52rad)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large rotate 12deg)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large cw)",
"shape(from 20px 40px, arc by 20px 20px of 10% 20% cw large)");
test_valid_value("clip-path", "shape(from 20px 40px, arc by 20px 20px of 10% 20% rotate 12deg large)", "shape(from 20px 40px, arc by 20px 20px of 10% 20% large rotate 12deg)");
</script>
</body>
</html>

25
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/xywh-function-computed.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: the computed value of the xywh() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-xywh">
<meta name="assert" content="Tests parsing of the xywh() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("shape-outside", "xywh(0px 1px 2% 3em)", "inset(1px 98% calc(100% - 49px) 0px)");
test_computed_value("shape-outside", "xywh(0px calc(100% - 20px) 2% 3em)", "inset(calc(100% - 20px) 98% calc(0% - 28px) 0px)");
test_computed_value("shape-outside", "xywh(10px 20px 30px 25px round 100%)", "inset(20px calc(100% - 40px) calc(100% - 45px) 10px round 100%)");
test_computed_value("shape-outside", "xywh(10px 20px 30px 25px round 0 1px)", "inset(20px calc(100% - 40px) calc(100% - 45px) 10px round 0px 1px)");
test_computed_value("shape-outside", "xywh(10px 20px 30px 25px round 0px 1px 2%)", "inset(20px calc(100% - 40px) calc(100% - 45px) 10px round 0px 1px 2%)");
test_computed_value("shape-outside", "xywh(10px 20px 30px 25px round 0px 1px 2% 3em)", "inset(20px calc(100% - 40px) calc(100% - 45px) 10px round 0px 1px 2% 48px)");
test_computed_value("shape-outside", "xywh(10px 20px 30px 25px round 20% / 0px 1px 2% 3em)", "inset(20px calc(100% - 40px) calc(100% - 45px) 10px round 20% / 0px 1px 2% 48px)");
</script>
</body>
</html>

22
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/xywh-function-invalid.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the xywh() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-xywh">
<meta name="assert" content="Tests parsing of the xywh() function">
<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("shape-outside", "xywh(0px 1px -2% 3em)");
test_invalid_value("shape-outside", "xywh(0px 1px 2% -3em)");
test_invalid_value("shape-outside", "xywh(10px 20px)");
test_invalid_value("shape-outside", "xywh(10px 20px 30px)");
test_invalid_value("shape-outside", "xywh(10px 20px, 30px 25px)");
test_invalid_value("shape-outside", "xywh(10px 20px 30px 25px round 0px -1px 2%)");
</script>
</body>
</html>

23
Tests/LibWeb/Text/input/wpt-import/css/css-shapes/shape-functions/xywh-function-valid.html Normal file
View file

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Shapes Module Level 1: parsing the xywh() function</title>
<link rel="help" href="https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-xywh">
<meta name="assert" content="Tests parsing of the xywh() function">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("shape-outside", "xywh(0px 1px 2% 3em)");
test_valid_value("shape-outside", "xywh(0px calc(100% - 20px) 2% 3em)");
test_valid_value("shape-outside", "xywh(10px 20px 30px 25px round 100%)");
test_valid_value("shape-outside", "xywh(10px 20px 30px 25px round 0 1px)", "xywh(10px 20px 30px 25px round 0px 1px)");
test_valid_value("shape-outside", "xywh(10px 20px 30px 25px round 0px 1px 2%)");
test_valid_value("shape-outside", "xywh(10px 20px 30px 25px round 0px 1px 2% 3em)");
test_valid_value("shape-outside", "xywh(10px 20px 30px 25px round 20% / 0px 1px 2% 3em)");
</script>
</body>
</html>