From f66a3aba1e26015bc2169814cd4fee64f718f706 Mon Sep 17 00:00:00 2001
From: Sam Atkins <sam@ladybird.org>
Date: Wed, 6 Nov 2024 12:44:38 +0000
Subject: [PATCH] Tests: Re-import tests that used ahem.css

This nets us 36 new subtest passes. :^)
---
 .../grid-columns-rows-get-set-multiple.txt    |  34 +-
 .../grid-content-sized-columns-resolution.txt |  45 +--
 .../flex-item-compressible-001.html           |   2 +-
 .../flex-item-compressible-002.html           |   2 +-
 .../flex-one-sets-flex-basis-to-zero-px.html  |   2 +-
 .../css-flexbox/hittest-anonymous-box.html    |   2 +-
 .../css-flexbox/hittest-before-pseudo.html    |   2 +-
 .../intrinsic-size/row-use-cases-001.html     |   2 +-
 .../text-as-flexitem-size-001.html            |   2 +-
 .../grid-columns-rows-get-set-multiple.html   |   8 +-
 ...grid-content-sized-columns-resolution.html |   6 +-
 .../wpt-import/css/support/alignment.css      | 367 ++++++++++++++++++
 .../input/wpt-import/css/support/grid.css     | 289 ++++++++++++++
 .../css/support/width-keyword-classes.css     |  43 ++
 14 files changed, 753 insertions(+), 53 deletions(-)
 create mode 100644 Tests/LibWeb/Text/input/wpt-import/css/support/alignment.css
 create mode 100644 Tests/LibWeb/Text/input/wpt-import/css/support/grid.css
 create mode 100644 Tests/LibWeb/Text/input/wpt-import/css/support/width-keyword-classes.css

diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.txt
index 9e447517713fb..eb465198983e3 100644
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.txt
@@ -6,27 +6,27 @@ Rerun
 
 Found 40 tests
 
-8 Pass
-32 Fail
+23 Pass
+17 Fail
 Details
 Result	Test Name	MessagePass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFixedElement' : grid-template-columns = '7px 11px', grid-template-rows = '17px 2px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentElement' : grid-template-columns = '400px 800px', grid-template-rows = '150px 450px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentElement' : grid-template-columns = '400px 800px', grid-template-rows = '150px 450px'	
 Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentWithoutSize' : grid-template-columns = '3.5px 7px', grid-template-rows = '4px 12px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoElement' : grid-template-columns = '0px 17px', grid-template-rows = '0px 3px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithEMElement' : grid-template-columns = '100px 120px', grid-template-rows = '150px 170px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithThreeItems' : grid-template-columns = '15px 0px 100px', grid-template-rows = '120px 18px 0px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoElement' : grid-template-columns = '0px 17px', grid-template-rows = '0px 3px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithEMElement' : grid-template-columns = '100px 120px', grid-template-rows = '150px 170px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithThreeItems' : grid-template-columns = '15px 0px 100px', grid-template-rows = '120px 18px 0px'	
 Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFitContentAndFitAvailable' : grid-template-columns = 'none', grid-template-rows = 'none'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContent' : grid-template-columns = '0px 0px', grid-template-rows = '0px 0px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContentWithChildrenElement' : grid-template-columns = '7px 17px', grid-template-rows = '16px 3px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndFixed' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndMinMaxContent' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionFraction' : grid-template-columns = '320px 480px', grid-template-rows = '225px 375px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionMinMax' : grid-template-columns = '45px 755px', grid-template-rows = '586px 14px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcCalc' : grid-template-columns = '200px 100px', grid-template-rows = '150px 75px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndFixed' : grid-template-columns = '400px 80px', grid-template-rows = '88px 150px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndMinMax' : grid-template-columns = '190px 80px', grid-template-rows = '150px 53px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcInsideMinMax' : grid-template-columns = '400px 120px', grid-template-rows = '150px 175px'	
-Fail	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoInsideMinMax' : grid-template-columns = '0px 30px', grid-template-rows = '132px 60px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContent' : grid-template-columns = '0px 0px', grid-template-rows = '0px 0px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContentWithChildrenElement' : grid-template-columns = '7px 17px', grid-template-rows = '16px 3px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndFixed' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndMinMaxContent' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionFraction' : grid-template-columns = '320px 480px', grid-template-rows = '225px 375px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionMinMax' : grid-template-columns = '45px 755px', grid-template-rows = '586px 14px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcCalc' : grid-template-columns = '200px 100px', grid-template-rows = '150px 75px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndFixed' : grid-template-columns = '400px 80px', grid-template-rows = '88px 150px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndMinMax' : grid-template-columns = '190px 80px', grid-template-rows = '150px 53px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcInsideMinMax' : grid-template-columns = '400px 120px', grid-template-rows = '150px 175px'	
+Pass	Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoInsideMinMax' : grid-template-columns = '0px 30px', grid-template-rows = '132px 60px'	
 Pass	Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '18px 22px', element.style.gridTemplateColumns = '18px 22px', grid-template-rows = '66px 70px', element.style.gridTemplateRows = '66px 70px'	
 Pass	Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '440px 640px', element.style.gridTemplateColumns = '55% 80%', grid-template-rows = '240px 378px', element.style.gridTemplateRows = '40% 63%'	
 Pass	Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '0px 0px', element.style.gridTemplateColumns = 'auto auto', grid-template-rows = '0px 0px', element.style.gridTemplateRows = 'auto auto'	
diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.txt
index 4dcd1464965d3..139cfa534a97b 100644
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.txt
@@ -6,47 +6,48 @@ Rerun
 
 Found 42 tests
 
-42 Fail
+21 Pass
+21 Fail
 Details
-Result	Test Name	MessageFail	Element 'gridMinContentFixedAndAuto' grid-template-columns value computes to '15px 75px'	
-Fail	Element 'gridAutoAndAuto' grid-template-columns value computes to '45px 45px'	
+Result	Test Name	MessagePass	Element 'gridMinContentFixedAndAuto' grid-template-columns value computes to '15px 75px'	
+Pass	Element 'gridAutoAndAuto' grid-template-columns value computes to '45px 45px'	
 Fail	Element 'gridMinContentAndMinContentFixed' grid-template-columns value computes to '20px 30px'	
-Fail	Element 'gridMaxContentAndMinContent' grid-template-columns value computes to '70px 20px'	
-Fail	Element 'gridFixedMinContentAndMaxContent' grid-template-columns value computes to '10px 80px'	
-Fail	Element 'gridFixedMaxContentAndMinContent' grid-template-columns value computes to '60px 30px'	
+Pass	Element 'gridMaxContentAndMinContent' grid-template-columns value computes to '70px 20px'	
+Pass	Element 'gridFixedMinContentAndMaxContent' grid-template-columns value computes to '10px 80px'	
+Pass	Element 'gridFixedMaxContentAndMinContent' grid-template-columns value computes to '60px 30px'	
 Fail	Element 'gridMinContentAndMaxContentFixed' grid-template-columns value computes to '20px 70px'	
 Fail	Element 'gridMaxContentFixedAndAuto' grid-template-columns value computes to '65px 25px'	
-Fail	Element 'gridAutoMinContent' grid-template-columns value computes to '70px 20px'	
+Pass	Element 'gridAutoMinContent' grid-template-columns value computes to '70px 20px'	
 Fail	Element 'gridAutoMaxContent' grid-template-columns value computes to '20px 70px'	
 Fail	Element 'gridMaxContentAndMinContentFixed' grid-template-columns value computes to '70px 20px'	
 Fail	Element 'gridMaxContentAndMaxContentFixed' grid-template-columns value computes to '55px 35px'	
-Fail	Element 'gridMinContentFixedAndAutoUnsortedConstrained' grid-template-columns value computes to '0px 40px'	
-Fail	Element 'gridAutoAndAutoUnsortedConstrained' grid-template-columns value computes to '10px 30px'	
-Fail	Element 'gridMinContentAndMinContentFixedUnsortedConstrained' grid-template-columns value computes to '0px 40px'	
-Fail	Element 'gridMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '0px 70px'	
+Pass	Element 'gridMinContentFixedAndAutoUnsortedConstrained' grid-template-columns value computes to '0px 40px'	
+Pass	Element 'gridAutoAndAutoUnsortedConstrained' grid-template-columns value computes to '10px 30px'	
+Pass	Element 'gridMinContentAndMinContentFixedUnsortedConstrained' grid-template-columns value computes to '0px 40px'	
+Pass	Element 'gridMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '0px 70px'	
 Fail	Element 'gridFixedMinContentAndMaxContentUnsortedConstrained' grid-template-columns value computes to '10px 70px'	
-Fail	Element 'gridFixedMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '10px 40px'	
+Pass	Element 'gridFixedMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '10px 40px'	
 Fail	Element 'gridMinContentAndMaxContentFixedUnsortedConstrained' grid-template-columns value computes to '0px 90px'	
 Fail	Element 'gridMaxContentFixedAndAutoUnsortedConstrained' grid-template-columns value computes to '10px 40px'	
-Fail	Element 'gridAutoMinContentUnsortedConstrained' grid-template-columns value computes to '0px 60px'	
+Pass	Element 'gridAutoMinContentUnsortedConstrained' grid-template-columns value computes to '0px 60px'	
 Fail	Element 'gridAutoMaxContentUnsortedConstrained' grid-template-columns value computes to '0px 90px'	
 Fail	Element 'gridMaxContentAndMinContentFixedUnsortedConstrained' grid-template-columns value computes to '50px 40px'	
 Fail	Element 'gridMaxContentAndMaxContentFixedUnsortedConstrained' grid-template-columns value computes to '40px 70px'	
-Fail	Element 'gridMinContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 90px'	
+Pass	Element 'gridMinContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 90px'	
 Fail	Element 'gridAutoAndAutoUnsorted' grid-template-columns value computes to '60px 30px'	
-Fail	Element 'gridMinContentAndMinContentFixedUnsorted' grid-template-columns value computes to '0px 40px'	
-Fail	Element 'gridMaxContentAndMinContentUnsorted' grid-template-columns value computes to '0px 70px'	
+Pass	Element 'gridMinContentAndMinContentFixedUnsorted' grid-template-columns value computes to '0px 40px'	
+Pass	Element 'gridMaxContentAndMinContentUnsorted' grid-template-columns value computes to '0px 70px'	
 Fail	Element 'gridFixedMinContentAndMaxContentUnsorted' grid-template-columns value computes to '10px 70px'	
