@flourish/sdk 5.0.0 → 5.2.0

package/RELEASE_NOTES.md

@@ -1,3 +1,11 @@
+# 5.2.0
+* Fixes issue publishing templates with complex settings
+* Improves html sanitation in template publishing workflow
+
+# 5.1.0
+* Revoke SDK token on logout
+  this improves on the previous behaviour where logging out would only purge tokens locally.
+
 # 5.0.0
 * Add automatic SDK local settings restore on template reload
 * Upgrade node-fetch dependency to avoid annoying deprecation warning. #91

package/bin/flourish.js

@@ -11,7 +11,7 @@ const OPTS = {
 		"help", "build", "open", "debug", "full", "force",
 
 		// Options for 'publish'
-		"prerelease", "patch", "release", "local-testing"
+		"prerelease", "patch", "release", "local-testing",
 	],
 	string: [
 		"host", "listen", "port", "user", "password",
@@ -35,7 +35,7 @@ const OPTS = {
 		build: true,
 		open: false,
 
-		env: "development"
+		env: "development",
 	},
 
 	alias: {
@@ -48,7 +48,7 @@ const OPTS = {
 		if (unknown_option.startsWith("-")) {
 			log.die("Unknown option: " + unknown_option);
 		}
-	}
+	},
 };
 
 // Unhandled rejections indicate an error in the app
