HashedFilesMixin for ES modules does not work with `import*as ...` syntax

[Michael]

Django's regex does not work with the following:

import*as l from "/static/jsapp/jsapp/dtmod.min.js";import*as h from "/static/jsapp/jsapp/nummod.min.js";import*as m from "/static/leave/jsapp/fetcher.min.js";import {BaseComponent as g} from "/static/wcapp/jsapp/wc-base.min.425310100bce.js";

As you can see only the 4th import was correctly altered, the first 3 werent even detected, (below is the same as above but placed the imports on seprate lines for readability):

import*as l from "/static/jsapp/jsapp/dtmod.min.js";
import*as h from "/static/jsapp/jsapp/nummod.min.js";
import*as m from "/static/leave/jsapp/fetcher.min.js";
import {BaseComponent as g} from "/static/wcapp/jsapp/wc-base.min.425310100bce.js";

This regex handles the missing case:

            (
                r"""(?P<matched>(?P<import_as>import\s*\*as\s\S+)\s+from\s*["'](?P<url>[./].*?)["']\s*;)""",
                """%(import_as)s from "%(url)s";""",
            ),

[Sarah Boyce]

Replying to Michael:

import*as l from "/static/jsapp/jsapp/dtmod.min.js";
import*as h from "/static/jsapp/jsapp/nummod.min.js";
import*as m from "/static/leave/jsapp/fetcher.min.js";
import {BaseComponent as g} from "/static/wcapp/jsapp/wc-base.min.425310100bce.js";

This doesn't look valid to me, shouldn't it be import * as not import*as?

[Michael]

Hi, no it is not invalid, that is the result of minification, removing any extra whitespace, most production system will serve minified files, so it's much more likely to not have the space.

[Sarah Boyce]

Replying to Michael:

Hi, no it is not invalid, that is the result of minification, removing any extra whitespace, most production system will serve minified files, so it's much more likely to not have the space.

Ah, TIL 😁 confirmed that this is the output of many minifiers

Confirmed that your suggested patch works for me, here is also a test:

tests/staticfiles_tests/project/documents/cached/module.js

@@ -2 +2 @@
 import rootConst from "/static/absolute_root.js";
 import testConst from "./module_test.js";
 import * as NewModule from "./module_test.js";
+import*as m from"./module_test.js";
 import { testConst as alias } from "./module_test.js";
 import { firstConst, secondConst } from "./module_test.js";
 import {

tests/staticfiles_tests/test_storage.py

@@ -674 +674 @@
 
     def test_module_import(self):
         relpath = self.hashed_file_path("cached/module.js")
-        self.assertEqual(relpath, "cached/module.55fd6938fbc5.js")
+        self.assertEqual(relpath, "cached/module.d16a17156de1.js")
         tests = [
             # Relative imports.
             b'import testConst from "./module_test.477bbebe77f0.js";',
@@ -686 +686 @@
             b'const dynamicModule = import("./module_test.477bbebe77f0.js");',
             # Creating a module object.
             b'import * as NewModule from "./module_test.477bbebe77f0.js";',
+            # Creating a minified module object.
+            b'import*as m from "./module_test.477bbebe77f0.js";',
             # Aliases.
             b'import { testConst as alias } from "./module_test.477bbebe77f0.js";',
             b"import {\n"

Would you like to raise a PR?

[Michael]

Okay great, thanks for handling it. I dont know what "TIL" means, but cheers!

[Sarah Boyce]

Replying to Michael:

Okay great, thanks for handling it. I dont know what "TIL" means, but cheers!

Sorry it's short for "Today I learned"

[Farhan Ali]

output of this produces import *as m from "./module_test.477bbebe77f0.477bbebe77f0.js"; for me.
I don't know why.

[Farhan Ali]

django/contrib/staticfiles/storage.py

@@ -73 +73 @@
                 r"""(?P<matched>import\(["'](?P<url>.*?)["']\))""",
                 """import("%(url)s")""",
             ),
+            (
+                r"""(?P<matched>(?P<import_as>import\s*\*as\s\S+)\s+from\s*["'](?P<url>[./].*?)["']\s*;)""",
+                """%(import_as)s from "%(url)s";""",
+            ),
         ),
     )
     patterns = (
@@ -287 +291 @@
 
         # where to store the new paths
         hashed_files = {}
-
         # build a list of adjustable files
         adjustable_paths = [
             path for path in paths if matches_patterns(path, self._patterns)
         ]
-
         # Adjustable files to yield at end, keyed by the original path.
         processed_adjustable_paths = {}
 

tests/staticfiles_tests/project/documents/cached/module.js

@@ -2 +2 @@
 import rootConst from "/static/absolute_root.js";
 import testConst from "./module_test.js";
 import * as NewModule from "./module_test.js";
+import *as m from "./module_test.js";
 import { testConst as alias } from "./module_test.js";
 import { firstConst, secondConst } from "./module_test.js";
 import {

tests/staticfiles_tests/test_storage.py

@@ -643 +643 @@
 
     def test_module_import(self):
         relpath = self.hashed_file_path("cached/module.js")
-        self.assertEqual(relpath, "cached/module.55fd6938fbc5.js")
+        self.assertEqual(relpath, "cached/module.0415cd43ac63.js")
         tests = [
             # Relative imports.
             b'import testConst from "./module_test.477bbebe77f0.js";',
@@ -655 +655 @@
             b'const dynamicModule = import("./module_test.477bbebe77f0.js");',
             # Creating a module object.
             b'import * as NewModule from "./module_test.477bbebe77f0.js";',
+            # Creating a minified module object.
+            b'import*as m from "./module_test.477bbebe77f0.js";',
             # Aliases.
             b'import { testConst as alias } from "./module_test.477bbebe77f0.js";',
             b"import {\n"

[Sarah Boyce <42296566+sarahboyce@…>]

In 6993c9d8:

Fixed #35553 -- Handled import*as in HashedFilesMixin.