-Fail	Element 'gridFixedMaxContentAndMinContentUnsorted' grid-template-columns value computes to '50px 40px'	
+Pass	Element 'gridFixedMaxContentAndMinContentUnsorted' grid-template-columns value computes to '50px 40px'	
 Fail	Element 'gridMinContentAndMaxContentFixedUnsorted' grid-template-columns value computes to '0px 90px'	
-Fail	Element 'gridMaxContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 70px'	
-Fail	Element 'gridAutoMinContentUnsorted' grid-template-columns value computes to '50px 60px'	
+Pass	Element 'gridMaxContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 70px'	
+Pass	Element 'gridAutoMinContentUnsorted' grid-template-columns value computes to '50px 60px'	
 Fail	Element 'gridAutoMaxContentUnsorted' grid-template-columns value computes to '0px 90px'	
-Fail	Element 'gridMaxContentAndMinContentFixedUnsorted' grid-template-columns value computes to '50px 40px'	
-Fail	Element 'gridMaxContentAndMaxContentFixedUnsorted' grid-template-columns value computes to '40px 70px'	
+Pass	Element 'gridMaxContentAndMinContentFixedUnsorted' grid-template-columns value computes to '50px 40px'	
+Pass	Element 'gridMaxContentAndMaxContentFixedUnsorted' grid-template-columns value computes to '40px 70px'	
 Fail	Element 'gridMinContentFixedAndAutoAboveLimits' grid-template-columns value computes to '15px 95px'	
 Fail	Element 'gridMaxContentFixedAndAutoAboveLimits' grid-template-columns value computes to '15px 135px'	
 Fail	Element 'gridMinContentFixedAndFixedFixedAndAuto' grid-template-columns value computes to '20px 20px 60px'	
 Fail	Element 'gridAutoAndFixedFixedAndMaxContentFixed' grid-template-columns value computes to '110px 20px 20px'	
-Fail	Element 'gridMaxContentAndMaxContentFixedAndMaxContent' grid-template-columns value computes to '70px 20px 50px'	
+Pass	Element 'gridMaxContentAndMaxContentFixedAndMaxContent' grid-template-columns value computes to '70px 20px 50px'	
 Fail	Element 'gridAutoAndMinContentFixedAndMinContent' grid-template-columns value computes to '55px 30px 65px'	
\ No newline at end of file
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-001.html b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-001.html
index dc55f9b7d2b61..54f94ec577208 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-001.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-001.html
@@ -11,7 +11,7 @@
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#min-size-auto">
   <link rel="help" href="https://drafts.csswg.org/css-sizing-3/#replaced-percentage-min-contribution">
   <link rel="help" href="https://drafts.csswg.org/css-sizing-3/#min-content-zero">
-  <link rel="stylesheet" href="/fonts/ahem.css">
+  <link rel="stylesheet" href="../../fonts/ahem.css">
   <meta name="assert" content="This test verifies that an <input> flex item should resolve its percentage part of main size to zero when computing specified size suggestion.">
 
   <script src="../../resources/testharness.js"></script>
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-002.html b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-002.html
index c5095305ec658..61ca14b914d92 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-002.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-item-compressible-002.html
@@ -11,7 +11,7 @@
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#min-size-auto">
   <link rel="help" href="https://drafts.csswg.org/css-sizing-3/#replaced-percentage-min-contribution">
   <link rel="help" href="https://drafts.csswg.org/css-sizing-3/#min-content-zero">
-  <link rel="stylesheet" href="/fonts/ahem.css">
+  <link rel="stylesheet" href="../../fonts/ahem.css">
   <meta name="assert" content="This test verifies that an <input> flex item should resolve its percentage part of main size to zero when computing specified size suggestion.">
 
   <script src="../../resources/testharness.js"></script>
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-one-sets-flex-basis-to-zero-px.html b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-one-sets-flex-basis-to-zero-px.html
index 72dcf830f87bd..54e71370d70bb 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-one-sets-flex-basis-to-zero-px.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/flex-one-sets-flex-basis-to-zero-px.html
@@ -3,7 +3,7 @@
 <title>CSS Flexbox: flex-basis with zero pixel</title>
 <link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-basis-property">
 <link rel="help" href="https://drafts.csswg.org/css-flexbox/#intrinsic-main-sizes">
-<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<link rel="stylesheet" type="text/css" href="../../fonts/ahem.css" />
 <link href="support/flexbox.css" rel="stylesheet">
 <meta name="assert" content="This test ensures that setting 'flex-basis' property to
 zero pixel or percentage in combination with one value of both 'flex-grow' and 'flex-shrink'
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-anonymous-box.html b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-anonymous-box.html
index 324f332414aba..8461e903f222c 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-anonymous-box.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-anonymous-box.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <link rel="help" href="https://crbug.com/1097654" />
-<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<link rel="stylesheet" type="text/css" href="../../fonts/ahem.css" />
 <script src="../../resources/testharness.js"></script>
 <script src="../../resources/testharnessreport.js"></script>
 <style>
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-before-pseudo.html b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-before-pseudo.html
index 615cc1a8515c7..0faa670909c68 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-before-pseudo.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/hittest-before-pseudo.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <link rel="help" href="https://crbug.com/1081789" />
-<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<link rel="stylesheet" type="text/css" href="../../fonts/ahem.css" />
 <script src="../../resources/testharness.js"></script>
 <script src="../../resources/testharnessreport.js"></script>
 <style>
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/intrinsic-size/row-use-cases-001.html b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/intrinsic-size/row-use-cases-001.html
index 1392587944a04..7b1bb3757a822 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/intrinsic-size/row-use-cases-001.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/intrinsic-size/row-use-cases-001.html
@@ -3,7 +3,7 @@
 <link rel="help" href="https://drafts.csswg.org/css-flexbox/#intrinsic-sizes">
 <script src="../../../resources/testharness.js"></script>
 <script src="../../../resources/testharnessreport.js"></script>
