fix: ensure consistent order of scripts in Component.Media.js (#783)

This commit is contained in:
Juro Oravec 2024-11-26 22:55:14 +01:00 committed by GitHub
parent 2a4b0f5289
commit 5fc27a041f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 29 additions and 8 deletions

View file

@ -433,7 +433,9 @@ def _process_dep_declarations(content: bytes, type: RenderType) -> Tuple[bytes,
content = COMPONENT_COMMENT_REGEX.sub(on_replace_match, content)
comp_hashes: Set[str] = set()
# NOTE: Python's set does NOT preserve order
seen_comp_hashes: Set[str] = set()
comp_hashes: List[str] = []
# Process individual parts. Each part is like a CSV row of `name,id`.
# E.g. something like this:
@ -445,7 +447,11 @@ def _process_dep_declarations(content: bytes, type: RenderType) -> Tuple[bytes,
raise RuntimeError("Malformed dependencies data")
comp_cls_hash = part_match.group("comp_cls_hash").decode("utf-8")
comp_hashes.add(comp_cls_hash)
if comp_cls_hash in seen_comp_hashes:
continue
comp_hashes.append(comp_cls_hash)
seen_comp_hashes.add(comp_cls_hash)
(
to_load_component_js_urls,
@ -534,7 +540,7 @@ def _postprocess_media_tags(
script_type: ScriptType,
tags: List[str],
) -> Tuple[List[str], List[str]]:
deduped_urls: Set[str] = set()
urls: List[str] = []
tags_by_url: Dict[str, str] = {}
for tag in tags:
@ -549,15 +555,16 @@ def _postprocess_media_tags(
f"value for attribute '{attr}'. Got:\n{tag}"
)
url = cast(str, maybe_url)
# Skip duplicates
if maybe_url in deduped_urls:
if url in tags_by_url:
continue
url = cast(str, maybe_url)
tags_by_url[url] = tag
deduped_urls.add(url)
urls.append(url)
urls = sorted(deduped_urls)
# Ensure consistent order
tags = [tags_by_url[url] for url in urls]
return tags, urls

View file

@ -329,12 +329,16 @@ class DependencyRenderingTests(BaseTestCase):
self.assertEqual(
rendered.count("const loadedCssScripts = ["style.css", "style2.css"];"), 1
)
# JS ORDER - "script.js", "script2.js"
self.assertEqual(
rendered.count(
r"const toLoadJsScripts = [Components.unescapeJs(\`<script src="script.js"></script>\`), Components.unescapeJs(\`<script src="script2.js"></script>\`)];"
),
1,
)
# CSS ORDER - "style.css", "style2.css"
self.assertEqual(
rendered.count(
r"const toLoadCssScripts = [Components.unescapeJs(\`<link href="style.css" media="all" rel="stylesheet">\`), Components.unescapeJs(\`<link href="style2.css" media="all" rel="stylesheet">\`)];"
@ -413,12 +417,22 @@ class DependencyRenderingTests(BaseTestCase):
),
1,
)
# JS ORDER:
# - "script2.js" (from SimpleComponentNested)
# - "script.js" (from SimpleComponent inside SimpleComponentNested)
# - "xyz1.js" (from OtherComponent inserted into SimpleComponentNested)
self.assertEqual(
rendered.count(
r"const toLoadJsScripts = [Components.unescapeJs(\`<script src="script.js"></script>\`), Components.unescapeJs(\`<script src="script2.js"></script>\`), Components.unescapeJs(\`<script src="xyz1.js"></script>\`)];"
r"const toLoadJsScripts = [Components.unescapeJs(\`<script src="script2.js"></script>\`), Components.unescapeJs(\`<script src="script.js"></script>\`), Components.unescapeJs(\`<script src="xyz1.js"></script>\`)];"
),
1,
)
# CSS ORDER:
# - "style.css", "style2.css" (from SimpleComponentNested)
# - "style.css" (from SimpleComponent inside SimpleComponentNested)
# - "xyz1.css" (from OtherComponent inserted into SimpleComponentNested)
self.assertEqual(
rendered.count(
r"const toLoadCssScripts = [Components.unescapeJs(\`<link href="style.css" media="all" rel="stylesheet">\`), Components.unescapeJs(\`<link href="style2.css" media="all" rel="stylesheet">\`), Components.unescapeJs(\`<link href="xyz1.css" media="all" rel="stylesheet">\`)];"