RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-25 15:47:44 +00:00
Code Issues Activity Actions

LibWeb: Fix CSS opacity parsing

Browse source 
The StyleProperties code for opacity existed before NumericStyleValue
was a thing, and was affected by over-enthusiastic unitless-length
parsing, so it assumed everything was a length. Now it matches the
Color4 spec instead, accepting either a number, or a percentage.

We also get to remove the hack! :^)
This commit is contained in:
Sam Atkins 2021-09-10 20:23:57 +01:00 • committed by Andreas Kling
parent 8dc4f3763d
commit b8c4320ffa
2 changed files with 14 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

6
Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
View file

@ -2888,12 +2888,6 @@ RefPtr<StyleValue> Parser::parse_css_value(ParsingContext const& context, Proper
} }
} }
// FIXME: This is a hack for the `opacity` property which should really take an <alpha-value>
if (property_id == PropertyID::Opacity && component_value.is(Token::Type::Number)) {
String string = component_value.token().number_string_value();
return LengthStyleValue::create(Length::make_px(strtof(string.characters(), nullptr)));
}
if (auto builtin = parse_builtin_value(context, component_value)) if (auto builtin = parse_builtin_value(context, component_value))
return builtin; return builtin;

20
Userland/Libraries/LibWeb/CSS/StyleProperties.cpp
View file

@ -1,5 +1,6 @@
/* /*
* Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org> * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
* Copyright (c) 2021, Sam Atkins <atkinssj@serenityos.org>
* *
* SPDX-License-Identifier: BSD-2-Clause * SPDX-License-Identifier: BSD-2-Clause
*/ */
@ -298,14 +299,21 @@ Optional<int> StyleProperties::z_index() const
Optional<float> StyleProperties::opacity() const Optional<float> StyleProperties::opacity() const
{ {
auto value = property(CSS::PropertyID::Opacity); auto maybe_value = property(CSS::PropertyID::Opacity);
if (!value.has_value()) if (!maybe_value.has_value())
return {}; return {};
auto& value = maybe_value.value();
if (auto length = value.value()->to_length(); length.is_percentage()) if (value->is_numeric())
return clamp(static_cast<float>(length.raw_value() / 100), 0.0f, 1.0f); return clamp(static_cast<NumericStyleValue&>(*value).value(), 0.0f, 1.0f);
else
return clamp(static_cast<float>(length.raw_value()), 0.0f, 1.0f); if (value->is_length()) {
auto length = value->to_length();
if (length.is_percentage())
return clamp(length.raw_value() / 100.0f, 0.0f, 1.0f);
}
return {};
} }
Optional<CSS::FlexDirection> StyleProperties::flex_direction() const Optional<CSS::FlexDirection> StyleProperties::flex_direction() const