mirror of
https://github.com/django-components/django-components.git
synced 2025-08-30 10:47:20 +00:00
fix: Fix broken JS execution order (#821)
* fix: fix broken js exec order * [pre-commit.ci] auto fixes from pre-commit.com hooks for more information, see https://pre-commit.ci * refactor: remove stale comment --------- Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
This commit is contained in:
parent
e88e3af27f
commit
be27c1c94d
15 changed files with 833 additions and 379 deletions
|
@ -125,11 +125,7 @@ class ComponentMediaTests(BaseTestCase):
|
|||
self.assertInHTML('<link href="path/to/style.css" media="all" rel="stylesheet">', rendered)
|
||||
self.assertInHTML('<link href="path/to/style2.css" media="all" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script src="path/to/script.js"></script>', rendered)
|
||||
|
||||
def test_css_js_as_string(self):
|
||||
class SimpleComponent(Component):
|
||||
|
@ -146,12 +142,7 @@ class ComponentMediaTests(BaseTestCase):
|
|||
rendered = SimpleComponent.render()
|
||||
|
||||
self.assertInHTML('<link href="path/to/style.css" media="all" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script src="path/to/script.js"></script>', rendered)
|
||||
|
||||
def test_css_as_dict(self):
|
||||
class SimpleComponent(Component):
|
||||
|
@ -175,11 +166,7 @@ class ComponentMediaTests(BaseTestCase):
|
|||
self.assertInHTML('<link href="path/to/style2.css" media="print" rel="stylesheet">', rendered)
|
||||
self.assertInHTML('<link href="path/to/style3.css" media="screen" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script src="path/to/script.js"></script>', rendered)
|
||||
|
||||
def test_media_custom_render_js(self):
|
||||
class MyMedia(Media):
|
||||
|
@ -204,15 +191,8 @@ class ComponentMediaTests(BaseTestCase):
|
|||
|
||||
rendered = SimpleComponent.render()
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script defer src=&quot;path/to/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script defer src=&quot;path/to/script2.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn('<script defer src="path/to/script.js"></script>', rendered)
|
||||
self.assertIn('<script defer src="path/to/script2.js"></script>', rendered)
|
||||
|
||||
def test_media_custom_render_css(self):
|
||||
class MyMedia(Media):
|
||||
|
@ -314,23 +294,10 @@ class MediaPathAsObjectTests(BaseTestCase):
|
|||
self.assertInHTML('<link css_tag href="path/to/style3.css" rel="stylesheet" />', rendered)
|
||||
self.assertInHTML('<link href="path/to/style4.css" media="screen" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script js_tag src=&quot;path/to/script.js&quot; type=&quot;module&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script hi src=&quot;path/to/script2.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script type=&quot;module&quot; src=&quot;path/to/script3.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script4.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script js_tag src="path/to/script.js" type="module"></script>', rendered)
|
||||
self.assertInHTML('<script hi src="path/to/script2.js"></script>', rendered)
|
||||
self.assertInHTML('<script type="module" src="path/to/script3.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="path/to/script4.js"></script>', rendered)
|
||||
|
||||
def test_pathlike(self):
|
||||
"""
|
||||
|
@ -376,19 +343,9 @@ class MediaPathAsObjectTests(BaseTestCase):
|
|||
self.assertInHTML('<link href="path/to/style3.css" media="print" rel="stylesheet">', rendered)
|
||||
self.assertInHTML('<link href="path/to/style4.css" media="screen" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script2.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script3.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script src="path/to/script.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="path/to/script2.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="path/to/script3.js"></script>', rendered)
|
||||
|
||||
def test_str(self):
|
||||
"""
|
||||
|
@ -429,15 +386,8 @@ class MediaPathAsObjectTests(BaseTestCase):
|
|||
self.assertInHTML('<link href="path/to/style3.css" media="print" rel="stylesheet">', rendered)
|
||||
self.assertInHTML('<link href="path/to/style4.css" media="screen" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script2.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script src="path/to/script.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="path/to/script2.js"></script>', rendered)
|
||||
|
||||
def test_bytes(self):
|
||||
"""
|
||||
|
@ -478,15 +428,8 @@ class MediaPathAsObjectTests(BaseTestCase):
|
|||
self.assertInHTML('<link href="path/to/style3.css" media="print" rel="stylesheet">', rendered)
|
||||
self.assertInHTML('<link href="path/to/style4.css" media="screen" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;path/to/script2.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script src="path/to/script.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="path/to/script2.js"></script>', rendered)
|
||||
|
||||
def test_function(self):
|
||||
class SimpleComponent(Component):
|
||||
|
@ -517,23 +460,10 @@ class MediaPathAsObjectTests(BaseTestCase):
|
|||
self.assertInHTML('<link href="calendar/style2.css" media="all" rel="stylesheet">', rendered)
|
||||
self.assertInHTML('<link href="calendar/style3.css" media="all" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script hi src=&quot;calendar/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;calendar/script1.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;calendar/script2.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;calendar/script3.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script hi src="calendar/script.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="calendar/script1.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="calendar/script2.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="calendar/script3.js"></script>', rendered)
|
||||
|
||||
@override_settings(STATIC_URL="static/")
|
||||
def test_works_with_static(self):
|
||||
|
@ -570,23 +500,10 @@ class MediaPathAsObjectTests(BaseTestCase):
|
|||
self.assertInHTML('<link href="/static/calendar/style2.css" media="all" rel="stylesheet">', rendered)
|
||||
self.assertInHTML('<link href="/static/calendar/style3.css" media="all" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script hi src=&quot;/static/calendar/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;/static/calendar/script1.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;/static/calendar/script2.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script src=&quot;/static/calendar/script3.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script hi src="/static/calendar/script.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="/static/calendar/script1.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="/static/calendar/script2.js"></script>', rendered)
|
||||
self.assertInHTML('<script src="/static/calendar/script3.js"></script>', rendered)
|
||||
|
||||
|
||||
class MediaStaticfilesTests(BaseTestCase):
|
||||
|
@ -634,11 +551,7 @@ class MediaStaticfilesTests(BaseTestCase):
|
|||
# be searched as specified above (e.g. `calendar/script.js`) inside `static_root` dir.
|
||||
self.assertInHTML('<link href="/static/calendar/style.css" media="all" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script defer src=&quot;/static/calendar/script.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script defer src="/static/calendar/script.js"></script>', rendered)
|
||||
|
||||
# For context see https://github.com/EmilStenstrom/django-components/issues/522
|
||||
@override_settings(
|
||||
|
@ -698,11 +611,7 @@ class MediaStaticfilesTests(BaseTestCase):
|
|||
'<link href="/static/calendar/style.0eeb72042b59.css" media="all" rel="stylesheet">', rendered
|
||||
)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script defer src=&quot;/static/calendar/script.e1815e23e0ec.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script defer src="/static/calendar/script.e1815e23e0ec.js"></script>', rendered)
|
||||
|
||||
|
||||
class MediaRelativePathTests(BaseTestCase):
|
||||
|
@ -790,11 +699,7 @@ class MediaRelativePathTests(BaseTestCase):
|
|||
rendered,
|
||||
)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;link href=&quot;relative_file/relative_file.css&quot; media=&quot;all&quot; rel=&quot;stylesheet&quot;&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<link href="relative_file/relative_file.css" media="all" rel="stylesheet">', rendered)
|
||||
|
||||
# Settings required for autodiscover to work
|
||||
@override_settings(
|
||||
|
@ -863,8 +768,4 @@ class MediaRelativePathTests(BaseTestCase):
|
|||
self.assertInHTML('<input type="text" name="variable" value="abc">', rendered)
|
||||
self.assertInHTML('<link href="relative_file_pathobj.css" rel="stylesheet">', rendered)
|
||||
|
||||
# Command to load the JS from Media.js
|
||||
self.assertIn(
|
||||
"Components.unescapeJs(\\`&lt;script type=&quot;module&quot; src=&quot;relative_file_pathobj.js&quot;&gt;&lt;/script&gt;\\`)",
|
||||
rendered,
|
||||
)
|
||||
self.assertInHTML('<script type="module" src="relative_file_pathobj.js"></script>', rendered)
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue