@schalkneethling/css-media-pseudo-polyfill 1.0.6 → 1.0.11

package/dist/fn.mjs

@@ -1,2 +1,2 @@
-import { t as polyfill } from "./polyfill-BA69lY_2.mjs";
+import { t as polyfill } from "./polyfill-CiJgx85h.mjs";
 export { polyfill };

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { t as polyfill } from "./polyfill-BA69lY_2.mjs";
+import { t as polyfill } from "./polyfill-CiJgx85h.mjs";
 //#region src/index.ts
 if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", () => polyfill());
 else polyfill();

package/dist/{polyfill-BA69lY_2.mjs → polyfill-CiJgx85h.mjs}

@@ -211,6 +211,21 @@ function rewriteStyleElements(unsupported) {
 //#endregion
 //#region src/rewrite-link.ts
 /**
+* Resolve relative url() references in CSS text to absolute URLs, using
+* the stylesheet's own URL as the base. This is necessary because when CSS
+* is fetched from a <link> and re-injected as an inline <style>, the browser
+* resolves url() references relative to the document URL rather than the
+* original stylesheet URL, breaking any relative paths (e.g. url('../images/bg.png')).
+*
+* Data URIs and absolute URLs (https?:, //, /) are left untouched.
+*/
+function resolveUrls(cssText, base) {
+	return cssText.replace(/url\(\s*(['"]?)(.*?)\1\s*\)/gi, (match, quote, path) => {
+		if (/^(?:data:|https?:|\/)/.test(path)) return match;
+		return `url(${quote}${new URL(path, base).href}${quote})`;
+	});
+}
+/**
 * Check whether a stylesheet URL is same-origin. The browser resolves
 * relative hrefs to absolute URLs on the HTMLLinkElement.href property,
 * so comparing the origin portion covers both relative paths and
@@ -243,6 +258,7 @@ async function processLinkSheet(link, unsupported) {
 	} catch {
 		return;
 	}
+	cssText = resolveUrls(cssText, href);
 	const rewritten = rewriteCss(cssText, unsupported);
 	link.setAttribute("data-polyfill-rewritten", "");
 	if (rewritten === null) return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schalkneethling/css-media-pseudo-polyfill",
-  "version": "1.0.6",
+  "version": "1.0.11",
   "description": "A CSS polyfill for media pseudo-classes (:playing, :paused, :seeking, :buffering, :stalled, :muted)",
   "keywords": [
     "audio",
@@ -23,7 +23,7 @@
   "author": "Schalk Neethling",
   "repository": {
     "type": "git",
-    "url": "https://github.com/schalkneethling/css-media-pseudo-polyfill"
+    "url": "git+https://github.com/schalkneethling/css-media-pseudo-polyfill.git"
   },
   "files": [
     "dist"
@@ -34,6 +34,16 @@
     "./fn": "./dist/fn.mjs",
     "./package.json": "./package.json"
   },
+  "scripts": {
+    "build": "vp pack",
+    "dev": "vp pack --watch",
+    "test": "vp test",
+    "test:e2e": "playwright test",
+    "typecheck": "tsc --noEmit",
+    "release": "bumpp",
+    "prepublishOnly": "vp pack",
+    "prepare": "vp config"
+  },
   "dependencies": {
     "css-tree": "^3.1.0"
   },
@@ -48,12 +58,11 @@
     "vite-plus": "latest",
     "vitest": "npm:@voidzero-dev/vite-plus-test@latest"
   },
-  "scripts": {
-    "build": "vp pack",
-    "dev": "vp pack --watch",
-    "test": "vp test",
-    "test:e2e": "playwright test",
-    "typecheck": "tsc --noEmit",
-    "release": "bumpp"
+  "packageManager": "pnpm@10.32.1",
+  "pnpm": {
+    "overrides": {
+      "vite": "npm:@voidzero-dev/vite-plus-core@latest",
+      "vitest": "npm:@voidzero-dev/vite-plus-test@latest"
+    }
   }
-}
+}