fix(turbopack-ecmascript-runtime): handle non encoded CSS paths (verc…

…el/turborepo#6777)

### Description

Quick fix while there might still be some characters in filenames that
are not allowed in URLs


Closes PACK-2097

crates/turbopack-core/src/ident.rs

@@ -174,6 +174,9 @@ impl AssetIdent {
         context_path: Vc<FileSystemPath>,
         expected_extension: String,
     ) -> Result<Vc<String>> {
+        // TODO(PACK-2140): restrict character set to A–Za–z0–9-_.~'()
+        // to be compatible with all operating systems + URLs.
+
         // For clippy -- This explicit deref is necessary
         let path = &*self.path.await?;
         let mut name = if let Some(inner) = context_path.await?.get_path_to(path) {

crates/turbopack-ecmascript-runtime/js/src/dev/runtime/dom/runtime-backend-dom.ts

@@ -90,10 +90,12 @@ async function loadWebAssemblyModule(
       deleteResolver(chunkPath);
 
       const chunkUrl = getChunkRelativeUrl(chunkPath);
+      // TODO(PACK-2140): remove this once all filenames are guaranteed to be escaped.
+      const decodedChunkUrl = decodeURI(chunkUrl);
 
       if (chunkPath.endsWith(".css")) {
         const links = document.querySelectorAll(
-          `link[href="${chunkUrl}"],link[href^="${chunkUrl}?"]`
+          `link[href="${chunkUrl}"],link[href^="${chunkUrl}?"],link[href="${decodedChunkUrl}"],link[href^="${decodedChunkUrl}?"]`
         );
         for (const link of Array.from(links)) {
           link.remove();
@@ -104,7 +106,7 @@ async function loadWebAssemblyModule(
         // However, we still want to remove the script tag from the DOM to keep
         // the HTML somewhat consistent from the user's perspective.
         const scripts = document.querySelectorAll(
-          `script[src="${chunkUrl}"],script[src^="${chunkUrl}?"]`
+          `script[src="${chunkUrl}"],script[src^="${chunkUrl}?"],script[src="${decodedChunkUrl}"],script[src^="${decodedChunkUrl}?"]`
         );
         for (const script of Array.from(scripts)) {
           script.remove();
@@ -122,9 +124,10 @@ async function loadWebAssemblyModule(
         }
 
         const chunkUrl = getChunkRelativeUrl(chunkPath);
+        const decodedChunkUrl = decodeURI(chunkUrl);
 
         const previousLinks = document.querySelectorAll(
-          `link[rel=stylesheet][href="${chunkUrl}"],link[rel=stylesheet][href^="${chunkUrl}?"]`
+          `link[rel=stylesheet][href="${chunkUrl}"],link[rel=stylesheet][href^="${chunkUrl}?"],link[rel=stylesheet][href="${decodedChunkUrl}"],link[rel=stylesheet][href^="${decodedChunkUrl}?"]`
         );
 
         if (previousLinks.length == 0) {
@@ -222,10 +225,11 @@ async function loadWebAssemblyModule(
     }
 
     const chunkUrl = getChunkRelativeUrl(chunkPath);
+    const decodedChunkUrl = decodeURI(chunkUrl);
 
     if (chunkPath.endsWith(".css")) {
       const previousLinks = document.querySelectorAll(
-        `link[rel=stylesheet][href="${chunkUrl}"],link[rel=stylesheet][href^="${chunkUrl}?"]`
+        `link[rel=stylesheet][href="${chunkUrl}"],link[rel=stylesheet][href^="${chunkUrl}?"],link[rel=stylesheet][href="${decodedChunkUrl}"],link[rel=stylesheet][href^="${decodedChunkUrl}?"]`
       );
       if (previousLinks.length > 0) {
         // CSS chunks do not register themselves, and as such must be marked as
@@ -247,7 +251,7 @@ async function loadWebAssemblyModule(
       }
     } else if (chunkPath.endsWith(".js")) {
       const previousScripts = document.querySelectorAll(
-        `script[src="${chunkUrl}"],script[src^="${chunkUrl}?"]`
+        `script[src="${chunkUrl}"],script[src^="${chunkUrl}?"],script[src="${decodedChunkUrl}"],script[src^="${decodedChunkUrl}?"]`
       );
       if (previousScripts.length > 0) {
         // There is this edge where the script already failed loading, but we