From 3fce4f7c9127c6dbec4a71b1aadd4be526f34e7c Mon Sep 17 00:00:00 2001
From: Sam Atkins <atkinssj@serenityos.org>
Date: Wed, 27 Jul 2022 12:20:35 +0100
Subject: [PATCH] LibWeb: Resolve calc() FooPercentages that only contained
 percentages

Fixes #14697

Percentages inside `calc()` only got converted to the concrete type
(eg, Length) when added or subtracted with one. So if the `calc
()` doesn't contain any of that type, it would resolve to a
Percentage.

Now, we catch that returned Percentage and convert it to the proper
type. This fixes cases like `width: calc(100% / 2);`.
---
 Userland/Libraries/LibWeb/CSS/StyleValue.cpp | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/Userland/Libraries/LibWeb/CSS/StyleValue.cpp b/Userland/Libraries/LibWeb/CSS/StyleValue.cpp
index 5cc9cca591..520c699ab7 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleValue.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleValue.cpp
@@ -669,6 +669,9 @@ Optional<Angle> CalculatedStyleValue::resolve_angle_percentage(Angle const& perc
         [&](Angle const& angle) -> Optional<Angle> {
             return angle;
         },
+        [&](Percentage const& percentage) -> Optional<Angle> {
+            return percentage_basis.percentage_of(percentage);
+        },
         [&](auto const&) -> Optional<Angle> {
             return {};
         });
@@ -691,6 +694,9 @@ Optional<Frequency> CalculatedStyleValue::resolve_frequency_percentage(Frequency
         [&](Frequency const& frequency) -> Optional<Frequency> {
             return frequency;
         },
+        [&](Percentage const& percentage) -> Optional<Frequency> {
+            return percentage_basis.percentage_of(percentage);
+        },
         [&](auto const&) -> Optional<Frequency> {
             return {};
         });
@@ -713,6 +719,9 @@ Optional<Length> CalculatedStyleValue::resolve_length_percentage(Layout::Node co
         [&](Length const& length) -> Optional<Length> {
             return length;
         },
+        [&](Percentage const& percentage) -> Optional<Length> {
+            return percentage_basis.percentage_of(percentage);
+        },
         [&](auto const&) -> Optional<Length> {
             return {};
         });