chore: DOC-1516 change to text/plain (#5009)

* chore: DOC-1516 change to text/plain

* chore: move to scripts

* chore: removed headtags and migrated to scripts

* chore: add head tags for preloading user-centrick scripts

* docs: update comments

(cherry picked from commit e48e4d9)

docusaurus.config.js

@@ -50,51 +50,26 @@ const config = {
   },
   staticDirectories: ["static", "static/assets/docs/images", "static/assets", "static/img/"],
   headTags: [
-    {
-      tagName: "script",
-      attributes: {
-        type: "text/plain",
-        "data-usercentrics": "FullStory",
-        src: "/scripts/fullstory.js",
-      },
-    },
     {
       tagName: "link",
       attributes: {
         rel: "preconnect",
         href: "https://api.usercentrics.eu",
       },
     },
-    {
-      tagName: "link",
-      attributes: {
-        rel: "preload",
-        href: "https://app.usercentrics.eu/browser-ui/latest/loader.js",
-        as: "script",
-      },
-    },
-    {
-      tagName: "script",
-      attributes: {
-        src: "https://app.usercentrics.eu/browser-ui/latest/loader.js",
-        "data-settings-id": "0IhiFXOBwy0Z2U",
-        id: "usercentrics-cmp",
-        async: "true",
-      },
-    },
     {
       tagName: "link",
       attributes: {
         rel: "preconnect",
-        href: "https://www.googletagmanager.com",
+        href: "https://app.usercentrics.eu",
       },
     },
     {
-      tagName: "script",
+      tagName: "link",
       attributes: {
-        type: "text/javascript",
-        "data-usercentrics": "Google Tag Manager",
-        src: "/scripts/googleTagManager.js",
+        rel: "preload",
+        href: "app.usercentrics.eu/browser-ui/latest/loader.js",
+        as: "script",
       },
     },
   ],
@@ -244,11 +219,38 @@ const config = {
       },
     ],
   ].filter(Boolean),