@@ -73,7 +73,7 @@ const COMMANDS = [
 	"delete",
 	"upgrade",
 	"list",
-	"history"
+	"history",
 ];
 
 function main() {
@@ -88,8 +88,8 @@ function main() {
 	args._ = args._.map(String);
 
 	let [command] = args._;
-	if (args.version) command = "version";
-	else if (args.help) command = "help";
+	if (args.version) { command = "version"; }
+	else if (args.help) { command = "help"; }
 
 	if (!command) {
 		return log.die("No command specified. Type ‘flourish help’ for help.");

package/common/embed/credit.js

@@ -3,7 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getLocalizedCreditTextAndUrl = exports.createFlourishCredit = void 0;
+exports.createFlourishCredit = createFlourishCredit;
+exports.getLocalizedCreditTextAndUrl = getLocalizedCreditTextAndUrl;
 const localizations_1 = __importDefault(require("./localizations"));
 function createFlourishCredit(credit_url, query_string, public_url, credit_text) {
     credit_url = credit_url || "https://flourish.studio",
@@ -29,19 +30,18 @@ function createFlourishCredit(credit_url, query_string, public_url, credit_text)
     a.appendChild(span);
     return credit;
 }
-exports.createFlourishCredit = createFlourishCredit;
 function getLocalizedCreditTextAndUrl(lang, credit_key) {
     var credit_text, credit_url;
     lang = lang || "en", credit_key = credit_key || "";
     credit_text = localizations_1.default[lang].credits[credit_key] || localizations_1.default.en.credits[credit_key] || localizations_1.default.en.credits.default;
     if (typeof credit_text == "object") {
-        if (credit_text.url)
+        if (credit_text.url) {
             credit_url = credit_text.url;
+        }
         credit_text = credit_text.text;
     }
     return {
         credit_text: credit_text,
-        credit_url: credit_url
+        credit_url: credit_url,
     };
 }
-exports.getLocalizedCreditTextAndUrl = getLocalizedCreditTextAndUrl;

package/common/embed/customer_analytics.js

@@ -1,6 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.initCustomerAnalytics = exports.dispatchAnalyticsEvent = exports.removeAnalyticsListener = exports.addAnalyticsListener = exports.sendCustomerAnalyticsMessage = void 0;
+exports.sendCustomerAnalyticsMessage = sendCustomerAnalyticsMessage;
+exports.addAnalyticsListener = addAnalyticsListener;
+exports.removeAnalyticsListener = removeAnalyticsListener;
+exports.dispatchAnalyticsEvent = dispatchAnalyticsEvent;
+exports.initCustomerAnalytics = initCustomerAnalytics;
 // Embedded code - must work in IE
 var enabled = false;
 function getLocationData() {
@@ -28,17 +32,20 @@ function getLocationData() {
     return data;
 }
 function sendCustomerAnalyticsMessage(message) {
-    if (!enabled)
+    if (!enabled) {
         return;
-    if (window.top === window.self)
+    }
+    if (window.top === window.self) {
         return;
+    }
     var embedded_window = window;
-    if (embedded_window.location.pathname === "srcdoc")
+    if (embedded_window.location.pathname === "srcdoc") {
         embedded_window = embedded_window.parent;
+    }
     var location_data = getLocationData();
     var message_with_metadata = {
         sender: "Flourish",
-        method: "customerAnalytics"
+        method: "customerAnalytics",
     };
     for (var key in location_data) {
         if (location_data.hasOwnProperty(key)) {
@@ -52,14 +59,12 @@ function sendCustomerAnalyticsMessage(message) {
     }
     embedded_window.parent.postMessage(JSON.stringify(message_with_metadata), "*");
 }
-exports.sendCustomerAnalyticsMessage = sendCustomerAnalyticsMessage;
 function addAnalyticsListener(callback) {
     if (typeof callback !== "function") {
         throw new Error("Analytics callback is not a function");
     }
     window.Flourish._analytics_listeners.push(callback);
 }
-exports.addAnalyticsListener = addAnalyticsListener;
 function removeAnalyticsListener(callback) {
     if (typeof callback !== "function") {
         throw new Error("Analytics callback is not a function");
@@ -68,47 +73,45 @@ function removeAnalyticsListener(callback) {
         return callback !== listener;
     });
 }
-exports.removeAnalyticsListener = removeAnalyticsListener;
 function dispatchAnalyticsEvent(message) {
     // If the window.Flourish object hasn't been created by the customer, they
     // can't be listening for analytics events
-    if (!window.Flourish)
+    if (!window.Flourish) {
         return;
+    }
     window.Flourish._analytics_listeners.forEach(function (listener) {
         listener(message);
     });
 }
-exports.dispatchAnalyticsEvent = dispatchAnalyticsEvent;
 function initCustomerAnalytics() {
     enabled = true;
     var events = [
         {
             event_name: "click",
             action_name: "click",
-            use_capture: true
+            use_capture: true,
         },
         {
             event_name: "keydown",
             action_name: "key_down",
-            use_capture: true
+            use_capture: true,
         },
         {
             event_name: "mouseenter",
             action_name: "mouse_enter",
-            use_capture: false
+            use_capture: false,
         },
         {
             event_name: "mouseleave",
             action_name: "mouse_leave",
-            use_capture: false
-        }
+            use_capture: false,
+        },
     ];
     events.forEach(function (event) {
         document.body.addEventListener(event.event_name, function () {
             sendCustomerAnalyticsMessage({
-                action: event.action_name
+                action: event.action_name,
             });
         }, event.use_capture);
     });
 }
-exports.initCustomerAnalytics = initCustomerAnalytics;

package/common/embed/embedding.js

@@ -14,42 +14,51 @@ function isFixedHeight() {
         var params = (0, parse_query_params_1.default)();
         // "referrer" in params implies this is an Embedly embed
         // Check whether embedding site is known to support dynamic resizing
-        if ("referrer" in params)
+        if ("referrer" in params) {
             is_fixed_height = /^https:\/\/medium.com\//.test(params.referrer);
-        else
+        }
+        else {
             is_fixed_height = !("auto" in params);
+        }
     }
     return is_fixed_height;
 }
 function getHeightForBreakpoint(width) {
     var breakpoint_width = width || window.innerWidth;
-    if (breakpoint_width > 999)
+    if (breakpoint_width > 999) {
         return 650;
-    if (breakpoint_width > 599)
+    }
+    if (breakpoint_width > 599) {
         return 575;
+    }
     return 400;
 }
 function initScrolly(opts) {
-    if (!opts)
+    if (!opts) {
         return;
-    if (window.top === window.self)
+    }
+    if (window.top === window.self) {
         return;
+    }
     var embedded_window = window;
-    if (embedded_window.location.pathname == "srcdoc")
+    if (embedded_window.location.pathname == "srcdoc") {
         embedded_window = embedded_window.parent;
+    }
     var message = {
         sender: "Flourish",
         method: "scrolly",
-        captions: opts.captions
+        captions: opts.captions,
     };
     embedded_window.parent.postMessage(JSON.stringify(message), "*");
 }
 function notifyParentWindow(height, opts) {
-    if (window.top === window.self)
+    if (window.top === window.self) {
         return;
+    }
     var embedded_window = window;
-    if (embedded_window.location.pathname == "srcdoc")
+    if (embedded_window.location.pathname == "srcdoc") {
         embedded_window = embedded_window.parent;
+    }
     if (is_amp) {
         // Message is not stringified for AMP
         height = parseInt(height, 10);
@@ -63,13 +72,14 @@ function notifyParentWindow(height, opts) {
     var message = {
         sender: "Flourish",
         context: "iframe.resize",
-        method: "resize",
+        method: "resize", // backwards compatibility
         height: height,
         src: embedded_window.location.toString(),
     };
     if (opts) {
-        for (var name in opts)
+        for (var name in opts) {
             message[name] = opts[name];
+        }
     }
     embedded_window.parent.postMessage(JSON.stringify(message), "*");
 }
@@ -100,10 +110,12 @@ function validateWarnMessage(message) {
         console.warn("BUG: validateWarnMessage called for method" + message.method);
         return false;
     }
-    if ((message.message != null) && !isString(message.message))
+    if ((message.message != null) && !isString(message.message)) {
         return false;
-    if ((message.explanation != null) && !isString(message.explanation))
+    }
+    if ((message.explanation != null) && !isString(message.explanation)) {
         return false;
+    }
     return true;
 }
 function validateResizeMessage(message) {
@@ -111,12 +123,15 @@ function validateResizeMessage(message) {
         console.warn("BUG: validateResizeMessage called for method" + message.method);
         return false;
     }
-    if (!isString(message.src))
+    if (!isString(message.src)) {
         return false;
-    if (!isString(message.context))
+    }
+    if (!isString(message.context)) {
         return false;
-    if (!isPossibleHeight(message.height))
+    }
+    if (!isPossibleHeight(message.height)) {
         return false;
+    }
     return true;
 }
 function validateSetSettingMessage(_message) {
@@ -127,8 +142,9 @@ function validateScrolly(message) {
         console.warn("BUG: validateScrolly called for method" + message.method);
         return false;
     }
-    if (!Array.isArray(message.captions))
+    if (!Array.isArray(message.captions)) {
         return false;
+    }
     return true;
 }
 function validateCustomerAnalyticsMessage(message) {
@@ -148,10 +164,12 @@ function validateRequestUpload(message) {
     }
     // FIXME: when adding validation for setSetting (see above) we should
     // also validate that this is a valid setting name of appropriate type
-    if (!isString(message.name))
+    if (!isString(message.name)) {
         return false;
-    if (!(message.accept == null || isString(message.accept)))
+    }
+    if (!(message.accept == null || isString(message.accept))) {
         return false;
+    }
     return true;
 }
 function getMessageValidators(methods) {
@@ -161,7 +179,7 @@ function getMessageValidators(methods) {
         "setSetting": validateSetSettingMessage,
         "customerAnalytics": validateCustomerAnalyticsMessage,
         "request-upload": validateRequestUpload,
-        "scrolly": validateScrolly
+        "scrolly": validateScrolly,
     };
     var validators = {};
     for (var i = 0; i < methods.length; i++) {
@@ -187,11 +205,13 @@ function startEventListeners(callback, allowed_methods, embed_domain) {
                 const origin = event.origin.toLowerCase();
                 embed_domain = embed_domain.toLowerCase();
                 // Allow the domain itself…
-                if (origin.endsWith("//" + embed_domain))
+                if (origin.endsWith("//" + embed_domain)) {
                     return true;
+                }
                 // and subdomains
-                if (origin.endsWith("." + embed_domain))
+                if (origin.endsWith("." + embed_domain)) {
                     return true;
+                }
             }
             if (event.origin.match(/\/\/localhost:\d+$|\/\/(?:public|app)\.flourish.devlocal$|\/\/flourish-api\.com$|\.flourish\.(?:local(:\d+)?|net|rocks|studio)$|\.uri\.sh$|\/\/flourish-user-templates\.com$/)) {
                 return true;
@@ -200,10 +220,12 @@ function startEventListeners(callback, allowed_methods, embed_domain) {
         })();
         // event.source is null when the message is sent by an extension
         // https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage#Using_window.postMessage_in_extensions
-        if (event.source == null)
+        if (event.source == null) {
             return;
-        if (!is_accepted_event_origin)
+        }
+        if (!is_accepted_event_origin) {
             return;
+        }
         var message;
         try {
             message = typeof event.data === "object" ? event.data : JSON.parse(event.data);
@@ -212,8 +234,9 @@ function startEventListeners(callback, allowed_methods, embed_domain) {
             console.warn("Unexpected non-JSON message: " + JSON.stringify(event.data));
             return;
         }
-        if (message.sender !== "Flourish")
+        if (message.sender !== "Flourish") {
             return;
+        }
         if (!message.method) {
             console.warn("The 'method' property was missing from message", message);
             return;
@@ -245,13 +268,15 @@ function onSafariWindowResize() {
     var containers = document.querySelectorAll(".flourish-embed");
     for (var i = 0; i < containers.length; i++) {
         var container = containers[i];
-        if (container.getAttribute("data-width"))
+        if (container.getAttribute("data-width")) {
             continue;
+        }
         var iframe = container.querySelector("iframe");
         // When embeds are dynamically loaded, we might have a container without a
         // loaded iframe yet
-        if (!iframe)
+        if (!iframe) {
             continue;
+        }
         var computed_style = window.getComputedStyle(container);
         var width = container.offsetWidth - parseFloat(computed_style.paddingLeft) - parseFloat(computed_style.paddingRight);
         iframe.style.width = width + "px";
@@ -295,7 +320,8 @@ function createScrolly(iframe, captions) {
         step.style.marginLeft = "auto";
         step.style.marginRight = "auto";
         var caption = document.createElement("div");
-        caption.innerHTML = dompurify_1.default.sanitize(d);
+        // eslint-disable-next-line flourish-security/dompurify
+        caption.innerHTML = dompurify_1.default.sanitize(d, { ADD_ATTR: ["target"] });
         caption.style.visibility = has_content ? "" : "hidden";
         caption.style.display = "inline-block";
         caption.style.paddingTop = "1.25em";
@@ -320,8 +346,9 @@ function initIntersection(container) {
         entries.forEach(function (entry) {
             if (entry.isIntersecting) {
                 var iframe = container.querySelector("iframe");
-                if (iframe)
+                if (iframe) {
                     iframe.src = iframe.src.replace(/#slide-.*/, "") + "#slide-" + entry.target.getAttribute("data-slide");
+                }
             }
         });
     }, { rootMargin: "0px 0px -" + t + " 0px" });
@@ -361,7 +388,7 @@ function createEmbedIframe(embed_url, container, width, height, play_on_load) {
             iframe: iframe,
             width: width,
             height: height,
-            play_on_load: play_on_load
+            play_on_load: play_on_load,
         };
         // If this is the first embed on the page which is isn't displayed, set up a
         // list of hidden iframes to poll
@@ -411,22 +438,28 @@ function setIframeContent(embed_url, container, iframe, width, height, play_on_l
     else if (width && width.match(/^[ \t\r\n\f]*([+-]?\d+|\d*\.\d+(?:[eE][+-]?\d+)?)(?:\\?[Pp]|\\0{0,4}[57]0(?:\r\n|[ \t\r\n\f])?)(?:\\?[Xx]|\\0{0,4}[57]8(?:\r\n|[ \t\r\n\f])?)[ \t\r\n\f]*$/)) {
         width_in_px = parseFloat(width);
     }
-    if (height && typeof height === "number")
+    if (height && typeof height === "number") {
         height = "" + height + "px";
+    }
     // Odd design decision in Safari means need to set fixed width rather than %
     // as will try and size iframe to content otherwise. Must also set scrolling=no
-    if (width)
+    if (width) {
         iframe.style.width = width;
-    else if (isSafari())
+    }
+    else if (isSafari()) {
         iframe.style.width = container.offsetWidth + "px";
-    else
+    }
+    else {
         iframe.style.width = "100%";
+    }
     var fixed_height = !!height;
     if (!fixed_height) {
-        if (embed_url.match(/\?/))
+        if (embed_url.match(/\?/)) {
             embed_url += "&auto=1";
-        else
+        }
+        else {
             embed_url += "?auto=1";
+        }
         // For initial height, use our standard breakpoints, based on the explicit
         // pixel width if we know it, or the iframe's measured width if not.
         height = getHeightForBreakpoint(width_in_px || iframe.offsetWidth) + "px";
@@ -453,7 +486,7 @@ function initEmbedding() {
         isSafari: isSafari,
         initCustomerAnalytics: customer_analytics_1.initCustomerAnalytics,
         addAnalyticsListener: customer_analytics_1.addAnalyticsListener,
-        sendCustomerAnalyticsMessage: customer_analytics_1.sendCustomerAnalyticsMessage
+        sendCustomerAnalyticsMessage: customer_analytics_1.sendCustomerAnalyticsMessage,
     };
 }
 exports.default = initEmbedding;

package/common/embed/localizations.d.ts

@@ -1,12 +1,12 @@
 declare namespace _default {
     namespace de {
         namespace credits {
-            const _default: string;
+            let _default: string;
             export { _default as default };
         }
     }
     namespace en {
-        const credits_1: {
+        let credits_1: {
             default: {
                 text: string;
                 url: string;
@@ -159,7 +159,7 @@ declare namespace _default {
         export { credits_1 as credits };
     }
     namespace es {
-        const credits_2: {
+        let credits_2: {
             default: string;
             bar_race: {
                 text: string;
@@ -173,7 +173,7 @@ declare namespace _default {
         export { credits_2 as credits };
     }
     namespace fr {
-        const credits_3: {
+        let credits_3: {
             default: string;
             bar_race: {
                 text: string;
@@ -187,7 +187,7 @@ declare namespace _default {
         export { credits_3 as credits };
     }
     namespace it {
-        const credits_4: {
+        let credits_4: {
             default: string;
             bar_race: {
                 text: string;
@@ -201,7 +201,7 @@ declare namespace _default {
         export { credits_4 as credits };
     }
     namespace mi {
-        const credits_5: {
+        let credits_5: {
             default: string;
             bar_race: {
                 text: string;
@@ -215,7 +215,7 @@ declare namespace _default {
         export { credits_5 as credits };
     }
     namespace nl {
-        const credits_6: {
+        let credits_6: {
             default: string;
             bar_race: {
                 text: string;
@@ -228,7 +228,7 @@ declare namespace _default {
         };
         export { credits_6 as credits };
     }
-    const pt: {
+    let pt: {
         default: string;
         bar_race: {
             text: string;

package/common/embed/localizations.js

@@ -45,7 +45,7 @@ exports.default = {
             "text-annotator": { text: "Interactive content by Flourish", url: "https://flourish.studio/blog/text-annotator-template/" },
             "tournament": { text: "Interactive content by Flourish", url: "https://flourish.studio/visualisations/tournament-chart/" },
             "word-cloud": { text: "A Flourish data visualization", url: "https://flourish.studio/blog/online-wordcloud-custom-fonts/" },
-        }
+        },
     },
     "es": {
         credits: {
@@ -66,7 +66,7 @@ exports.default = {
             "default": "Creato con Flourish",
             "bar_race": { text: "Creato con Flourish", url: "https://flourish.studio/visualisations/bar-chart-race/" },
             "bar-chart-race": { text: "Creato con Flourish", url: "https://flourish.studio/visualisations/bar-chart-race/" },
-        }
+        },
     },
     "mi": {
         credits: {
@@ -85,6 +85,6 @@ exports.default = {
     "pt": {
         "default": "Feito com Flourish",
         "bar_race": { text: "Feito com Flourish", url: "https://flourish.studio/visualisations/bar-chart-race/" },
-        "bar-chart-race": { text: "Feito com Flourish", url: "https://flourish.studio/visualisations/bar-chart-race/" }
-    }
+        "bar-chart-race": { text: "Feito com Flourish", url: "https://flourish.studio/visualisations/bar-chart-race/" },
+    },
 };

package/common/embed/parse_query_params.js

@@ -6,8 +6,9 @@ function parseQueryParams() {
     var location = window.location;
     // We use srcdoc to load the decrypted content for password-protected projects,
     // which creates a nested window.
-    if (location.href == "about:srcdoc")
+    if (location.href == "about:srcdoc") {
         location = window.parent.location;
+    }
     var params = {};
     (function (query, re, match) {
         while (match = re.exec(query)) {

package/common/package.json

@@ -1,9 +1,19 @@
 {
     "name": "@flourish/common",
     "description": "Common shared utilities",
+    "scripts": {
+        "test": "jest",
+        "test:ci": "jest --config jest.config.ci.mjs"
+    },
     "dependencies": {
         "@adobe/css-tools": "^4.3.3",
-        "@flourish/interpreter": "^8.4.0",
+        "@flourish/interpreter": "^9.1.1",
         "dompurify": "^3.1.4"
+    },
+    "devDependencies": {
+        "@types/jest": "^29.5.12",
+        "jest": "^29.7.0",
+        "jest-junit": "^16.0.0",
+        "ts-jest": "^29.1.5"
     }
 }