From 4a8c70b3a53b29f144b9901ba697c3cd19ab0f8d Mon Sep 17 00:00:00 2001
From: Timothy Flynn <trflynn89@pm.me>
Date: Fri, 8 Aug 2025 09:55:38 -0400
Subject: [PATCH] LibWeb: Parse CSS/image URLs using DOMURL::parse

DOMURL::parse handles blob URLs.
---
 Libraries/LibWeb/CSS/Fetch.cpp                |   5 ++-
 .../CSS/StyleValues/ImageStyleValue.cpp       |   4 +-
 Libraries/LibWeb/HTML/ImageRequest.cpp        |   7 ++--
 .../expected/css-background-blob-url-ref.html |  12 ++++++
 .../images/css-background-blob-url-ref.png    | Bin 0 -> 3875 bytes
 .../input/css-background-blob-url.html        |  39 ++++++++++++++++++
 6 files changed, 60 insertions(+), 7 deletions(-)
 create mode 100644 Tests/LibWeb/Screenshot/expected/css-background-blob-url-ref.html
 create mode 100644 Tests/LibWeb/Screenshot/images/css-background-blob-url-ref.png
 create mode 100644 Tests/LibWeb/Screenshot/input/css-background-blob-url.html

diff --git a/Libraries/LibWeb/CSS/Fetch.cpp b/Libraries/LibWeb/CSS/Fetch.cpp
index 1fe56501018..8d40d56d898 100644
--- a/Libraries/LibWeb/CSS/Fetch.cpp
+++ b/Libraries/LibWeb/CSS/Fetch.cpp
@@ -4,10 +4,10 @@
  * SPDX-License-Identifier: BSD-2-Clause
  */
 
-#include <LibURL/Parser.h>
 #include <LibWeb/CSS/CSSStyleSheet.h>
 #include <LibWeb/CSS/Fetch.h>
 #include <LibWeb/DOM/Document.h>
+#include <LibWeb/DOMURL/DOMURL.h>
 #include <LibWeb/Fetch/Fetching/Fetching.h>
 #include <LibWeb/HTML/SharedResourceRequest.h>
 
@@ -38,7 +38,8 @@ static WebIDL::ExceptionOr<GC::Ref<Fetch::Infrastructure::Request>> fetch_a_styl
     auto url_string = url_value.visit(
         [](::URL::URL const& url) { return url.to_string(); },
         [](CSS::URL const& url) { return url.url(); });
-    auto parsed_url = ::URL::Parser::basic_parse(url_string, base);
+
+    auto parsed_url = DOMURL::parse(url_string, base);
     if (!parsed_url.has_value())
         return WebIDL::SimpleException { WebIDL::SimpleExceptionType::URIError, "Failed to parse URL"sv };
 
diff --git a/Libraries/LibWeb/CSS/StyleValues/ImageStyleValue.cpp b/Libraries/LibWeb/CSS/StyleValues/ImageStyleValue.cpp
index 9bd2489c96d..cbb050cebeb 100644
--- a/Libraries/LibWeb/CSS/StyleValues/ImageStyleValue.cpp
+++ b/Libraries/LibWeb/CSS/StyleValues/ImageStyleValue.cpp
@@ -7,11 +7,11 @@
  * SPDX-License-Identifier: BSD-2-Clause
  */
 
-#include <LibURL/Parser.h>
 #include <LibWeb/CSS/ComputedValues.h>
 #include <LibWeb/CSS/Fetch.h>
 #include <LibWeb/CSS/StyleValues/ImageStyleValue.h>
 #include <LibWeb/DOM/Document.h>
+#include <LibWeb/DOMURL/DOMURL.h>
 #include <LibWeb/HTML/DecodedImageData.h>
 #include <LibWeb/HTML/PotentialCORSRequest.h>
 #include <LibWeb/HTML/SharedResourceRequest.h>
