From 57833f411c9f3a0c223f66be4ecc3df8442bb8a3 Mon Sep 17 00:00:00 2001
From: Dylan Piercey <dpiercey@ebay.com>
Date: Thu, 18 Mar 2021 10:50:55 -0700
Subject: [PATCH] fix: avoid duplicate assets with webpack-assets tag (#51)

---
 components/webpack-assets/index.marko         | 13 +++++++--
 .../__snapshots__/webpack4/server--main.js    | 29 ++++++++++++-------
 .../__snapshots__/webpack5/server--main.js    | 29 ++++++++++++-------
 3 files changed, 48 insertions(+), 23 deletions(-)

diff --git a/components/webpack-assets/index.marko b/components/webpack-assets/index.marko
index eac6169..a0d463a 100644
--- a/components/webpack-assets/index.marko
+++ b/components/webpack-assets/index.marko
@@ -1,16 +1,23 @@
 import manifest from "!!@marko/webpack/loader!?manifest";
 $ const { entry, scriptAttrs, styleAttrs } = input;
 $ const assets = manifest.getAssets(entry, out.global.buildName);
+$ const written = out.global.___writtenAssets || (out.global.___writtenAssets = new Set());
 
 <if(assets.js)>
   $ const nonce = out.global.cspNonce;
   <for|js| of=assets.js>
-    <script src=(__webpack_public_path__+js) nonce=nonce ...scriptAttrs />
+    <if(!written.has(js))>
+      $ written.add(js);
+      <script src=(__webpack_public_path__+js) nonce=nonce ...scriptAttrs />
+    </if>
   </for>
 </if>
 
 <if(assets.css)>
   <for|css| of=assets.css>
-    <link rel="stylesheet" href=(__webpack_public_path__+css) ...styleAttrs />
+    <if(!written.has(css))>
+      $ written.add(css);
+      <link rel="stylesheet" href=(__webpack_public_path__+css) ...styleAttrs />
+    </if>
   </for>
-</if>
\ No newline at end of file
+</if>
diff --git a/src/__tests__/fixtures/asset-tag/__snapshots__/webpack4/server--main.js b/src/__tests__/fixtures/asset-tag/__snapshots__/webpack4/server--main.js
index d868c91..c626627 100644
--- a/src/__tests__/fixtures/asset-tag/__snapshots__/webpack4/server--main.js
+++ b/src/__tests__/fixtures/asset-tag/__snapshots__/webpack4/server--main.js
@@ -121,6 +121,7 @@ _marko_template._ = marko_dist_runtime_components_renderer__WEBPACK_IMPORTED_MOD
     styleAttrs
   } = input;
   const assets = _marko_webpack_loader_manifest__WEBPACK_IMPORTED_MODULE_0__["default"].getAssets(entry, out.global.buildName);
+  const written = out.global.___writtenAssets || (out.global.___writtenAssets = new Set());
 
   if (assets.js) {
     const nonce = out.global.cspNonce;
@@ -128,11 +129,15 @@ _marko_template._ = marko_dist_runtime_components_renderer__WEBPACK_IMPORTED_MOD
 
     for (const js of assets.js) {
       const _keyScope = `[${_keyValue++}]`;
-      out.w(`<script${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_2___default()({
-        "src": __webpack_require__.p + js,
-        "nonce": nonce,
-        ...scriptAttrs
-      })}></script>`);
+
+      if (!written.has(js)) {
+        written.add(js);
+        out.w(`<script${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_2___default()({
+          "src": __webpack_require__.p + js,
+          "nonce": nonce,
+          ...scriptAttrs
+        })}></script>`);
+      }
     }
   }
 
@@ -141,11 +146,15 @@ _marko_template._ = marko_dist_runtime_components_renderer__WEBPACK_IMPORTED_MOD
 
     for (const css of assets.css) {
       const _keyScope2 = `[${_keyValue2++}]`;
-      out.w(`<link${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_2___default()({
-        "rel": "stylesheet",
-        "href": __webpack_require__.p + css,
-        ...styleAttrs
-      })}>`);
+
+      if (!written.has(css)) {
+        written.add(css);
+        out.w(`<link${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_2___default()({
+          "rel": "stylesheet",
+          "href": __webpack_require__.p + css,
+          ...styleAttrs
+        })}>`);
+      }
     }
   }
 }, {
diff --git a/src/__tests__/fixtures/asset-tag/__snapshots__/webpack5/server--main.js b/src/__tests__/fixtures/asset-tag/__snapshots__/webpack5/server--main.js
index 61bc7cc..3d313de 100644
--- a/src/__tests__/fixtures/asset-tag/__snapshots__/webpack5/server--main.js
+++ b/src/__tests__/fixtures/asset-tag/__snapshots__/webpack5/server--main.js
@@ -38,6 +38,7 @@ _marko_template._ = marko_dist_runtime_components_renderer__WEBPACK_IMPORTED_MOD
     styleAttrs
   } = input;
   const assets = _marko_webpack_loader_manifest__WEBPACK_IMPORTED_MODULE_1__.default.getAssets(entry, out.global.buildName);
+  const written = out.global.___writtenAssets || (out.global.___writtenAssets = new Set());
 
   if (assets.js) {
     const nonce = out.global.cspNonce;
@@ -45,11 +46,15 @@ _marko_template._ = marko_dist_runtime_components_renderer__WEBPACK_IMPORTED_MOD
 
     for (const js of assets.js) {
       const _keyScope = `[${_keyValue++}]`;
-      out.w(`<script${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_3___default()({
-        "src": __webpack_require__.p + js,
-        "nonce": nonce,
-        ...scriptAttrs
-      })}></script>`);
+
+      if (!written.has(js)) {
+        written.add(js);
+        out.w(`<script${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_3___default()({
+          "src": __webpack_require__.p + js,
+          "nonce": nonce,
+          ...scriptAttrs
+        })}></script>`);
+      }
     }
   }
 
@@ -58,11 +63,15 @@ _marko_template._ = marko_dist_runtime_components_renderer__WEBPACK_IMPORTED_MOD
 
     for (const css of assets.css) {
       const _keyScope2 = `[${_keyValue2++}]`;
-      out.w(`<link${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_3___default()({
-        "rel": "stylesheet",
-        "href": __webpack_require__.p + css,
-        ...styleAttrs
-      })}>`);
+
+      if (!written.has(css)) {
+        written.add(css);
+        out.w(`<link${marko_dist_runtime_html_helpers_attrs__WEBPACK_IMPORTED_MODULE_3___default()({
+          "rel": "stylesheet",
+          "href": __webpack_require__.p + css,
+          ...styleAttrs
+        })}>`);
+      }
     }
   }
 }, {