Expose utility functions for custom script builder usage

server/meta.jsx

@@ -24,8 +24,15 @@ import {
 } from "./constants";
 import { constHas, entries } from "./util";
 
+type SDKAttributes = {|
+  [string]: string | boolean,
+|};
+
 type SDKMeta = {|
   getSDKLoader: (options?: {| baseURL?: string, nonce?: string |}) => string,
+  getSDKScriptAttributes: () => SDKAttributes | void,
+  getSDKScriptUrl: () => string | void,
+  getSDKInlineScript: (baseURL?: string) => string | void,
 |};
 
 const emailRegex = /^.+@.+$/;
@@ -239,10 +246,6 @@ function validateSDKUrl(sdkUrl: string) {
   }
 }
 
-type SDKAttributes = {|
-  [string]: string | boolean,
-|};
-
 const getDefaultSDKAttributes = (): SDKAttributes => {
   // $FlowFixMe
   return {};
@@ -307,38 +310,8 @@ function sanitizeSDKUrl(sdkUrl: string): string {
   return sdkUrl;
 }
 
-export function unpackSDKMeta(sdkMeta?: string): SDKMeta {
-  const { url, attrs } = sdkMeta
-    ? JSON.parse(
-        Buffer.from(decodeURIComponent(sdkMeta), "base64").toString("utf8")
-      )
-    : DEFAULT_SDK_META;
-
-  if (url) {
-    validateSDKUrl(url);
-  }
-
-  const getSDKLoader = ({
-    baseURL = DEFAULT_LEGACY_SDK_BASE_URL,
-    nonce = "",
-  } = {}) => {
-    if (url) {
-      const validAttrs = getSDKScriptAttributes(url, attrs);
-
-      // $FlowFixMe
-      const allAttrs = {
-        nonce,
-        src: sanitizeSDKUrl(url),
-        ...validAttrs,
-      };
-
-      return (<script {...allAttrs} />).render(html());
-    }
-
-    return (
-      <script
-        nonce={nonce}
-        innerHTML={`
+function getSDKInlineScript(baseURL: string): string {
+  return `
                     (function() {
                         function loadScript(url, attributes) {
                             var scriptTag = '<scr' + 'ipt src="' + url + '" ' + (attributes || '') + '></scr' + 'ipt>';
@@ -395,12 +368,54 @@ export function unpackSDKMeta(sdkMeta?: string): SDKMeta {
                             return;
                         }
                     })();
-                `}
-      />
+                `;
+}
+
+export function unpackSDKMeta(sdkMeta?: string): SDKMeta {
+  const { url, attrs } = sdkMeta
+    ? JSON.parse(
+        Buffer.from(decodeURIComponent(sdkMeta), "base64").toString("utf8")
+      )
+    : DEFAULT_SDK_META;
+
+  if (url) {
+    validateSDKUrl(url);
+  }
+
+  const getSDKLoader = ({
+    baseURL = DEFAULT_LEGACY_SDK_BASE_URL,
+    nonce = "",
+  } = {}) => {
+    if (url) {
+      const validAttrs = getSDKScriptAttributes(url, attrs);
+
+      // $FlowFixMe
+      const allAttrs = {
+        nonce,
+        src: sanitizeSDKUrl(url),
+        ...validAttrs,
+      };
+
+      return (<script {...allAttrs} />).render(html());
+    }
+
+    return (
+      <script nonce={nonce} innerHTML={getSDKInlineScript(baseURL)} />
     ).render(html());
   };
 
+  const hasInlineScript = !url;
+
   return {
     getSDKLoader,
+    getSDKScriptAttributes: () => {
+      return hasInlineScript ? undefined : getSDKScriptAttributes(url, attrs);
+    },
+    getSDKScriptUrl: () => {
+      return hasInlineScript ? undefined : sanitizeSDKUrl(url);
+    },
+    getSDKInlineScript: (baseURL = DEFAULT_LEGACY_SDK_BASE_URL) => {
+      return hasInlineScript ? getSDKInlineScript(baseURL) : undefined;
+    },
   };
 }

server/meta.test.js

@@ -2,7 +2,7 @@
 /* eslint max-lines: off */
 
 import cheerio from "cheerio";
-import { test, afterEach } from "vitest";
+import { describe, expect, test, afterEach } from "vitest";
 
 import { unpackSDKMeta } from ".";
 
@@ -1399,3 +1399,67 @@ test("should error when the origin parameter is not just the origin", () => {
     throw new Error("Expected error to be thrown");
   }
 });
+
+describe("Utilities", () => {
+  test("getSDKScriptUrl() matches sdkScript src", () => {
+    const sdkUrl = "https://www.paypal.com/sdk/js?client-id=foo";
+
+    const { getSDKLoader, getSDKScriptUrl } = unpackSDKMeta(
+      Buffer.from(
+        JSON.stringify({
+          url: sdkUrl,
+        })
+      ).toString("base64")
+    );
+
+    const $ = cheerio.load(getSDKLoader());
+    const src = $("script").attr("src");
+
+    const sdkScriptUrl = getSDKScriptUrl();
+
+    expect(sdkScriptUrl).toBe(sdkUrl);
+    expect(sdkScriptUrl).toBe(src);
+  });
+
+  test("getSDKScriptAttributes() matches sdkScript data-attributes", () => {
+    const sdkUrl = "https://www.paypal.com/sdk/js?client-id=foo";
+
+    const attrs = {
+      "data-uid": "uid",
+      "data-popups-disabled": "true",
+      "data-dummy-id": "begone",
+    };
+
+    const { getSDKLoader, getSDKScriptAttributes } = unpackSDKMeta(
+      Buffer.from(
+        JSON.stringify({
+          url: sdkUrl,
+          attrs,
+        })
+      ).toString("base64")
+    );
+
+    const $ = cheerio.load(getSDKLoader());
+    const scriptTag = $("script");
+
+    const result = getSDKScriptAttributes();
+
+    expect(result).toBeDefined();
+    expect(result).not.toHaveProperty("data-dummy-id");
+    expect(attrs).toMatchObject(result);
+
+    for (const [name, value] of Object.entries(result || {})) {
+      expect(scriptTag.attr(name)).toBe(value);
+    }
+  });
+
+  test("getSDKInlineScript() matches loader inline script", () => {
+    const { getSDKLoader, getSDKInlineScript } = unpackSDKMeta();
+
+    const $ = cheerio.load(getSDKLoader());
+    const script = $("script").html();
+
+    const result = getSDKInlineScript();
+    expect(script).toContain(result);
+  });
+});