@@ -208,7 +208,7 @@ ValueComparingNonnullRefPtr<StyleValue const> ImageStyleValue::absolutized(CSSPi
     }();
 
     if (base_url.has_value()) {
-        if (auto resolved_url = ::URL::Parser::basic_parse(m_url.url(), *base_url); resolved_url.has_value())
+        if (auto resolved_url = DOMURL::parse(m_url.url(), *base_url); resolved_url.has_value())
             return ImageStyleValue::create(*resolved_url);
     }
 
diff --git a/Libraries/LibWeb/HTML/ImageRequest.cpp b/Libraries/LibWeb/HTML/ImageRequest.cpp
index c35df4e580a..b1cc275f8c1 100644
--- a/Libraries/LibWeb/HTML/ImageRequest.cpp
+++ b/Libraries/LibWeb/HTML/ImageRequest.cpp
@@ -6,7 +6,7 @@
 
 #include <AK/HashTable.h>
 #include <LibGfx/Bitmap.h>
-#include <LibURL/Parser.h>
+#include <LibWeb/DOMURL/DOMURL.h>
 #include <LibWeb/Fetch/Fetching/Fetching.h>
 #include <LibWeb/Fetch/Infrastructure/FetchAlgorithms.h>
 #include <LibWeb/Fetch/Infrastructure/FetchController.h>
@@ -71,8 +71,9 @@ void ImageRequest::set_state(State state)
 void ImageRequest::set_current_url(JS::Realm& realm, String url)
 {
     m_current_url = move(url);
-    if (auto url = URL::Parser::basic_parse(m_current_url); url.has_value())
-        m_shared_resource_request = SharedResourceRequest::get_or_create(realm, m_page, url.release_value());
+
+    if (auto parsed_url = DOMURL::parse(m_current_url); parsed_url.has_value())
+        m_shared_resource_request = SharedResourceRequest::get_or_create(realm, m_page, parsed_url.release_value());
 }
 
 // https://html.spec.whatwg.org/multipage/images.html#abort-the-image-request