-<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<link rel="stylesheet" type="text/css" href="../../../fonts/ahem.css" />
 <meta name="assert"
   content="Requested use cases from our issue tracker that were duplicated or included in the bug report for the new algorithm. These are intentionally not very reduced from their original form with liberal pass conditions." />
 
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/text-as-flexitem-size-001.html b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/text-as-flexitem-size-001.html
index 20345cae43f60..0ed03f782af15 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/text-as-flexitem-size-001.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-flexbox/text-as-flexitem-size-001.html
@@ -20,7 +20,7 @@
     <link rel="help" href="https://www.w3.org/TR/css-flexbox-1/#hypothetical-main-size">
     <link rel="help" href="https://www.w3.org/TR/css-flexbox-1/#hypothetical-cross-size">
     <style>
-      @import "/fonts/ahem.css";
+      @import "../../fonts/ahem.css";
       .flexbox {
         display: flex;
         flex-direction: row;
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.html b/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.html
index 80b16363562c2..c2e7c9e4048dd 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-columns-rows-get-set-multiple.html
@@ -2,10 +2,10 @@
 <meta charset="utf-8">
 <link rel="author" title="Julien Chaffraix" href="mailto:jchaffraix@webkit.org">
 <link rel="help" href="https://bugs.webkit.org/show_bug.cgi?id=73272">
-<link href="/css/support/width-keyword-classes.css" rel="stylesheet">
-<link href="/css/support/grid.css" rel="stylesheet">
-<link href="/css/support/alignment.css" rel="stylesheet">
-<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
+<link href="../../../css/support/width-keyword-classes.css" rel="stylesheet">
+<link href="../../../css/support/grid.css" rel="stylesheet">
+<link href="../../../css/support/alignment.css" rel="stylesheet">
+<link rel="stylesheet" type="text/css" href="../../../fonts/ahem.css">
 <link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
 <meta name="assert" content="Test that setting and getting multiple grid-template-columns and grid-template-rows works as expected">
 <style>
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.html b/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.html
index 80dd39ac70e60..dcc9c0c785e52 100644
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-grid/parsing/grid-content-sized-columns-resolution.html
@@ -2,9 +2,9 @@
 <meta charset="utf-8">
 <link rel="author" title="Sergio Villar" href="mailto:svillar@igalia.com">
 <link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=392200">
-<link href="/css/support/grid.css" rel="stylesheet">
-<link href="/css/support/alignment.css" rel="stylesheet">
-<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
+<link href="../../../css/support/grid.css" rel="stylesheet">
+<link href="../../../css/support/alignment.css" rel="stylesheet">
+<link rel="stylesheet" type="text/css" href="../../../fonts/ahem.css">
 <link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
 <meta name="assert" content="Checks resolution of content sized grid columns and verifies that items are processed by ascending span to compute column breadths">
 <style>
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/support/alignment.css b/Tests/LibWeb/Text/input/wpt-import/css/support/alignment.css
new file mode 100644
index 0000000000000..d4c970c52b554
--- /dev/null
+++ b/Tests/LibWeb/Text/input/wpt-import/css/support/alignment.css
@@ -0,0 +1,367 @@
+/* align-self */
+.alignSelfAuto { align-self: auto; }
+.alignSelfNormal { align-self: normal; }
+.alignSelfStretch { align-self: stretch; }
+.alignSelfStart { align-self: start; }
+.alignSelfEnd { align-self: end; }
+.alignSelfCenter { align-self: center; }
+.alignSelfRight { align-self: right; }
+.alignSelfLeft { align-self: left; }
+
+.alignSelfFlexStart { align-self: flex-start; }
+.alignSelfFlexEnd { align-self: flex-end; }
+
+.alignSelfSelfStart { align-self: self-start; }
+.alignSelfSelfEnd { align-self: self-end; }
+
+.alignSelfSafeCenter { align-self: safe center; }
+.alignSelfUnsafeCenter { align-self: unsafe center; }
+.alignSelfSafeEnd { align-self: safe end; }
+.alignSelfUnsafeEnd { align-self: unsafe end; }
+.alignSelfSafeSelfEnd { align-self: safe self-end; }
+.alignSelfUnsafeSelfEnd { align-self: unsafe self-end; }
+.alignSelfSafeSelfStart { align-self: safe self-start; }
+.alignSelfUnsafeSelfStart { align-self: unsafe self-start; }
+.alignSelfSafeRight { align-self: safe right; }
+.alignSelfUnsafeRight { align-self: unsafe right; }
+.alignSelfSafeLeft { align-self: safe left; }
+.alignSelfUnsafeLeft { align-self: unsafe left; }
+.alignSelfSafeFlexEnd { align-self: safe flex-end; }
+.alignSelfUnsafeFlexEnd { align-self: unsafe flex-end; }
+.alignSelfSafeFlexStart { align-self: safe flex-start; }
+.alignSelfUnsafeFlexStart { align-self: unsafe flex-start; }
+
+.alignSelfBaseline { align-self: baseline; }
+.alignSelfFirstBaseline { align-self: first baseline; }
+.alignSelfLastBaseline { align-self: last baseline; }
+
+/* align-items */
+.alignItemsAuto { align-items: auto; }
+.alignItemsNormal { align-items: normal; }
+.alignItemsStretch { align-items: stretch; }
+.alignItemsStart { align-items: start; }
+.alignItemsCenter { align-items: center; }
+.alignItemsEnd { align-items: end; }
+.alignItemsLeft { align-items: left; }
+.alignItemsRight { align-items: right; }
+
+.alignItemsFlexStart { align-items: flex-start; }
+.alignItemsFlexEnd { align-items: flex-end; }
+
+.alignItemsSelfStart { align-items: self-start; }
+.alignItemsSelfEnd { align-items: self-end; }
+
+.alignItemsSafeCenter { align-items: safe center; }
+.alignItemsUnsafeCenter { align-items: unsafe center; }
+.alignItemsSafeEnd { align-items: safe end; }
+.alignItemsUnsafeEnd { align-items: unsafe end; }
+.alignItemsSafeSelfEnd { align-items: safe self-end; }
+.alignItemsUnsafeSelfEnd { align-items: unsafe self-end; }
+.alignItemsSafeSelfStart { align-items: safe self-start; }
+.alignItemsUnsafeSelfStart { align-items: unsafe self-start; }
+.alignItemsSafeRight { align-items: safe right; }
+.alignItemsUnsafeRight { align-items: unsafe right; }
+.alignItemsSafeLeft { align-items: safe left; }
+.alignItemsUnsafeLeft { align-items: unsafe left; }
+.alignItemsSafeFlexEnd { align-items: safe flex-end; }
+.alignItemsUnsafeFlexEnd { align-items: unsafe flex-end; }
+.alignItemsSafeFlexStart { align-items: safe flex-start; }
+.alignItemsUnsafeFlexStart { align-items: unsafe flex-start; }
+
+.alignItemsBaseline { align-items: baseline; }
+.alignItemsFirstBaseline { align-items: first baseline; }
+.alignItemsLastBaseline { align-items: last baseline; }
+
+/* align-content */
+.alignContentBaseline { align-content: baseline; }
+.alignContentLastBaseline { align-content: last-baseline; }
+.alignContentStart { align-content: start; }
+.alignContentEnd { align-content: end; }
+.alignContentCenter { align-content: center; }
+.alignContentLeft { align-content: left; }
+.alignContentRight { align-content: right; }
+
+.alignContentFlexStart { align-content: flex-start; }
+.alignContentFlexEnd { align-content: flex-end; }
+
+.alignContentSpaceBetween { align-content: space-between; }
+.alignContentSpaceAround { align-content: space-around; }
+.alignContentSpaceEvenly { align-content: space-evenly; }
+.alignContentStretch { align-content: stretch; }
+
+.alignContentSafeCenter { align-content: safe center; }
+.alignContentUnsafeCenter { align-content: unsafe center; }
+.alignContentSafeEnd { align-content: safe end; }
+.alignContentUnsafeEnd { align-content: unsafe end; }
+.alignContentSafeRight { align-content: safe right; }
+.alignContentUnsafeRight { align-content: unsafe right; }
+.alignContentSafeLeft { align-content: safe left; }
+.alignContentUnsafeLeft { align-content: unsafe left; }
+.alignContentSafeFlexEnd { align-content: safe flex-end; }
+.alignContentUnsafeFlexEnd { align-content: unsafe flex-end; }
+.alignContentSafeFlexStart { align-content: safe flex-start; }
+.alignContentUnsafeFlexStart { align-content: unsafe flex-start; }
+
+.alignContentBaseline { align-content: baseline; }
+.alignContentFirstBaseline { align-content: first baseline; }
+.alignContentLastBaseline { align-content: last baseline; }
+
+/* justify-self */
+.justifySelfAuto { justify-self: auto; }
+.justifySelfNormal { justify-self: normal; }
+.justifySelfStretch { justify-self: stretch; }
+.justifySelfStart { justify-self: start; }
+.justifySelfCenter { justify-self: center; }
+.justifySelfEnd { justify-self: end; }
+.justifySelfRight { justify-self: right; }
+.justifySelfLeft { justify-self: left; }
+
+.justifySelfFlexStart { justify-self: flex-start; }
+.justifySelfFlexEnd { justify-self: flex-end; }
+
+.justifySelfSelfStart { justify-self: self-start; }
+.justifySelfSelfEnd { justify-self: self-end; }
+
+.justifySelfSafeCenter { justify-self: safe center; }
+.justifySelfUnsafeCenter { justify-self: unsafe center; }
+.justifySelfSafeEnd { justify-self: safe end; }
+.justifySelfUnsafeEnd { justify-self: unsafe end; }
+.justifySelfSafeSelfEnd { justify-self: safe self-end; }
+.justifySelfUnsafeSelfEnd { justify-self: unsafe self-end; }
+.justifySelfSafeSelfStart { justify-self: safe self-start; }
+.justifySelfUnsafeSelfStart { justify-self: unsafe self-start; }
+.justifySelfSafeRight { justify-self: safe right; }
+.justifySelfUnsafeRight { justify-self: unsafe right; }
+.justifySelfSafeLeft { justify-self: safe left; }
+.justifySelfUnsafeLeft { justify-self: unsafe left; }
+.justifySelfSafeFlexEnd { justify-self: safe flex-end; }
+.justifySelfUnsafeFlexEnd { justify-self: unsafe flex-end; }
+.justifySelfSafeFlexStart { justify-self: safe flex-start; }
+.justifySelfUnsafeFlexStart { justify-self: unsafe flex-start; }
+
+.justifySelfBaseline { justify-self: baseline; }
+.justifySelfFirstBaseline { justify-self: first baseline; }
+.justifySelfLastBaseline { justify-self: last baseline; }
+
+/* justify-items */
+.justifyItemsAuto { justify-items: auto; }
+.justifyItemsNormal { justify-items: normal; }
+.justifyItemsStretch { justify-items: stretch; }
+.justifyItemsStart { justify-items: start; }
+.justifyItemsCenter { justify-items: center; }
+.justifyItemsEnd { justify-items: end; }
+.justifyItemsLeft { justify-items: left; }
+.justifyItemsRight { justify-items: right; }
+
+.justifyItemsFlexStart { justify-items: flex-start; }
+.justifyItemsFlexEnd { justify-items: flex-end; }
+
+.justifyItemsSelfStart { justify-items: self-start; }
+.justifyItemsSelfEnd { justify-items: self-end; }
+
+.justifyItemsLegacy { justify-items: legacy; }
+.justifyItemsLegacyLeft { justify-items: legacy left; }
+.justifyItemsLegacyCenter { justify-items: legacy center; }
+.justifyItemsLegacyRight { justify-items: legacy right; }
+.justifyItemsLeftLegacy { justify-items: left legacy; }
+.justifyItemsCenterLegacy { justify-items: center legacy; }
+.justifyItemsRightLegacy { justify-items: right legacy; }
+
+.justifyItemsSafeCenter { justify-items: safe center; }
+.justifyItemsUnsafeCenter { justify-items: unsafe center; }
+.justifyItemsSafeEnd { justify-items: safe end; }
+.justifyItemsUnsafeEnd { justify-items: unsafe end; }
+.justifyItemsSafeSelfEnd { justify-items: safe self-end; }
+.justifyItemsUnsafeSelfEnd { justify-items: unsafe self-end; }
+.justifyItemsSafeSelfStart { justify-items: safe self-start; }
+.justifyItemsUnsafeSelfStart { justify-items: unsafe self-start; }
+.justifyItemsSafeRight { justify-items: safe right; }
+.justifyItemsUnsafeRight { justify-items: unsafe right; }
+.justifyItemsSafeLeft { justify-items: safe left; }
+.justifyItemsUnsafeLeft { justify-items: unsafe left; }
+.justifyItemsSafeFlexEnd { justify-items: safe flex-end; }
+.justifyItemsUnsafeFlexEnd { justify-items: unsafe flex-end; }
+.justifyItemsSafeFlexStart { justify-items: safe flex-start; }
+.justifyItemsUnsafeFlexStart { justify-items: unsafe flex-start; }
+
+.justifyItemsTest { justify-items: safe end; }
+
+.justifyItemsBaseline { justify-items: baseline; }
+.justifyItemsFirstBaseline { justify-items: first baseline; }
+.justifyItemsLastBaseline { justify-items: last baseline; }
+
+/* justify-content */
+.justifyContentBaseline { justify-content: baseline; }
+.justifyContentLastBaseline { justify-content: last-baseline; }
+.justifyContentStart { justify-content: start; }
+.justifyContentEnd { justify-content: end; }
+.justifyContentCenter { justify-content: center; }
+.justifyContentLeft { justify-content: left; }
+.justifyContentRight { justify-content: right; }
+
+.justifyContentFlexStart { justify-content: flex-start; }
+.justifyContentFlexEnd { justify-content: flex-end; }
+
+.justifyContentSpaceBetween { justify-content: space-between; }
+.justifyContentSpaceAround { justify-content: space-around; }
+.justifyContentSpaceEvenly { justify-content: space-evenly; }
+.justifyContentStretch { justify-content: stretch; }
+
+.justifyContentSafeCenter { justify-content: safe center; }
+.justifyContentUnsafeCenter { justify-content: unsafe center; }
+.justifyContentSafeEnd { justify-content: safe end; }
+.justifyContentUnsafeEnd { justify-content: unsafe end; }
+.justifyContentSafeRight { justify-content: safe right; }
+.justifyContentUnsafeRight { justify-content: unsafe right; }
+.justifyContentSafeLeft { justify-content: safe left; }
+.justifyContentUnsafeLeft { justify-content: unsafe left; }
+.justifyContentSafeFlexEnd { justify-content: safe flex-end; }
+.justifyContentUnsafeFlexEnd { justify-content: unsafe flex-end; }
+.justifyContentSafeFlexStart { justify-content: safe flex-start; }
+.justifyContentUnsafeFlexStart { justify-content: unsafe flex-start; }
+
+.justifyContentBaseline { justify-content: baseline; }
+.justifyContentFirstBaseline { justify-content: first baseline; }
+.justifyContentLastBaseline { justify-content: last baseline; }
+
+/* Both align-items and justify-items */
+.itemsNormal {
+    align-items: normal;
+    justify-items: normal;
+}
+
+.itemsStretch {
+    align-items: stretch;
+    justify-items: stretch;
+}
+
+.itemsStart {
+    align-items: start;
+    justify-items: start;
+}
+
+.itemsCenter {
+    align-items: center;
+    justify-items: center;
+}
+
+.itemsEnd {
+    align-items: end;
+    justify-items: end;
+}
+
+.itemsLeft {
+    align-items: left;
+    justify-items: left;
+}
+
+.itemsRight {
+    align-items: right;
+    justify-items: right;
+}
+
+.itemsSelfStart {
+    align-items: self-start;
+    justify-items: self-start;
+}
+
+.itemsSelfEnd {
+    align-items: self-end;
+    justify-items: self-end;
+}
+.itemsBaseline {
+    align-items: baseline;
+    justify-items: baseline;
+}
+
+/* Both align-self and justify-self */
+.selfStretch {
+    align-self: stretch;
+    justify-self: stretch;
+}
+.selfStart {
+    align-self: start;
+    justify-self: start;
+}
+.selfEnd {
+    align-self: end;
+    justify-self: end;
+}
+.selfCenter {
+    align-self: center;
+    justify-self: center;
+}
+.selfRight {
+    align-self: right;
+    justify-self: right;
+}
+.selfLeft {
+    align-self: left;
+    justify-self: left;
+}
+.selfSelfStart {
+    align-self: self-start;
+    justify-self: self-start;
+}
+.selfSelfEnd {
+    align-self: self-end;
+    justify-self: self-end;
+}
+.selfBaseline {
+    align-self: baseline;
+    justify-self: baseline;
+}
+
+/* Both align-content and justify-content */
+.contentStart {
+    align-content: start;
+    justify-content: start;
+}
+.contentCenter {
+    align-content: center;
+    justify-content: center;
+}
+.contentEnd {
+    align-content: end;
+    justify-content: end;
+}
+
+.contentCenterSafe {
+    align-content: safe center;
+    justify-content: safe center;
+}
+
+.contentCenterUnsafe {
+    align-content: unsafe center;
+    justify-content: unsafe center;
+}
+
+.contentEndSafe {
+    align-content: safe end;
+    justify-content: safe end;
+}
+
+.contentEndUnsafe {
+    align-content: unsafe end;
+    justify-content: unsafe end;
+}
+
+.contentSpaceBetween {
+    justify-content: space-between;
+    align-content: space-between;
+}
+
+.contentSpaceAround {
+    justify-content: space-around;
+    align-content: space-around;
+}
+
+.contentSpaceEvenly {
+    justify-content: space-evenly;
+    align-content: space-evenly;
+}
+
+.contentStretch {
+    justify-content: stretch;
+    align-content: stretch;
+}
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/support/grid.css b/Tests/LibWeb/Text/input/wpt-import/css/support/grid.css
new file mode 100644
index 0000000000000..4007ebba43631
--- /dev/null
+++ b/Tests/LibWeb/Text/input/wpt-import/css/support/grid.css
@@ -0,0 +1,289 @@
+.grid {
+  display: grid;
+  background-color: grey;
+}
+
+.inline-grid {
+  display: inline-grid;
+  background-color: grey;
+}
+
+.firstRowFirstColumn {
+  background-color: blue;
+  grid-column: 1;
+  grid-row: 1;
+}
+
+.onlyFirstRowOnlyFirstColumn {
+  background-color: blue;
+  grid-column: 1 / 2;
+  grid-row: 1 / 2;
+}
+
+.firstRowSecondColumn {
+  background-color: lime;
+  grid-column: 2;
+  grid-row: 1;
+}
+
+.onlyFirstRowOnlySecondColumn {
+  background-color: lime;
+  grid-column: 2 / 3;
+  grid-row: 1 / 2;
+}
+
+.firstRowThirdColumn {
+  background-color: magenta;
+  grid-column: 3;
+  grid-row: 1;
+}
+
+.firstRowFourthColumn {
+  background-color: green;
+  grid-column: 4;
+  grid-row: 1;
+}
+
+.secondRowFirstColumn {
+  background-color: purple;
+  grid-column: 1;
+  grid-row: 2;
+}
+
+.onlySecondRowOnlyFirstColumn {
+  background-color: purple;
+  grid-column: 1 / 2;
+  grid-row: 2 / 3;
+}
+
+.secondRowSecondColumn {
+  background-color: orange;
+  grid-column: 2;
+  grid-row: 2;
+}
+
+.onlySecondRowOnlySecondColumn {
+  background-color: orange;
+  grid-column: 2 / 3;
+  grid-row: 2 / 3;
+}
+
+.endSecondRowEndSecondColumn {
+  background-color: orange;
+  grid-column-end: 3;
+  grid-row-end: 3;
+}
+
+.secondRowThirdColumn {
+  background-color: navy;
+  grid-column: 3;
+  grid-row: 2;
+}
+
+.secondRowFourthColumn {
+  background-color: pink;
+  grid-column: 4;
+  grid-row: 2;
+}
+
+.thirdRowFirstColumn {
+  background-color: green;
+  grid-column: 1;
+  grid-row: 3;
+}
+
+.thirdRowSecondColumn {
+  background-color: red;
+  grid-column: 2;
+  grid-row: 3;
+}
+
+.thirdRowThirdColumn {
+  background-color: salmon;
+  grid-column: 3;
+  grid-row: 3;
+}
+
+.firstAutoRowSecondAutoColumn {
+  grid-row: 1 / auto;
+  grid-column: 2 / auto;
+}
+
+.autoLastRowAutoLastColumn {
+  grid-row: auto / -1;
+  grid-column: auto / -1;
+}
+
+.autoSecondRowAutoFirstColumn {
+  grid-row: auto / 2;
+  grid-column: auto / 1;
+}
+
+.firstRowBothColumn {
+  grid-row: 1;
+  grid-column: 1 / -1;
+}
+
+.secondRowBothColumn {
+  grid-row: 2;
+  grid-column: 1 / -1;
+}
+
+.bothRowFirstColumn {
+  grid-row: 1 / -1;
+  grid-column: 1;
+}
+
+.bothRowSecondColumn {
+  grid-row: 1 / -1;
+  grid-column: 2;
+}
+
+.bothRowBothColumn {
+  grid-row: 1 / -1;
+  grid-column: 1 / -1;
+}
+
+/* Auto column / row. */
+.autoRowAutoColumn {
+  background-color: pink;
+  grid-column: auto;
+  grid-row: auto;
+}
+
+.firstRowAutoColumn {
+  background-color: blue;
+  grid-column: auto;
+  grid-row: 1;
+}
+
+.secondRowAutoColumn {
+  background-color: purple;
+  grid-column: auto;
+  grid-row: 2;
+}
+
+.thirdRowAutoColumn {
+  background-color: navy;
+  grid-column: auto;
+  grid-row: 3;
+}
+
+.autoRowFirstColumn {
+  background-color: lime;
+  grid-column: 1;
+  grid-row: auto;
+}
+
+.autoRowSecondColumn {
+  background-color: orange;
+  grid-column: 2;
+  grid-row: auto;
+}
+
+.autoRowThirdColumn {
+  background-color: magenta;
+  grid-column: 3;
+  grid-row: auto;
+}
+
+.autoRowAutoColumnSpanning2 {
+  background-color: maroon;
+  grid-column: span 2;
+  grid-row: auto;
+}
+
+.autoRowSpanning2AutoColumn {
+  background-color: aqua;
+  grid-column: auto;
+  grid-row: span 2;
+}
+
+.autoRowSpanning2AutoColumnSpanning3 {
+  background-color: olive;
+  grid-column: span 3;
+  grid-row: span 2;
+}
+
+.autoRowSpanning3AutoColumnSpanning2 {
+  background-color: indigo;
+  grid-column: span 2;
+  grid-row: span 3;
+}
+
+.autoRowFirstColumnSpanning2 {
+  background-color: maroon;
+  grid-column: 1 / span 2;
+  grid-row: auto;
+}
+
+.autoRowSecondColumnSpanning2 {
+  background-color: olive;
+  grid-column: 2 / span 2;
+  grid-row: auto;
+}
+
+.firstRowSpanning2AutoColumn {
+  background-color: maroon;
+  grid-column: auto;
+  grid-row: 1 / span 2;
+  height: 100%;
+}
+
+.secondRowSpanning2AutoColumn {
+  background-color: olive;
+  grid-column: auto;
+  grid-row: 2 / span 2;
+  height: 100%;
+}
+
+/* Grid element flow. */
+.gridAutoFlowColumnSparse {
+  grid-auto-flow: column;
+}
+
+.gridAutoFlowColumnDense {
+  grid-auto-flow: column dense;
+}
+
+.gridAutoFlowRowSparse {
+  grid-auto-flow: row;
+}
+
+.gridAutoFlowRowDense {
+  grid-auto-flow: row dense;
+}
+
+/* This rule makes sure the container is smaller than any grid items to avoid distributing any extra logical space to them. */
+.constrainedContainer {
+  width: 10px;
+  height: 10px;
+}
+
+.unconstrainedContainer {
+  width: 1000px;
+  height: 1000px;
+}
+
+.sizedToGridArea {
+  font: 10px/1 Ahem;
+  /* Make us fit our grid area. */
+  width: 100%;
+  height: 100%;
+}
+
+.verticalRL {
+  writing-mode: vertical-rl;
+}
+.verticalLR {
+  writing-mode: vertical-lr;
+}
+.horizontalTB {
+  writing-mode: horizontal-tb;
+}
+.directionRTL {
+  direction: rtl;
+}
+.directionLTR {
+  direction: ltr;
+}
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/support/width-keyword-classes.css b/Tests/LibWeb/Text/input/wpt-import/css/support/width-keyword-classes.css
new file mode 100644
index 0000000000000..e7775276038f3
--- /dev/null
+++ b/Tests/LibWeb/Text/input/wpt-import/css/support/width-keyword-classes.css
@@ -0,0 +1,43 @@
+/*
+    Take every possible line break so the box width is the width of largest
+    unbreakable line box.
+*/
+.min-content {
+    width: min-content;
+}
+
+.max-content {
+    width: max-content;
+}
+
+/*
+   Shrink wrap just like floating.
+   max(min-content, min(max-content, fill-available))
+*/
+.fit-content {
+    width: fit-content;
+}
+
+.max-width-min-content {
+    max-width: min-content;
+}
+
+.max-width-max-content {
+    max-width: max-content;
+}
+
+.max-width-fit-content {
+    max-width: fit-content;
+}
+
+.min-width-min-content {
+    min-width: min-content;
+}
+
+.min-width-max-content {
+    min-width: max-content;
+}
+
+.min-width-fit-content {
+    min-width: fit-content;
+}