From 019f8eaf45a61bcf72398b4b404c3e8d497463a7 Mon Sep 17 00:00:00 2001
From: Shane Osbourne <shane.osbourne8@gmail.com>
Date: Mon, 27 Feb 2023 22:28:38 +0000
Subject: [PATCH] fix: remove document.write (#2019)

* fix: remove document.write

* fixes

---------

Co-authored-by: Shane Osbourne <sosbourne@duckduckgo.com>
---
 packages/browser-sync/lib/config.js              |  4 ++--
 ...-tags-simple.tmpl => script-tags-simple.html} |  0
 packages/browser-sync/templates/script-tags.html | 16 ++++++++++++++++
 packages/browser-sync/templates/script-tags.tmpl |  3 ---
 .../test/specs/e2e/e2e.options.script.async.js   |  2 +-
 5 files changed, 19 insertions(+), 6 deletions(-)
 rename packages/browser-sync/templates/{script-tags-simple.tmpl => script-tags-simple.html} (100%)
 create mode 100644 packages/browser-sync/templates/script-tags.html
 delete mode 100644 packages/browser-sync/templates/script-tags.tmpl

diff --git a/packages/browser-sync/lib/config.js b/packages/browser-sync/lib/config.js
index c3ebbee49..790f8e3b9 100644
--- a/packages/browser-sync/lib/config.js
+++ b/packages/browser-sync/lib/config.js
@@ -10,11 +10,11 @@ module.exports = {
         baseDir: path.join(__dirname, "control-panel")
     },
     templates: {
-        scriptTag: path.join(__dirname, "..", "templates/script-tags.tmpl"),
+        scriptTag: path.join(__dirname, "..", "templates/script-tags.html"),
         scriptTagSimple: path.join(
             __dirname,
             "..",
-            "templates/script-tags-simple.tmpl"
+            "templates/script-tags-simple.html"
         ),
         connector: path.join(__dirname, "..", "templates/connector.tmpl")
     },
diff --git a/packages/browser-sync/templates/script-tags-simple.tmpl b/packages/browser-sync/templates/script-tags-simple.html
similarity index 100%
rename from packages/browser-sync/templates/script-tags-simple.tmpl
rename to packages/browser-sync/templates/script-tags-simple.html
diff --git a/packages/browser-sync/templates/script-tags.html b/packages/browser-sync/templates/script-tags.html
new file mode 100644
index 000000000..310c804b2
--- /dev/null
+++ b/packages/browser-sync/templates/script-tags.html
@@ -0,0 +1,16 @@
+<script id="__bs_script__">//<![CDATA[
+  (function() {
+    try {
+      var script = document.createElement('script');
+      if ('%async%') {
+        script.async = true;
+      }
+      script.src = '%script%'.replace("HOST", location.hostname);
+      if (document.body) {
+        document.body.appendChild(script);
+      }
+    } catch (e) {
+      console.error("Browsersync: could not append script tag", e);
+    }
+  })()
+//]]></script>
diff --git a/packages/browser-sync/templates/script-tags.tmpl b/packages/browser-sync/templates/script-tags.tmpl
deleted file mode 100644
index fed9de4e7..000000000
--- a/packages/browser-sync/templates/script-tags.tmpl
+++ /dev/null
@@ -1,3 +0,0 @@
-<script id="__bs_script__">//<![CDATA[
-    document.write("<script %async% src='%script%'><\/script>".replace("HOST", location.hostname));
-//]]></script>
diff --git a/packages/browser-sync/test/specs/e2e/e2e.options.script.async.js b/packages/browser-sync/test/specs/e2e/e2e.options.script.async.js
index fbe06906b..6f2f8c9be 100644
--- a/packages/browser-sync/test/specs/e2e/e2e.options.script.async.js
+++ b/packages/browser-sync/test/specs/e2e/e2e.options.script.async.js
@@ -21,7 +21,7 @@ describe("E2E script with/without async attribute", function() {
             }
         };
         browserSync(config, function(err, bs) {
-            assert.notInclude(bs.options.get("snippet"), "async");
+            assert.notInclude(bs.options.get("snippet"), "'async'");
             bs.cleanup();
             done();
         });