diff --git a/Tests/LibWeb/Screenshot/expected/css-background-blob-url-ref.html b/Tests/LibWeb/Screenshot/expected/css-background-blob-url-ref.html
new file mode 100644
index 00000000000..9ab4c8d8fc5
--- /dev/null
+++ b/Tests/LibWeb/Screenshot/expected/css-background-blob-url-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<style>
+    * {
+        margin: 0;
+    }
+
+    body {
+        background-color: white;
+    }
+</style>
+
+<img src="../images/css-background-blob-url-ref.png" />
diff --git a/Tests/LibWeb/Screenshot/images/css-background-blob-url-ref.png b/Tests/LibWeb/Screenshot/images/css-background-blob-url-ref.png
new file mode 100644
index 0000000000000000000000000000000000000000..edc00828084116f1de9258dea7e2b68c8065ecdb
GIT binary patch
literal 3875
zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYV2a>iV_;yIRn}C%z`*y))5S5QV$R#U2Lq!c
zr5Y}-)_lLhsO5pc6h<Yc$qcND7Az+kcm!OT%2*~DACP>&^Mp70>>=0i^F7iz+wU*G
z_G3=3ng6B#WxrnSTWx(iZ~JXV1_ps2*VnN#Ffi1~GqEr*oZt{(U{FwYU|?wIVPIrn
zFhU4^ezlZ4ZF5r3yvzO!3=7g(L8|xcVEU9&{r&$&5hLr(Ul<t}c7M9dXmm{Can2%5
zt@7P+AanEW#T1fj?uvZ+^_69@&x_O3WBnNz7<%S&PPo4Q_>CMjiBu<c_GBBocU4>r
z3_sr9Y~f>INMYe%V3;7Nz`)?(*1*8PAj!x?q~OfG+!MZ5*}i-KzTB3Lf#HL2nViDx
zvuQE0vAwHTuYS+f{k6*0&(H5z+GfsW%nS^5OK+C#zH3)~@XhPj-}20k-IRFzp`a)J
z%j5dZH+v>eo@{^U@rxH3Yr<9=&OblD_WW$~{9`X)zKqbDe*e2G*wuZ7=EvT=dHvR|
z{yGE00g<w8OrM_ru&}q6H#ax`FRXIEsHDWi&)@&}+qZ8kDk@&Eu`w|G+cuZw#C+$+
z&z_~}Og~*%SZElw`s$6m?fPyfjvhTKkzDhii-UpTL%)G%!=3y0`}^hX>xx?+?SK4O
zQ|*{U^2UgsuT_7OT6Dy^3o9xt^78YSOUN@Y%s8RK`03r<-5Vox_U&{ktgN);<L5t~
zwe?s3j|!vt=Z{zIl{<d?_~TEXKIxm!))(vk_~F9?LmdW&8_Mfn>F?RMukPclpEY*(
z_SgS^WGZi0Bk}s{ui1*s3=Drh`v@sqzka>`PxRF*YZ@3B4*Z+(L~zZ|8auJ>qe~b!
zMd+yg&S79kkg~S#_>dm?lYyb(FF5&}xyRn&zL9|;q26Z`XYJ0IzVq|#`yW4ke3I$m
z%N_wxeEv?JBs$?~k)@u#{_(24^Bz4ue)#a=A75TxuK4}!t;&3U1_qyGeffh`R?0_y
z$}=!*h)=uyw(R#C*3IkJ-`;&wB0ah1@L|J$k4iqBx_tk4-FLSy&CP~#^2c{bCzpNu
zS~h=wHUmQf*H6zE_17=|n{+j6>+3)Uh6ed9<^2h3ufHy=tIPXr$-wYt;ocZVMh1p&
zm+!3wrL^DPAd>j>22mOJ_k;Dm8p+2G5}E?lzWmtnnv;Q{;iEC5QJef128ILvKQ}V$
zoSnhN!0=$Z0Vv<4>(2;Xyk#E5iDnC#85m}Y%OBhn#K6GtM=K0l?gNJ@dX^j&L@T34
z17tKnK=l&tT5L3hjHZy$6oRXbH<~*}bH`}z7|k7+y+8Vv3}^N;E<3=yD^xW2F9QPu
NgQu&X%Q~loCIGICBMbll

literal 0
HcmV?d00001

diff --git a/Tests/LibWeb/Screenshot/input/css-background-blob-url.html b/Tests/LibWeb/Screenshot/input/css-background-blob-url.html
new file mode 100644
index 00000000000..549af979a49
--- /dev/null
+++ b/Tests/LibWeb/Screenshot/input/css-background-blob-url.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en" class="reftest-wait">
+    <head>
+        <link rel="match" href="../expected/css-background-blob-url-ref.html" />
+        <style>
+            #background {
+                width: 50px;
+                height: 50px;
+                border: 2px solid blue;
+                background-repeat: no-repeat;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="background"></div>
+
+        <script>
+            fetch("../data/smiley.png")
+                .then(response => response.blob())
+                .then(blob => {
+                    const url = URL.createObjectURL(blob);
+                    background.style.backgroundImage = `url('${url}')`;
+
+                    // FIXME: This is pretty hacky. We don't have a way to wait for the background image URL to load to
+                    //        signal that the test is done. So we load a second blob URL using Image, which we can wait
+                    //        upon. Since these are sequential, the second image load indicates that the first is done.
+                    requestAnimationFrame(() => {
+                        const image = new Image();
+                        image.addEventListener("load", () => {
+                            requestAnimationFrame(() => {
+                                document.documentElement.classList.remove("reftest-wait");
+                            });
+                        });
+                        image.src = URL.createObjectURL(blob);
+                    });
+                });
+        </script>
+    </body>
+</html>