+  /* IMPORTANT
+  Any script added below must have the "data-usercentrics" attribute with the name of the script as the value. 
+  We also need to notify marketing about the script being added so that they can update the Usercentrics CMP.
+  Marketing needs to know what to label the script as, for example Analytics, Marketing, etc. And, if it's essential or not.
+  Essential scripts are always loaded, non-essential scripts are loaded based on user consent.
+  This is used to identify the script for Usercentrics CMP.
+  Scripts also need to have the type attribute set to "text/plain" to prevent them from being executed by the browser in the event that the user has not given consent to the script.
+  The exception to the text/plain rule is the Usercentrics CMP script which must be loaded as a script tag.
+  To learn more about attributes and values, visit https://docs.usercentrics.com/#/direct-implementation-guide?id=change-script-type-textjavascript-becomes-textplain
+  */
   scripts: [
     {
       src: `https://w.appzi.io/w.js?token=${process.env.APPZI_TOKEN}`,
       defer: true,
     },
+    {
+      src: "/scripts/fullstory.js",
+      type: "text/plain",
+      "data-usercentrics": "FullStory",
+    },
+    {
+      type: "text/plain",
+      src: "/scripts/googleTagManager.js",
+      "data-usercentrics": "Google Tag Manager",
+    },
+    {
+      src: "https://app.usercentrics.eu/browser-ui/latest/loader.js",
+      id: "usercentrics-cmp",
+      async: "true",
+      "data-settings-id": "0IhiFXOBwy0Z2U",
+      type: "text/javascript",
+    },
   ],
   themes: ["docusaurus-theme-openapi-docs"],
   customFields: {

static/scripts/fullstory.js

@@ -1,68 +1,149 @@
-window["_fs_debug"] = false;
 window["_fs_host"] = "fullstory.com";
 window["_fs_script"] = "edge.fullstory.com/s/fs.js";
 window["_fs_org"] = "11NJ6J";
 window["_fs_namespace"] = "FS";
-(function (m, n, e, t, l, o, g, y) {
-  if (e in m) {
-    if (m.console && m.console.log) {
-      m.console.log('FullStory namespace conflict. Please set window["_fs_namespace"].');
+!(function (m, n, e, t, l, o, g, y) {
+  var s,
+    f,
+    a = (function (h) {
+      return (
+        !(h in m) ||
+        (m.console &&
+          m.console.log &&
+          m.console.log('FullStory namespace conflict. Please set window["_fs_namespace"].'),
+        !1)
+      );
+    })(e);
+  function p(b) {
+    var h,
+      d = [];
+    function j() {
+      h &&
+        (d.forEach(function (b) {
+          var d;
+          try {
+            d = b[h[0]] && b[h[0]](h[1]);
+          } catch (h) {
+            return void (b[3] && b[3](h));
+          }
+          d && d.then ? d.then(b[2], b[3]) : b[2] && b[2](d);
+        }),
+        (d.length = 0));
     }
-    return;
+    function r(b) {
+      return function (d) {
+        h || ((h = [b, d]), j());
+      };
+    }
+    return (
+      b(r(0), r(1)),
+      {
+        then: function (b, h) {
+          return p(function (r, i) {
+            d.push([b, h, r, i]), j();
+          });
+        },
+      }
+    );
   }
-  g = m[e] = function (a, b, s) {
-    g.q ? g.q.push([a, b, s]) : g._api(a, b, s);
-  };
-  g.q = [];
-  o = n.createElement(t);
-  o.async = 1;
-  o.crossOrigin = "anonymous";
-  o.src = "https://" + window["_fs_script"];
-  y = n.getElementsByTagName(t)[0];
-  y.parentNode.insertBefore(o, y);
-  g.identify = function (i, v, s) {
-    g(l, { uid: i }, s);
-    if (v) g(l, v, s);
-  };
-  g.setUserVars = function (v, s) {
-    g(l, v, s);
-  };
-  g.event = function (i, v, s) {
-    g("event", { n: i, p: v }, s);
-  };
-  g.anonymize = function () {
-    g.identify(!!0);
-  };
-  g.shutdown = function () {
-    g("rec", !1);
-  };
-  g.restart = function () {
-    g("rec", !0);
-  };
-  g.log = function (a, b) {
-    g("log", [a, b]);
-  };
-  g.consent = function (a) {
-    g("consent", !arguments.length || a);
-  };
-  g.identifyAccount = function (i, v) {
-    o = "account";
-    v = v || {};
-    v.acctId = i;
-    g(o, v);
-  };
-  g.clearUserCookie = function () {};
-  g.setVars = function (n, p) {
-    g("setVars", [n, p]);
-  };
-  g._w = {};
-  y = "XMLHttpRequest";
-  g._w[y] = m[y];
-  y = "fetch";
-  g._w[y] = m[y];
-  if (m[y])
-    m[y] = function () {
-      return g._w[y].apply(this, arguments);
-    };
-  g._v = "1.3.0";
-})(window, document, window["_fs_namespace"], "script", "user");
+  a &&
+    ((g = m[e] =
+      (function () {
+        var b = function (b, d, j, r) {
+          function i(i, c) {
+            h(b, d, j, i, c, r);
+          }
+          r = r || 2;
+          var c,
+            u = /Async$/;
+          return u.test(b)
+            ? ((b = b.replace(u, "")), "function" == typeof Promise ? new Promise(i) : p(i))
+            : h(b, d, j, c, c, r);
+        };
+        function h(h, d, j, r, i, c) {
+          return b._api ? b._api(h, d, j, r, i, c) : (b.q && b.q.push([h, d, j, r, i, c]), null);
+        }
+        return (b.q = []), b;
+      })()),
+    (y = function (b) {
+      function h(h) {
+        "function" == typeof h[4] && h[4](new Error(b));
+      }
+      var d = g.q;
+      if (d) {
+        for (var j = 0; j < d.length; j++) h(d[j]);
+        (d.length = 0), (d.push = h);
+      }
+    }),
+    (function () {
+      ((o = n.createElement(t)).async = !0),
+        (o.crossOrigin = "anonymous"),
+        (o.src = "https://" + l),
+        (o.onerror = function () {
+          y("Error loading " + l);
+        });
+      var b = n.getElementsByTagName(t)[0];
+      b && b.parentNode ? b.parentNode.insertBefore(o, b) : n.head.appendChild(o);
+    })(),
+    (function () {
+      function b() {}
+      function h(b, h, d) {
+        g(b, h, d, 1);
+      }
+      function d(b, d, j) {
+        h("setProperties", { type: b, properties: d }, j);
+      }
+      function j(b, h) {
+        d("user", b, h);
+      }
+      function r(b, h, d) {
+        j(
+          {
+            uid: b,
+          },
+          d
+        ),
+          h && j(h, d);
+      }
+      (g.identify = r),
+        (g.setUserVars = j),
+        (g.identifyAccount = b),
+        (g.clearUserCookie = b),
+        (g.setVars = d),
+        (g.event = function (b, d, j) {
+          h(
+            "trackEvent",
+            {
+              name: b,
+              properties: d,
+            },
+            j
+          );
+        }),
+        (g.anonymize = function () {
+          r(!1);
+        }),
+        (g.shutdown = function () {
+          h("shutdown");
+        }),
+        (g.restart = function () {
+          h("restart");
+        }),
+        (g.log = function (b, d) {
+          h("log", { level: b, msg: d });
+        }),
+        (g.consent = function (b) {
+          h("setIdentity", { consent: !arguments.length || b });
+        });
+    })(),
+    (s = "fetch"),
+    (f = "XMLHttpRequest"),
+    (g._w = {}),
+    (g._w[f] = m[f]),
+    (g._w[s] = m[s]),
+    m[s] &&
+      (m[s] = function () {
+        return g._w[s].apply(this, arguments);
+      }),
+    (g._v = "2.0.0"));
+})(window, document, window._fs_namespace, "script", window._fs_script);