@bigbinary/neeto-playwright-commons 1.8.35 → 1.8.37

package/index.cjs.js

@@ -171,8 +171,10 @@ const skipTest = {
 const shouldSkipSetupAndTeardown = () => { var _a; return ((_a = getGlobalUserState()) === null || _a === void 0 ? void 0 : _a.isLoggedIn) && process.env.SKIP_SETUP === "true"; };
 // trims and replaces multiple whitespace characters in a string with a single space
 const squish = (text) => text.trim().replace(/\s+/g, " ");
+const toCamelCase = (string) => string.toLowerCase().replace(/( \w)/g, letter => letter[1].toUpperCase());
 
 const COMMON_SELECTORS = {
+    copyButton: "copy-button",
     spinner: ".neeto-ui-spinner",
     subheaderText: "subheader-left",
     alertTitle: "alert-title",
@@ -187,6 +189,7 @@ const COMMON_SELECTORS = {
     paneHeader: "pane-header",
     profileSidebar: "profile-section",
     selectOption: (label) => `${hyphenize(label)}-select-option`,
+    radioLabel: (embedLabel) => `${hyphenize(embedLabel)}-radio-label`,
     toastMessage: "toastr-message-container",
     toastCloseButton: "toastr-close-button",
     windowAlert: "#alert-box",
@@ -242,9 +245,13 @@ function getDefaultExportFromCjs (x) {
 }
 
 function getAugmentedNamespace(n) {
+  if (n.__esModule) return n;
   var f = n.default;
 	if (typeof f == "function") {
-		var a = function () {
+		var a = function a () {
+			if (this instanceof a) {
+        return Reflect.construct(f, arguments, this.constructor);
+			}
 			return f.apply(this, arguments);
 		};
 		a.prototype = f.prototype;
@@ -925,6 +932,8 @@ var setFunctionLength = function setFunctionLength(fn, length) {
 	return fn;
 };
 
+callBind$1.exports;
+
 (function (module) {
 
 	var bind = functionBind;
@@ -968,12 +977,14 @@ var setFunctionLength = function setFunctionLength(fn, length) {
 		$defineProperty(module.exports, 'apply', { value: applyBind });
 	} else {
 		module.exports.apply = applyBind;
-	}
+	} 
 } (callBind$1));
 
+var callBindExports = callBind$1.exports;
+
 var GetIntrinsic$1 = getIntrinsic;
 
-var callBind = callBind$1.exports;
+var callBind = callBindExports;
 
 var $indexOf = callBind(GetIntrinsic$1('String.prototype.indexOf'));
 
@@ -2500,6 +2511,8 @@ var lib$7 = {
     stringify: stringify$5
 };
 
+var qs$1 = /*@__PURE__*/getDefaultExportFromCjs(lib$7);
+
 class CustomCommands {
     constructor(page, request, baseURL = process.env.BASE_URL) {
         this.interceptMultipleResponses = ({ responseUrl = "", responseStatus = 200, times = 1, baseUrl, customPageContext, timeout = 35000, } = {}) => {
@@ -2566,7 +2579,7 @@ class CustomCommands {
             };
             const formattedUrl = ramda.isEmpty(params)
                 ? url
-                : `${url}?${lib$7.stringify(params, {
+                : `${url}?${qs$1.stringify(params, {
                     arrayFormat: "brackets",
                 })}`;
             return await this.request[method](formattedUrl, requestOptions);
@@ -3129,6 +3142,7 @@ function requireCommon$1 () {
 }
 
 /* eslint-env browser */
+browser$1.exports;
 
 var hasRequiredBrowser;
 
@@ -3402,8 +3416,8 @@ function requireBrowser () {
 			} catch (error) {
 				return '[UnexpectedJSONParseError]: ' + error.message;
 			}
-		};
-} (browser$1, browser$1.exports));
+		}; 
+	} (browser$1, browser$1.exports));
 	return browser$1.exports;
 }
 
@@ -3571,6 +3585,7 @@ function requireSupportsColor () {
 /**
  * Module dependencies.
  */
+node.exports;
 
 var hasRequiredNode;
 
@@ -3836,8 +3851,8 @@ function requireNode () {
 		formatters.O = function (v) {
 			this.inspectOpts.colors = this.useColors;
 			return util.inspect(v, this.inspectOpts);
-		};
-} (node, node.exports));
+		}; 
+	} (node, node.exports));
 	return node.exports;
 }
 
@@ -3846,15 +3861,14 @@ function requireNode () {
  * treat as a browser.
  */
 
-(function (module) {
-	if (typeof process === 'undefined' || process.type === 'renderer' || process.browser === true || process.__nwjs) {
-		module.exports = requireBrowser();
-	} else {
-		module.exports = requireNode();
-	}
-} (src$1));
+if (typeof process === 'undefined' || process.type === 'renderer' || process.browser === true || process.__nwjs) {
+	src$1.exports = requireBrowser();
+} else {
+	src$1.exports = requireNode();
+}
 
-var debug$3 = /*@__PURE__*/getDefaultExportFromCjs(src$1.exports);
+var srcExports = src$1.exports;
+var debug$3 = /*@__PURE__*/getDefaultExportFromCjs(srcExports);
 
 /*!
  * playwright-extra v4.3.5 by berstend
@@ -5449,10 +5463,16 @@ class StealthPlugin extends PuppeteerExtraPlugin {
 const defaultExport = opts => new StealthPlugin(opts);
 var puppeteerExtraPluginStealth = defaultExport;
 
+// const moduleExport = defaultExport
+// moduleExport.StealthPlugin = StealthPlugin
+// module.exports = moduleExport
+
+var stealth$1 = /*@__PURE__*/getDefaultExportFromCjs(puppeteerExtraPluginStealth);
+
 var stealth = test$1.test.extend({
     browser: async ({ browser }, use) => {
         await browser.close();
-        chromium.use(puppeteerExtraPluginStealth());
+        chromium.use(stealth$1());
         const stealthBrowser = await chromium.launch();
         await use(stealthBrowser);
         await stealthBrowser.close();
@@ -5971,7 +5991,7 @@ var utils$k = {};
 	  };
 	  flat(args);
 	  return result;
-	};
+	}; 
 } (utils$k));
 
 const utils$j = utils$k;
@@ -7278,8 +7298,6 @@ braces$1.create = (input, options = {}) => {
 
 var braces_1 = braces$1;
 
-var picomatch$2 = {exports: {}};
-
 var utils$g = {};
 
 const path$8 = Path__default["default"];
@@ -7523,7 +7541,7 @@ var constants$b = {
 	    output = `(?:^(?!${output}).*$)`;
 	  }
 	  return output;
-	};
+	}; 
 } (utils$g));
 
 const utils$f = utils$g;
@@ -9035,9 +9053,9 @@ const isObject$1 = val => val && typeof val === 'object' && !Array.isArray(val);
  * @api public
  */
 
-const picomatch$1 = (glob, options, returnState = false) => {
+const picomatch$2 = (glob, options, returnState = false) => {
   if (Array.isArray(glob)) {
-    const fns = glob.map(input => picomatch$1(input, options, returnState));
+    const fns = glob.map(input => picomatch$2(input, options, returnState));
     const arrayMatcher = str => {
       for (const isMatch of fns) {
         const state = isMatch(str);
@@ -9057,8 +9075,8 @@ const picomatch$1 = (glob, options, returnState = false) => {
   const opts = options || {};
   const posix = utils$d.isWindows(options);
   const regex = isState
-    ? picomatch$1.compileRe(glob, options)
-    : picomatch$1.makeRe(glob, options, false, true);
+    ? picomatch$2.compileRe(glob, options)
+    : picomatch$2.makeRe(glob, options, false, true);
 
   const state = regex.state;
   delete regex.state;
@@ -9066,11 +9084,11 @@ const picomatch$1 = (glob, options, returnState = false) => {
   let isIgnored = () => false;
   if (opts.ignore) {
     const ignoreOpts = { ...options, ignore: null, onMatch: null, onResult: null };
-    isIgnored = picomatch$1(opts.ignore, ignoreOpts, returnState);
+    isIgnored = picomatch$2(opts.ignore, ignoreOpts, returnState);
   }
 
   const matcher = (input, returnObject = false) => {
-    const { isMatch, match, output } = picomatch$1.test(input, regex, options, { glob, posix });
+    const { isMatch, match, output } = picomatch$2.test(input, regex, options, { glob, posix });
     const result = { glob, state, regex, posix, input, output, match, isMatch };
 
     if (typeof opts.onResult === 'function') {
@@ -9120,7 +9138,7 @@ const picomatch$1 = (glob, options, returnState = false) => {
  * @api public
  */
 
-picomatch$1.test = (input, regex, options, { glob, posix } = {}) => {
+picomatch$2.test = (input, regex, options, { glob, posix } = {}) => {
   if (typeof input !== 'string') {
     throw new TypeError('Expected input to be a string');
   }
@@ -9141,7 +9159,7 @@ picomatch$1.test = (input, regex, options, { glob, posix } = {}) => {
 
   if (match === false || opts.capture === true) {
     if (opts.matchBase === true || opts.basename === true) {
-      match = picomatch$1.matchBase(input, regex, options, posix);
+      match = picomatch$2.matchBase(input, regex, options, posix);
     } else {
       match = regex.exec(output);
     }
@@ -9164,8 +9182,8 @@ picomatch$1.test = (input, regex, options, { glob, posix } = {}) => {
  * @api public
  */
 
-picomatch$1.matchBase = (input, glob, options, posix = utils$d.isWindows(options)) => {
-  const regex = glob instanceof RegExp ? glob : picomatch$1.makeRe(glob, options);
+picomatch$2.matchBase = (input, glob, options, posix = utils$d.isWindows(options)) => {
+  const regex = glob instanceof RegExp ? glob : picomatch$2.makeRe(glob, options);
   return regex.test(path$7.basename(input));
 };
 
@@ -9186,7 +9204,7 @@ picomatch$1.matchBase = (input, glob, options, posix = utils$d.isWindows(options
  * @api public
  */
 
-picomatch$1.isMatch = (str, patterns, options) => picomatch$1(patterns, options)(str);
+picomatch$2.isMatch = (str, patterns, options) => picomatch$2(patterns, options)(str);
 
 /**
  * Parse a glob pattern to create the source string for a regular
@@ -9202,8 +9220,8 @@ picomatch$1.isMatch = (str, patterns, options) => picomatch$1(patterns, options)
  * @api public
  */
 
-picomatch$1.parse = (pattern, options) => {
-  if (Array.isArray(pattern)) return pattern.map(p => picomatch$1.parse(p, options));
+picomatch$2.parse = (pattern, options) => {
+  if (Array.isArray(pattern)) return pattern.map(p => picomatch$2.parse(p, options));
   return parse$2(pattern, { ...options, fastpaths: false });
 };
 
@@ -9234,7 +9252,7 @@ picomatch$1.parse = (pattern, options) => {
  * @api public
  */
 
-picomatch$1.scan = (input, options) => scan$1(input, options);
+picomatch$2.scan = (input, options) => scan$1(input, options);
 
 /**
  * Compile a regular expression from the `state` object returned by the
@@ -9248,7 +9266,7 @@ picomatch$1.scan = (input, options) => scan$1(input, options);
  * @api public
  */
 
-picomatch$1.compileRe = (state, options, returnOutput = false, returnState = false) => {
+picomatch$2.compileRe = (state, options, returnOutput = false, returnState = false) => {
   if (returnOutput === true) {
     return state.output;
   }
@@ -9262,7 +9280,7 @@ picomatch$1.compileRe = (state, options, returnOutput = false, returnState = fal
     source = `^(?!${source}).*$`;
   }
 
-  const regex = picomatch$1.toRegex(source, options);
+  const regex = picomatch$2.toRegex(source, options);
   if (returnState === true) {
     regex.state = state;
   }
@@ -9289,7 +9307,7 @@ picomatch$1.compileRe = (state, options, returnOutput = false, returnState = fal
  * @api public
  */
 
-picomatch$1.makeRe = (input, options = {}, returnOutput = false, returnState = false) => {
+picomatch$2.makeRe = (input, options = {}, returnOutput = false, returnState = false) => {
   if (!input || typeof input !== 'string') {
     throw new TypeError('Expected a non-empty string');
   }
@@ -9304,7 +9322,7 @@ picomatch$1.makeRe = (input, options = {}, returnOutput = false, returnState = f
     parsed = parse$2(input, options);
   }
 
-  return picomatch$1.compileRe(parsed, options, returnOutput, returnState);
+  return picomatch$2.compileRe(parsed, options, returnOutput, returnState);
 };
 
 /**
@@ -9324,7 +9342,7 @@ picomatch$1.makeRe = (input, options = {}, returnOutput = false, returnState = f
  * @api public
  */
 
-picomatch$1.toRegex = (source, options) => {
+picomatch$2.toRegex = (source, options) => {
   try {
     const opts = options || {};
     return new RegExp(source, opts.flags || (opts.nocase ? 'i' : ''));
@@ -9339,22 +9357,19 @@ picomatch$1.toRegex = (source, options) => {
  * @return {Object}
  */
 
-picomatch$1.constants = constants$9;
+picomatch$2.constants = constants$9;
 
 /**
  * Expose "picomatch"
  */
 
-var picomatch_1 = picomatch$1;
+var picomatch_1 = picomatch$2;
 
-(function (module) {
-
-	module.exports = picomatch_1;
-} (picomatch$2));
+var picomatch$1 = picomatch_1;
 
 const util$7 = require$$0__default["default"];
 const braces = braces_1;
-const picomatch = picomatch$2.exports;
+const picomatch = picomatch$1;
 const utils$c = utils$g;
 const isEmptyString = val => val === '' || val === './';
 
@@ -10408,7 +10423,7 @@ var fs$a = {};
 	    }
 	    return Object.assign(Object.assign({}, exports.FILE_SYSTEM_ADAPTER), fsMethods);
 	}
-	exports.createFileSystemAdapter = createFileSystemAdapter;
+	exports.createFileSystemAdapter = createFileSystemAdapter; 
 } (fs$a));
 
 Object.defineProperty(settings$3, "__esModule", { value: true });
@@ -10761,7 +10776,7 @@ var fs$6 = {};
 	    }
 	    return Object.assign(Object.assign({}, exports.FILE_SYSTEM_ADAPTER), fsMethods);
 	}
-	exports.createFileSystemAdapter = createFileSystemAdapter;
+	exports.createFileSystemAdapter = createFileSystemAdapter; 
 } (fs$6));
 
 Object.defineProperty(settings$2, "__esModule", { value: true });
@@ -11137,6 +11152,8 @@ function queueAsPromised (context, worker, concurrency) {
 queue.exports = fastqueue;
 queue.exports.promise = queueAsPromised;
 
+var queueExports = queue.exports;
+
 var common$4 = {};
 
 Object.defineProperty(common$4, "__esModule", { value: true });
@@ -11186,7 +11203,7 @@ reader$1.default = Reader$1;
 Object.defineProperty(async$4, "__esModule", { value: true });
 const events_1 = require$$0__default$2["default"];
 const fsScandir$2 = out$2;
-const fastq = queue.exports;
+const fastq = queueExports;
 const common$2 = common$4;
 const reader_1$4 = reader$1;
 class AsyncReader extends reader_1$4.default {
@@ -12109,7 +12126,7 @@ var settings = {};
 	        return Object.assign(Object.assign({}, exports.DEFAULT_FILE_SYSTEM_ADAPTER), methods);
 	    }
 	}
-	exports.default = Settings;
+	exports.default = Settings; 
 } (settings));
 
 const taskManager = tasks;
@@ -12293,6 +12310,210 @@ const i18nFixture = {
     },
 };
 
+const EMBED_SELECTORS = {
+    iframe: (appName) => `#${appName}-iframe`,
+    modal: (appName) => `#${appName}-modal`,
+    close: (appName) => `#close-${appName}`,
+    loader: (appName) => `#${appName}-loader`,
+    inlineHeightInput: "inline-height-input-field",
+    inlineWidthInput: "inline-width-input-field",
+    inlineElementIdInput: "inline-element-id-input-field",
+    codeBlock: "code-block",
+    previewTab: "preview-tab",
+    htmlTab: "html-tab",
+    buttonTextInput: "button-text-input-field",
+    buttonPositionSelectContainer: "button-position-select-value-container",
+    buttonPositionSelectMenu: "button-position-select-menu",
+    buttonColorLabel: "button-color-label",
+    buttonTextColorLabel: "button-text-color-label",
+    colorPickerTarget: "color-picker-target",
+    colorpickerEditableInput: "colorpicker-editable-input",
+    showIconCheckbox: "show-icon-checkbox",
+    elementIdInput: "element-id-input-field",
+    previewElementPopupButton: "preview-element-popup-button",
+};
+
+const basicHTMLContent = (content) => `
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width" />
+  </head>
+  <body>
+    ${content}
+  </body>
+</html>`;
+const hexToRGB = (hex) => {
+    let r = "", g = "", b = "";
+    if (hex.length === 4) {
+        r = `0x${hex[1]}${hex[1]}`;
+        g = `0x${hex[2]}${hex[2]}`;
+        b = `0x${hex[3]}${hex[3]}`;
+    }
+    else if (hex.length === 7) {
+        r = `0x${hex[1]}${hex[2]}`;
+        g = `0x${hex[3]}${hex[4]}`;
+        b = `0x${hex[5]}${hex[6]}`;
+    }
+    return `rgb(${Number(r)}, ${Number(g)}, ${Number(b)})`;
+};
+
+class EmbedBase {
+    constructor({ context, page, neetoPlaywrightUtilities, appName, }) {
+        this.initializeEmbedPage = async ({ embedType, embedCode, customElementText = "Click here", }) => {
+            this.embedTestPage = await this.context.newPage();
+            this.embedTestPageType = embedType;
+            const fileContent = basicHTMLContent(this.embedTestPageType === "elementClick"
+                ? `${embedCode}<a href='#' id='open-popup-button'>${customElementText}</a>`
+                : embedCode);
+            this.filePath = `tmp/${faker.faker.word.noun()}.html`;
+            fs$d.writeFileSync(this.filePath, fileContent, "utf8");
+            await this.embedTestPage.goto(`file://${Path__default["default"].resolve(this.filePath)}`);
+            await this.embedTestPage.waitForLoadState("load");
+            this.embeddedFrame = this.embedTestPage.frameLocator(this.embedTestPageType === "inline"
+                ? "iframe"
+                : EMBED_SELECTORS.iframe(this.appName));
+            return this.embedTestPage;
+        };
+        this.closeEmbedModalAndPage = async () => {
+            if (this.embedTestPageType !== "inline") {
+                await this.embedTestPage
+                    .locator(EMBED_SELECTORS.close(this.appName))
+                    .click();
+                await test$1.expect(this.embedTestPage.locator(EMBED_SELECTORS.modal(this.appName))).toBeHidden();
+            }
+            await this.embedTestPage.close();
+            await this.context.close();
+            fs$d.unlinkSync(this.filePath);
+        };
+        this.clickOnPopupButton = async (popUpButtonSelectorOptions) => {
+            const popUpButton = this.embedTestPage.getByRole(this.embedTestPageType === "floatingPopup" ? "button" : "link", popUpButtonSelectorOptions);
+            await test$1.expect(popUpButton).toBeVisible();
+            await popUpButton.click();
+            await test$1.expect(this.embedTestPage.locator(EMBED_SELECTORS.loader(this.appName))).toBeHidden({
+                timeout: 10000,
+            });
+        };
+        this.copyEmbedScript = async ({ embedLabel }) => {
+            await this.page
+                .getByTestId(COMMON_SELECTORS.radioLabel(embedLabel))
+                .check();
+            await this.page.getByTestId(COMMON_SELECTORS.copyButton).click();
+            return await this.page.evaluate(() => navigator.clipboard.readText());
+        };
+        this.selectEmbedType = async (embedLabel) => {
+            await this.page.getByTestId(EMBED_SELECTORS.htmlTab).click();
+            await this.page
+                .getByTestId(COMMON_SELECTORS.radioLabel(embedLabel))
+                .check();
+        };
+        this.verifyInlineCustomization = async ({ headingTestId, inlineEmbedInterceptParams, customizationOptions, }) => {
+            const embedHeightPercentage = `${customizationOptions.embedHeight}%`;
+            const embedWidthPercentage = `${customizationOptions.embedWidth}%`;
+            await this.page
+                .getByTestId(EMBED_SELECTORS.inlineHeightInput)
+                .fill(customizationOptions.embedHeight);
+            await this.page
+                .getByTestId(EMBED_SELECTORS.inlineWidthInput)
+                .fill(customizationOptions.embedWidth);
+            await this.page
+                .getByTestId(EMBED_SELECTORS.inlineElementIdInput)
+                .fill(customizationOptions.embedDivContainerId);
+            await this.expectMultipleTextsInCodeblock([
+                RegExp(`<div .* id="${customizationOptions.embedDivContainerId}">`),
+                `elementSelector: "#${customizationOptions.embedDivContainerId}"`,
+                `height: "${embedHeightPercentage}"`,
+                `width: "${embedWidthPercentage}"`,
+            ]);
+            const inlineEmbedPromise = this.neetoPlaywrightUtilities.interceptMultipleResponses(inlineEmbedInterceptParams);
+            await this.previewTab.click();
+            await inlineEmbedPromise;
+            const iframe = this.page.locator("iframe");
+            await iframe.waitFor({ state: "visible" });
+            await test$1.expect(this.page.frameLocator("iframe").getByTestId(headingTestId)).toBeVisible({ timeout: 10000 });
+            const iframeHeight = await iframe.evaluate(node => node.getAttribute("height"));
+            const iframeWidth = await iframe.evaluate(node => node.getAttribute("width"));
+            test$1.expect(iframeHeight).toStrictEqual(embedHeightPercentage);
+            test$1.expect(iframeWidth).toStrictEqual(embedWidthPercentage);
+        };
+        this.verifyFloatingPopupCustomization = async (customizationOptions) => {
+            await this.page
+                .getByTestId(EMBED_SELECTORS.buttonTextInput)
+                .fill(customizationOptions.buttonText);
+            await this.page
+                .getByTestId(EMBED_SELECTORS.buttonPositionSelectContainer)
+                .click();
+            await this.page
+                .getByTestId(EMBED_SELECTORS.buttonPositionSelectMenu)
+                .getByText(customizationOptions.buttonPosition)
+                .click();
+            await test$1.expect(this.page.getByTestId(EMBED_SELECTORS.buttonPositionSelectContainer)).toContainText(customizationOptions.buttonPosition);
+            const buttonColorLabel = this.page.getByTestId(EMBED_SELECTORS.buttonColorLabel);
+            await buttonColorLabel
+                .getByTestId(EMBED_SELECTORS.colorPickerTarget)
+                .click();
+            await this.page
+                .getByTestId(EMBED_SELECTORS.colorpickerEditableInput)
+                .getByRole("textbox")
+                .fill(customizationOptions.buttonColorHex);
+            const buttonTextColorLabel = this.page.getByTestId(EMBED_SELECTORS.buttonTextColorLabel);
+            // This additional click is to close the previously opened color picker for buttonColor.
+            await buttonTextColorLabel
+                .getByTestId(EMBED_SELECTORS.colorPickerTarget)
+                .click();
+            await buttonTextColorLabel
+                .getByTestId(EMBED_SELECTORS.colorPickerTarget)
+                .click();
+            await this.page
+                .getByTestId(EMBED_SELECTORS.colorpickerEditableInput)
+                .getByRole("textbox")
+                .fill(customizationOptions.buttonTextColorHex);
+            await this.page.getByTestId(EMBED_SELECTORS.showIconCheckbox).click();
+            await this.expectMultipleTextsInCodeblock([
+                `btnColor: "${customizationOptions.buttonColorHex}"`,
+                `btnTextColor: "${customizationOptions.buttonTextColorHex}"`,
+                `btnPosition: "${toCamelCase(customizationOptions.buttonPosition)}"`,
+                `btnText: "${customizationOptions.buttonText}"`,
+                "showIcon: false",
+            ]);
+            await this.previewTab.click();
+            const floatingButton = this.page.getByRole("button", {
+                name: customizationOptions.buttonText,
+            });
+            await test$1.expect(floatingButton).toHaveCSS("color", hexToRGB(customizationOptions.buttonTextColorHex));
+            await test$1.expect(floatingButton).toHaveCSS("background-color", hexToRGB(customizationOptions.buttonColorHex));
+            const classRegExp = customizationOptions.buttonPosition
+                .toLocaleLowerCase()
+                .replace(" ", ".*");
+            await test$1.expect(floatingButton).toHaveClass(RegExp(classRegExp));
+            await test$1.expect(floatingButton.locator("svg")).toBeHidden();
+        };
+        this.verifyElementClickCustomization = async (customizationOptions) => {
+            await this.page
+                .getByTestId(EMBED_SELECTORS.elementIdInput)
+                .fill(customizationOptions.customId);
+            await test$1.expect(this.codeBlock).toContainText(`elementSelector: "#${customizationOptions.customId}"`);
+            await this.previewTab.click();
+            await test$1.expect(this.page.getByTestId(EMBED_SELECTORS.previewElementPopupButton)).toBeVisible();
+            await test$1.expect(this.page.locator(`#${customizationOptions.customId}`)).toBeVisible();
+        };
+        this.expectMultipleTextsInCodeblock = async (containTextOptions) => {
+            const codeBlock = this.page.getByTestId(EMBED_SELECTORS.codeBlock);
+            for (const containTextOption of containTextOptions) {
+                await test$1.expect(codeBlock).toContainText(containTextOption);
+            }
+        };
+        this.context = context;
+        this.page = page;
+        this.neetoPlaywrightUtilities = neetoPlaywrightUtilities;
+        this.appName = appName;
+        this.t = playwrightI18nextFixture.getI18nInstance().t;
+        this.codeBlock = this.page.getByTestId(EMBED_SELECTORS.codeBlock);
+        this.previewTab = this.page.getByTestId(EMBED_SELECTORS.previewTab);
+    }
+}
+
 const BASE_URL = "/api/v1";
 const NEETO_AUTH_BASE_URL = (subdomain = "app") => `https://${subdomain}.neetoauth.net`;
 const ROUTES = {
@@ -13499,6 +13720,8 @@ anyBase.HEX = '0123456789abcdef';
 
 var anyBase_1 = anyBase;
 
+var anyBase$1 = /*@__PURE__*/getDefaultExportFromCjs(anyBase_1);
+
 var pixelmatch_1 = pixelmatch;
 
 function pixelmatch(img1, img2, output, width, height, options) {
@@ -13656,6 +13879,8 @@ function grayPixel(img, i) {
     return rgb2y(r, g, b);
 }
 
+var pixelMatch = /*@__PURE__*/getDefaultExportFromCjs(pixelmatch_1);
+
 // This file is autogenerated. It's used to publish ESM to npm.
 function _typeof$1(obj) {
   "@babel/helpers - typeof";
@@ -14952,13 +15177,23 @@ ImagePHash.prototype.getHash = function (img) {
 
 // DCT function stolen from http://stackoverflow.com/questions/4240490/problems-with-dct-and-idct-algorithm-in-java
 
+/**
+ Convert a 32-bit integer color value to an RGBA object.
+ */
 function intToRGBA(i) {
-  const rgba = {};
-  rgba.r = Math.floor(i / Math.pow(256, 3));
-  rgba.g = Math.floor((i - rgba.r * Math.pow(256, 3)) / Math.pow(256, 2));
-  rgba.b = Math.floor((i - rgba.r * Math.pow(256, 3) - rgba.g * Math.pow(256, 2)) / Math.pow(256, 1));
-  rgba.a = Math.floor((i - rgba.r * Math.pow(256, 3) - rgba.g * Math.pow(256, 2) - rgba.b * Math.pow(256, 1)) / Math.pow(256, 0));
-  return rgba;
+  const a = i & 0xff;
+  i >>>= 8;
+  const b = i & 0xff;
+  i >>>= 8;
+  const g = i & 0xff;
+  i >>>= 8;
+  const r = i & 0xff;
+  return {
+    r,
+    g,
+    b,
+    a
+  };
 }
 const c$1 = [];
 function initCoefficients(size) {
@@ -15182,6 +15417,8 @@ conversions["RegExp"] = function (V, opts) {
 
 var utils = {exports: {}};
 
+utils.exports;
+
 (function (module) {
 
 	module.exports.mixin = function mixin(target, source) {
@@ -15200,9 +15437,11 @@ var utils = {exports: {}};
 
 	module.exports.implForWrapper = function (wrapper) {
 	  return wrapper[module.exports.implSymbol];
-	};
+	}; 
 } (utils));
 
+var utilsExports = utils.exports;
+
 var URLImpl = {};
 
 var urlStateMachine = {exports: {}};
@@ -93052,6 +93291,8 @@ tr46.toUnicode = function(domain_name, useSTD3) {
 
 tr46.PROCESSING_OPTIONS = PROCESSING_OPTIONS;
 
+urlStateMachine.exports;
+
 (function (module) {
 	const punycode = require$$0__default$3["default"];
 	const tr46$1 = tr46;
@@ -94347,10 +94588,12 @@ tr46.PROCESSING_OPTIONS = PROCESSING_OPTIONS;
 
 	  // We don't handle blobs, so this just delegates:
 	  return module.exports.basicURLParse(input, { baseURL: options.baseURL, encodingOverride: options.encodingOverride });
-	};
+	}; 
 } (urlStateMachine));
 
-const usm = urlStateMachine.exports;
+var urlStateMachineExports = urlStateMachine.exports;
+
+const usm = urlStateMachineExports;
 
 URLImpl.implementation = class URLImpl {
   constructor(constructorArgs) {
@@ -94550,13 +94793,15 @@ URLImpl.implementation = class URLImpl {
   }
 };
 
+URL$2.exports;
+
 (function (module) {
 
 	const conversions = lib$6;
-	const utils$1 = utils.exports;
+	const utils = utilsExports;
 	const Impl = URLImpl;
 
-	const impl = utils$1.implSymbol;
+	const impl = utils.implSymbol;
 
 	function URL(url) {
 	  if (!this || this[impl] || !(this instanceof URL)) {
@@ -94737,25 +94982,27 @@ URLImpl.implementation = class URLImpl {
 	    privateData.wrapper = obj;
 
 	    obj[impl] = new Impl.implementation(constructorArgs, privateData);
-	    obj[impl][utils$1.wrapperSymbol] = obj;
+	    obj[impl][utils.wrapperSymbol] = obj;
 	  },
 	  interface: URL,
 	  expose: {
 	    Window: { URL: URL },
 	    Worker: { URL: URL }
 	  }
-	};
+	}; 
 } (URL$2));
 
-publicApi.URL = URL$2.exports.interface;
-publicApi.serializeURL = urlStateMachine.exports.serializeURL;
-publicApi.serializeURLOrigin = urlStateMachine.exports.serializeURLOrigin;
-publicApi.basicURLParse = urlStateMachine.exports.basicURLParse;
-publicApi.setTheUsername = urlStateMachine.exports.setTheUsername;
-publicApi.setThePassword = urlStateMachine.exports.setThePassword;
-publicApi.serializeHost = urlStateMachine.exports.serializeHost;
-publicApi.serializeInteger = urlStateMachine.exports.serializeInteger;
-publicApi.parseURL = urlStateMachine.exports.parseURL;
+var URLExports = URL$2.exports;
+
+publicApi.URL = URLExports.interface;
+publicApi.serializeURL = urlStateMachineExports.serializeURL;
+publicApi.serializeURLOrigin = urlStateMachineExports.serializeURLOrigin;
+publicApi.basicURLParse = urlStateMachineExports.basicURLParse;
+publicApi.setTheUsername = urlStateMachineExports.setTheUsername;
+publicApi.setThePassword = urlStateMachineExports.setThePassword;
+publicApi.serializeHost = urlStateMachineExports.serializeHost;
+publicApi.serializeInteger = urlStateMachineExports.serializeInteger;
+publicApi.parseURL = urlStateMachineExports.parseURL;
 
 // Based on https://github.com/tmpvar/jsdom/blob/aa85b2abf07766ff7bf5c1f6daafb3726f2f2db5/lib/jsdom/living/blob.js
 
@@ -96535,6 +96782,8 @@ var lib$5 = /*#__PURE__*/Object.freeze({
 
 var require$$0 = /*@__PURE__*/getAugmentedNamespace(lib$5);
 
+fetchNpmNode.exports;
+
 (function (module) {
 
 	var realFetch = require$$0;
@@ -96550,9 +96799,11 @@ var require$$0 = /*@__PURE__*/getAugmentedNamespace(lib$5);
 		commonjsGlobal.Response = realFetch.Response;
 		commonjsGlobal.Headers = realFetch.Headers;
 		commonjsGlobal.Request = realFetch.Request;
-	}
+	} 
 } (fetchNpmNode));
 
+fetchNpmNode.exports;
+
 var request$1 = ((_ref, cb) => {
   let {
     url,
@@ -97066,7 +97317,7 @@ var EndOfFileStream = {};
 	        super(exports.defaultMessages);
 	    }
 	}
-	exports.EndOfStreamError = EndOfStreamError;
+	exports.EndOfStreamError = EndOfStreamError; 
 } (EndOfFileStream));
 
 var StreamReader = {};
@@ -97220,7 +97471,7 @@ Deferred$1.Deferred = Deferred;
 	        }
 	    }
 	}
-	exports.StreamReader = StreamReader;
+	exports.StreamReader = StreamReader; 
 } (StreamReader));
 
 (function (exports) {
@@ -97229,7 +97480,7 @@ Deferred$1.Deferred = Deferred;
 	var EndOfFileStream_1 = EndOfFileStream;
 	Object.defineProperty(exports, "EndOfStreamError", { enumerable: true, get: function () { return EndOfFileStream_1.EndOfStreamError; } });
 	var StreamReader_1 = StreamReader;
-	Object.defineProperty(exports, "StreamReader", { enumerable: true, get: function () { return StreamReader_1.StreamReader; } });
+	Object.defineProperty(exports, "StreamReader", { enumerable: true, get: function () { return StreamReader_1.StreamReader; } }); 
 } (lib$3));
 
 Object.defineProperty(AbstractTokenizer$1, "__esModule", { value: true });
@@ -97519,7 +97770,7 @@ BufferTokenizer$1.BufferTokenizer = BufferTokenizer;
 	function fromBuffer(uint8Array, fileInfo) {
 	    return new BufferTokenizer_1.BufferTokenizer(uint8Array, fileInfo);
 	}
-	exports.fromBuffer = fromBuffer;
+	exports.fromBuffer = fromBuffer; 
 } (core$2));
 
 var FileTokenizer$1 = {};
@@ -97605,7 +97856,7 @@ FileTokenizer$1.fromFile = fromFile$1;
 	    }
 	    return core.fromStream(stream, fileInfo);
 	}
-	exports.fromStream = fromStream;
+	exports.fromStream = fromStream; 
 } (lib$4));
 
 var lib$2 = {};
@@ -98153,7 +98404,7 @@ ieee754.write = function (buffer, value, offset, isLE, mLen, nBytes) {
 	    201, 202, 203, 204, 205, 206, 207, 208, 209, 210, 211, 212, 213, 214, 215, 216,
 	    217, 218, 219, 220, 221, 222, 223, 224, 225, 226, 227, 228, 229, 230, 231, 232,
 	    233, 234, 235, 236, 237, 238, 239, 240, 241, 242, 243, 244, 245, 246, 247,
-	    248, 249, 250, 251, 252, 253, 254, 255];
+	    248, 249, 250, 251, 252, 253, 254, 255]; 
 } (lib$2));
 
 var util$6 = {};
@@ -99972,6 +100223,8 @@ Object.defineProperty(fileType, 'mimeTypes', {
 
 var fileType_1 = fileType;
 
+var FileType = /*@__PURE__*/getDefaultExportFromCjs(fileType_1);
+
 /*jslint browser: true, devel: true, bitwise: false, debug: true, eqeq: false, es5: true, evil: false, forin: false, newcap: false, nomen: true, plusplus: true, regexp: false, unparam: false, sloppy: true, stupid: false, sub: false, todo: true, vars: true, white: true */
 
 var jpeg$2 = {
@@ -101273,8 +101526,10 @@ var exifParser = {
 	}
 };
 
+var EXIFParser = /*@__PURE__*/getDefaultExportFromCjs(exifParser);
+
 async function getMIMEFromBuffer(buffer, path) {
-  const fileTypeFromBuffer = await fileType_1.fromBuffer(buffer);
+  const fileTypeFromBuffer = await FileType.fromBuffer(buffer);
   if (fileTypeFromBuffer) {
     // If fileType returns something for buffer, then return the mime given
     return fileTypeFromBuffer.mime;
@@ -101420,7 +101675,7 @@ async function parseBitmap(data, path, cb) {
     return cb.call(this, error, this);
   }
   try {
-    this._exif = exifParser.create(data).parse();
+    this._exif = EXIFParser.create(data).parse();
     exifRotate(this); // EXIF data
   } catch (error) {
     /* meh */
@@ -101486,7 +101741,7 @@ const alphabet = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ
 // 0 and 1 do not exist as possible hash lengths
 const maxHashLength = [NaN, NaN];
 for (let i = 2; i < 65; i++) {
-  const maxHash = anyBase_1(anyBase_1.BIN, alphabet.slice(0, i))(new Array(64 + 1).join("1"));
+  const maxHash = anyBase$1(anyBase$1.BIN, alphabet.slice(0, i))(new Array(64 + 1).join("1"));
   maxHashLength.push(maxHash.length);
 }
 
@@ -101959,7 +102214,7 @@ class Jimp$1 extends require$$0__default$2["default"] {
       return throwError.call(this, "base must be a number between 2 and 64", cb);
     }
     let hash = this.pHash();
-    hash = anyBase_1(anyBase_1.BIN, alphabet.slice(0, base))(hash);
+    hash = anyBase$1(anyBase$1.BIN, alphabet.slice(0, base))(hash);
     while (hash.length < maxHashLength[base]) {
       hash = "0" + hash; // pad out with leading zeros
     }
@@ -102068,10 +102323,6 @@ class Jimp$1 extends require$$0__default$2["default"] {
    */
   getPixelColor(x, y, cb) {
     if (typeof x !== "number" || typeof y !== "number") return throwError.call(this, "x and y must be numbers", cb);
-
-    // round input
-    x = Math.round(x);
-    y = Math.round(y);
     const idx = this.getPixelIndex(x, y);
     const hex = this.bitmap.data.readUInt32BE(idx);
     if (isNodePattern(cb)) {
@@ -102089,10 +102340,6 @@ class Jimp$1 extends require$$0__default$2["default"] {
    */
   setPixelColor(hex, x, y, cb) {
     if (typeof hex !== "number" || typeof x !== "number" || typeof y !== "number") return throwError.call(this, "hex, x and y must be numbers", cb);
-
-    // round input
-    x = Math.round(x);
-    y = Math.round(y);
     const idx = this.getPixelIndex(x, y);
     this.bitmap.data.writeUInt32BE(hex, idx);
     if (isNodePattern(cb)) {
@@ -102105,13 +102352,15 @@ class Jimp$1 extends require$$0__default$2["default"] {
    * @return {boolean} hasAlpha whether the image contains opaque pixels
    */
   hasAlpha() {
-    for (let yIndex = 0; yIndex < this.bitmap.height; yIndex++) {
-      for (let xIndex = 0; xIndex < this.bitmap.width; xIndex++) {
-        const idx = this.bitmap.width * yIndex + xIndex << 2;
-        const alpha = this.bitmap.data[idx + 3];
-        if (alpha !== 0xff) {
-          return true;
-        }
+    const {
+      width,
+      height,
+      data
+    } = this.bitmap;
+    const byteLen = width * height << 2;
+    for (let idx = 3; idx < byteLen; idx += 4) {
+      if (data[idx] !== 0xff) {
+        return true;
       }
     }
     return false;
@@ -102211,11 +102460,16 @@ Jimp$1.rgbaToInt = function (r, g, b, a, cb) {
   if (a < 0 || a > 255) {
     return throwError.call(this, "a must be between 0 and 255", cb);
   }
-  r = Math.round(r);
-  b = Math.round(b);
-  g = Math.round(g);
-  a = Math.round(a);
-  const i = r * Math.pow(256, 3) + g * Math.pow(256, 2) + b * Math.pow(256, 1) + a * Math.pow(256, 0);
+  let i = r & 0xff;
+  i <<= 8;
+  i |= g & 0xff;
+  i <<= 8;
+  i |= b & 0xff;
+  i <<= 8;
+  i |= a & 0xff;
+
+  // Ensure sign is correct
+  i >>>= 0;
   if (isNodePattern(cb)) {
     cb.call(this, null, i);
   }
@@ -102291,7 +102545,7 @@ Jimp$1.diff = function (img1, img2) {
     return throwError.call(this, "threshold must be a number between 0 and 1");
   }
   const diff = new Jimp$1(bmp1.width, bmp1.height, 0xffffffff);
-  const numDiffPixels = pixelmatch_1(bmp1.data, bmp2.data, diff.bitmap.data, diff.bitmap.width, diff.bitmap.height, {
+  const numDiffPixels = pixelMatch(bmp1.data, bmp2.data, diff.bitmap.data, diff.bitmap.width, diff.bitmap.height, {
     threshold
   });
   return {
@@ -103253,6 +103507,7 @@ var encoder$1 = {exports: {}};
   NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
   SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 */
+encoder$1.exports;
 
 (function (module) {
 
@@ -103998,10 +104253,13 @@ var encoder$1 = {exports: {}};
 	}
 } (encoder$1));
 
+var encoderExports = encoder$1.exports;
+
 var decoder$1 = {exports: {}};
 
 /* -*- tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- /
 /* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
+decoder$1.exports;
 
 (function (module) {
 	/*
@@ -105146,17 +105404,21 @@ var decoder$1 = {exports: {}};
 	  decoder.copyToImageData(image, opts.formatAsRGBA);
 
 	  return image;
-	}
+	} 
 } (decoder$1));
 
-var encode$2 = encoder$1.exports,
-    decode$2 = decoder$1.exports;
+var decoderExports = decoder$1.exports;
+
+var encode$2 = encoderExports,
+    decode$2 = decoderExports;
 
 var jpegJs = {
   encode: encode$2,
   decode: decode$2
 };
 
+var JPEG = /*@__PURE__*/getDefaultExportFromCjs(jpegJs);
+
 const MIME_TYPE$4 = "image/jpeg";
 var jpeg = (() => ({
   mime: {
@@ -105166,10 +105428,10 @@ var jpeg = (() => ({
     MIME_JPEG: MIME_TYPE$4
   },
   decoders: {
-    [MIME_TYPE$4]: jpegJs.decode
+    [MIME_TYPE$4]: JPEG.decode
   },
   encoders: {
-    [MIME_TYPE$4]: image => jpegJs.encode(image.bitmap, image._quality).data
+    [MIME_TYPE$4]: image => JPEG.encode(image.bitmap, image._quality).data
   },
   class: {
     // The quality to be used when saving JPEG images
@@ -105388,6 +105650,8 @@ ChunkStream$2.prototype._process = function () {
   }
 };
 
+var chunkstreamExports = chunkstream.exports;
+
 var filterParseAsync = {exports: {}};
 
 var filterParse = {exports: {}};
@@ -105679,9 +105943,11 @@ Filter$2.prototype._reverseFilterLine = function (rawData) {
   }
 };
 
+var filterParseExports = filterParse.exports;
+
 let util$4 = require$$0__default["default"];
-let ChunkStream$1 = chunkstream.exports;
-let Filter$1 = filterParse.exports;
+let ChunkStream$1 = chunkstreamExports;
+let Filter$1 = filterParseExports;
 
 let FilterAsync$1 = (filterParseAsync.exports = function (bitmapInfo) {
   ChunkStream$1.call(this);
@@ -105702,6 +105968,8 @@ let FilterAsync$1 = (filterParseAsync.exports = function (bitmapInfo) {
 });
 util$4.inherits(FilterAsync$1, ChunkStream$1);
 
+var filterParseAsyncExports = filterParseAsync.exports;
+
 var parser$1 = {exports: {}};
 
 var constants$6 = {
@@ -105776,8 +106044,10 @@ CrcCalculator$1.crc32 = function (buf) {
   return crc ^ -1;
 };
 
+var crcExports = crc.exports;
+
 let constants$5 = constants$6;
-let CrcCalculator = crc.exports;
+let CrcCalculator = crcExports;
 
 let Parser$3 = (parser$1.exports = function (options, dependencies) {
   this._options = options;
@@ -106065,6 +106335,8 @@ Parser$3.prototype._parseIEND = function (data) {
   }
 };
 
+var parserExports = parser$1.exports;
+
 var bitmapper$2 = {};
 
 let interlaceUtils = interlace;
@@ -106427,9 +106699,9 @@ var formatNormaliser$2 = function (indata, imageData, skipRescale = false) {
 
 let util$3 = require$$0__default["default"];
 let zlib$4 = zlib__default["default"];
-let ChunkStream = chunkstream.exports;
-let FilterAsync = filterParseAsync.exports;
-let Parser$2 = parser$1.exports;
+let ChunkStream = chunkstreamExports;
+let FilterAsync = filterParseAsyncExports;
+let Parser$2 = parserExports;
 let bitmapper$1 = bitmapper$2;
 let formatNormaliser$1 = formatNormaliser$2;
 
@@ -106593,6 +106865,8 @@ ParserAsync.prototype._complete = function (filteredData) {
   this.emit("parsed", normalisedBitmapData);
 };
 
+var parserAsyncExports = parserAsync.exports;
+
 var packerAsync = {exports: {}};
 
 var packer = {exports: {}};
@@ -106925,7 +107199,7 @@ var filterPack = function (pxData, width, height, options, bpp) {
 };
 
 let constants$3 = constants$6;
-let CrcStream = crc.exports;
+let CrcStream = crcExports;
 let bitPacker = bitpacker;
 let filter = filterPack;
 let zlib$3 = zlib__default["default"];
@@ -107052,10 +107326,12 @@ Packer$3.prototype.packIEND = function () {
   return this._packChunk(constants$3.TYPE_IEND, null);
 };
 
+var packerExports = packer.exports;
+
 let util$2 = require$$0__default["default"];
 let Stream$1 = Stream__default["default"];
 let constants$2 = constants$6;
-let Packer$2 = packer.exports;
+let Packer$2 = packerExports;
 
 let PackerAsync = (packerAsync.exports = function (opt) {
   Stream$1.call(this);
@@ -107101,10 +107377,14 @@ PackerAsync.prototype.pack = function (data, width, height, gamma) {
   this._deflate.end(filteredData);
 };
 
+var packerAsyncExports = packerAsync.exports;
+
 var pngSync = {};
 
 var syncInflate = {exports: {}};
 
+syncInflate.exports;
+
 (function (module, exports) {
 
 	let assert = require$$0__default$4["default"].ok;
@@ -107272,9 +107552,11 @@ var syncInflate = {exports: {}};
 	module.exports = exports = inflateSync;
 	exports.Inflate = Inflate;
 	exports.createInflate = createInflate;
-	exports.inflateSync = inflateSync;
+	exports.inflateSync = inflateSync; 
 } (syncInflate, syncInflate.exports));
 
+var syncInflateExports = syncInflate.exports;
+
 var syncReader = {exports: {}};
 
 let SyncReader$2 = (syncReader.exports = function (buffer) {
@@ -107321,10 +107603,12 @@ SyncReader$2.prototype.process = function () {
   }
 };
 
+var syncReaderExports = syncReader.exports;
+
 var filterParseSync = {};
 
-let SyncReader$1 = syncReader.exports;
-let Filter = filterParse.exports;
+let SyncReader$1 = syncReaderExports;
+let Filter = filterParseExports;
 
 filterParseSync.process = function (inBuffer, bitmapInfo) {
   let outBuffers = [];
@@ -107345,13 +107629,13 @@ filterParseSync.process = function (inBuffer, bitmapInfo) {
 
 let hasSyncZlib$1 = true;
 let zlib$2 = zlib__default["default"];
-let inflateSync = syncInflate.exports;
+let inflateSync = syncInflateExports;
 if (!zlib$2.deflateSync) {
   hasSyncZlib$1 = false;
 }
-let SyncReader = syncReader.exports;
+let SyncReader = syncReaderExports;
 let FilterSync = filterParseSync;
-let Parser$1 = parser$1.exports;
+let Parser$1 = parserExports;
 let bitmapper = bitmapper$2;
 let formatNormaliser = formatNormaliser$2;
 
@@ -107460,7 +107744,7 @@ if (!zlib$1.deflateSync) {
   hasSyncZlib = false;
 }
 let constants$1 = constants$6;
-let Packer$1 = packer.exports;
+let Packer$1 = packerExports;
 
 var packerSync = function (metaData, opt) {
   if (!hasSyncZlib) {
@@ -107524,8 +107808,8 @@ var PNG_1;
 
 let util$1 = require$$0__default["default"];
 let Stream = Stream__default["default"];
-let Parser = parserAsync.exports;
-let Packer = packerAsync.exports;
+let Parser = parserAsyncExports;
+let Packer = packerAsyncExports;
 let PNGSync = pngSync;
 
 let PNG = (PNG_1 = function (options) {
@@ -108426,6 +108710,8 @@ var bmpJs = {
   decode: decode$1
 };
 
+var BMP = /*@__PURE__*/getDefaultExportFromCjs(bmpJs);
+
 const MIME_TYPE$2 = "image/bmp";
 const MIME_TYPE_SECOND = "image/x-ms-bmp";
 function toAGBR(image) {
@@ -108454,8 +108740,8 @@ function fromAGBR(bitmap) {
     this.bitmap.data[index + 3] = bitmap.is_with_alpha ? alpha : 0xff;
   }).bitmap;
 }
-const decode = data => fromAGBR(bmpJs.decode(data));
-const encode = image => bmpJs.encode(toAGBR(image)).data;
+const decode = data => fromAGBR(BMP.decode(data));
+const encode = image => BMP.encode(toAGBR(image)).data;
 var bmp = (() => ({
   mime: {
     [MIME_TYPE$2]: ["bmp"]
@@ -108591,8 +108877,8 @@ function requireCommon () {
 		  }
 		};
 
-		exports.setTyped(TYPED_OK);
-} (common));
+		exports.setTyped(TYPED_OK); 
+	} (common));
 	return common;
 }
 
@@ -115396,6 +115682,8 @@ function requirePako () {
 	return pako_1;
 }
 
+UTIF.exports;
+
 (function (module) {
 (function(){
 		var UTIF = {};
@@ -117032,10 +117320,11 @@ function requirePako () {
 		
 		
 		})(UTIF, pako);
-		})();
+		})(); 
 } (UTIF));
 
-var utif = UTIF.exports;
+var UTIFExports = UTIF.exports;
+var utif = /*@__PURE__*/getDefaultExportFromCjs(UTIFExports);
 
 const MIME_TYPE$1 = "image/tiff";
 var tiff = (() => ({
@@ -121409,8 +121698,8 @@ function requireGifutil () {
 		            return resolve();
 		        });
 		    });
-		}
-} (gifutil));
+		} 
+	} (gifutil));
 	return gifutil;
 }
 
@@ -129572,8 +129861,8 @@ function requireSax () {
 		      }
 		    }());
 		  }
-		})(exports);
-} (sax));
+		})(exports); 
+	} (sax));
 	return sax;
 }
 
@@ -130030,8 +130319,8 @@ function requireParser () {
 		    return parser.parseStringPromise(str);
 		  };
 
-		}).call(commonjsGlobal);
-} (parser));
+		}).call(commonjsGlobal); 
+	} (parser));
 	return parser;
 }
 
@@ -133260,6 +133549,8 @@ var loadBmfont = function loadFont(opt, cb) {
   }
 };
 
+var bMFont = /*@__PURE__*/getDefaultExportFromCjs(loadBmfont);
+
 function measureText(font, text) {
   let x = 0;
   for (let i = 0; i < text.length; i++) {
@@ -133271,21 +133562,21 @@ function measureText(font, text) {
   return x;
 }
 function splitLines(font, text, maxWidth) {
-  const words = text.split(" ");
+  const words = text.replace(/[\r\n]+/g, " \n").split(" ");
   const lines = [];
   let currentLine = [];
   let longestLine = 0;
   words.forEach(word => {
     const line = [...currentLine, word].join(" ");
     const length = measureText(font, line);
-    if (length <= maxWidth) {
+    if (length <= maxWidth && !word.includes("\n")) {
       if (length > longestLine) {
         longestLine = length;
       }
       currentLine.push(word);
     } else {
       lines.push(currentLine);
-      currentLine = [word];
+      currentLine = [word.replace("\n", "")];
     }
   });
   lines.push(currentLine);
@@ -133370,7 +133661,7 @@ var print = (() => ({
         cb = cb || function (err, font) {
           if (err) reject(err);else resolve(font);
         };
-        loadBmfont(file, (err, font) => {
+        bMFont(file, (err, font) => {
           const chars = {};
           const kernings = {};
           if (err) {
@@ -134511,6 +134802,8 @@ var Jimp = configure({
 
 var jsQR$1 = {exports: {}};
 
+jsQR$1.exports;
+
 (function (module, exports) {
 	(function webpackUniversalModuleDefinition(root, factory) {
 		module.exports = factory();
@@ -144580,10 +144873,11 @@ var jsQR$1 = {exports: {}};
 
 	/***/ })
 	/******/ ])["default"];
-	});
-} (jsQR$1));
+	}); 
+} (jsQR$1, jsQR$1.exports));
 
-var jsQR = /*@__PURE__*/getDefaultExportFromCjs(jsQR$1.exports);
+var jsQRExports = jsQR$1.exports;
+var jsQR = /*@__PURE__*/getDefaultExportFromCjs(jsQRExports);
 
 const decodeQRCodeFromFile = async (filePath) => {
     let decodedString;
@@ -146142,7 +146436,7 @@ const executeWithThrottledResources = async ({ code: emulatedCode, kind = "both"
 var main$2 = {exports: {}};
 
 var name = "dotenv";
-var version$1 = "16.3.1";
+var version$1 = "16.4.5";
 var description = "Loads environment variables from .env file";
 var main$1 = "lib/main.js";
 var types = "lib/main.d.ts";
@@ -146166,6 +146460,7 @@ var scripts = {
 	"lint-readme": "standard-markdown",
 	pretest: "npm run lint && npm run dts-check",
 	test: "tap tests/*.js --100 -Rspec",
+	"test:coverage": "tap --coverage-report=lcov",
 	prerelease: "npm test",
 	release: "standard-version"
 };
@@ -146173,7 +146468,7 @@ var repository = {
 	type: "git",
 	url: "git://github.com/motdotla/dotenv.git"
 };
-var funding = "https://github.com/motdotla/dotenv?sponsor=1";
+var funding = "https://dotenvx.com";
 var keywords = [
 	"dotenv",
 	"env",
@@ -146276,11 +146571,13 @@ function _parseVault (options) {
   // Parse .env.vault
   const result = DotenvModule.configDotenv({ path: vaultPath });
   if (!result.parsed) {
-    throw new Error(`MISSING_DATA: Cannot parse ${vaultPath} for an unknown reason`)
+    const err = new Error(`MISSING_DATA: Cannot parse ${vaultPath} for an unknown reason`);
+    err.code = 'MISSING_DATA';
+    throw err
   }
 
   // handle scenario for comma separated keys - for use with key rotation
-  // example: DOTENV_KEY="dotenv://:key_1234@dotenv.org/vault/.env.vault?environment=prod,dotenv://:key_7890@dotenv.org/vault/.env.vault?environment=prod"
+  // example: DOTENV_KEY="dotenv://:key_1234@dotenvx.com/vault/.env.vault?environment=prod,dotenv://:key_7890@dotenvx.com/vault/.env.vault?environment=prod"
   const keys = _dotenvKey(options).split(',');
   const length = keys.length;
 
@@ -146344,7 +146641,9 @@ function _instructions (result, dotenvKey) {
     uri = new URL(dotenvKey);
   } catch (error) {
     if (error.code === 'ERR_INVALID_URL') {
-      throw new Error('INVALID_DOTENV_KEY: Wrong format. Must be in valid uri format like dotenv://:key_1234@dotenv.org/vault/.env.vault?environment=development')
+      const err = new Error('INVALID_DOTENV_KEY: Wrong format. Must be in valid uri format like dotenv://:key_1234@dotenvx.com/vault/.env.vault?environment=development');
+      err.code = 'INVALID_DOTENV_KEY';
+      throw err
     }
 
     throw error
@@ -146353,34 +146652,53 @@ function _instructions (result, dotenvKey) {
   // Get decrypt key
   const key = uri.password;
   if (!key) {
-    throw new Error('INVALID_DOTENV_KEY: Missing key part')
+    const err = new Error('INVALID_DOTENV_KEY: Missing key part');
+    err.code = 'INVALID_DOTENV_KEY';
+    throw err
   }
 
   // Get environment
   const environment = uri.searchParams.get('environment');
   if (!environment) {
-    throw new Error('INVALID_DOTENV_KEY: Missing environment part')
+    const err = new Error('INVALID_DOTENV_KEY: Missing environment part');
+    err.code = 'INVALID_DOTENV_KEY';
+    throw err
   }
 
   // Get ciphertext payload
   const environmentKey = `DOTENV_VAULT_${environment.toUpperCase()}`;
   const ciphertext = result.parsed[environmentKey]; // DOTENV_VAULT_PRODUCTION
   if (!ciphertext) {
-    throw new Error(`NOT_FOUND_DOTENV_ENVIRONMENT: Cannot locate environment ${environmentKey} in your .env.vault file.`)
+    const err = new Error(`NOT_FOUND_DOTENV_ENVIRONMENT: Cannot locate environment ${environmentKey} in your .env.vault file.`);
+    err.code = 'NOT_FOUND_DOTENV_ENVIRONMENT';
+    throw err
   }
 
   return { ciphertext, key }
 }
 
 function _vaultPath (options) {
-  let dotenvPath = path.resolve(process.cwd(), '.env');
+  let possibleVaultPath = null;
 
   if (options && options.path && options.path.length > 0) {
-    dotenvPath = options.path;
+    if (Array.isArray(options.path)) {
+      for (const filepath of options.path) {
+        if (fs.existsSync(filepath)) {
+          possibleVaultPath = filepath.endsWith('.vault') ? filepath : `${filepath}.vault`;
+        }
+      }
+    } else {
+      possibleVaultPath = options.path.endsWith('.vault') ? options.path : `${options.path}.vault`;
+    }
+  } else {
+    possibleVaultPath = path.resolve(process.cwd(), '.env.vault');
+  }
+
+  if (fs.existsSync(possibleVaultPath)) {
+    return possibleVaultPath
   }
 
-  // Locate .env.vault
-  return dotenvPath.endsWith('.vault') ? dotenvPath : `${dotenvPath}.vault`
+  return null
 }
 
 function _resolveHome (envPath) {
@@ -146403,51 +146721,73 @@ function _configVault (options) {
 }
 
 function configDotenv (options) {
-  let dotenvPath = path.resolve(process.cwd(), '.env');
+  const dotenvPath = path.resolve(process.cwd(), '.env');
   let encoding = 'utf8';
   const debug = Boolean(options && options.debug);
 
-  if (options) {
-    if (options.path != null) {
-      dotenvPath = _resolveHome(options.path);
+  if (options && options.encoding) {
+    encoding = options.encoding;
+  } else {
+    if (debug) {
+      _debug('No encoding is specified. UTF-8 is used by default');
     }
-    if (options.encoding != null) {
-      encoding = options.encoding;
+  }
+
+  let optionPaths = [dotenvPath]; // default, look for .env
+  if (options && options.path) {
+    if (!Array.isArray(options.path)) {
+      optionPaths = [_resolveHome(options.path)];
+    } else {
+      optionPaths = []; // reset default
+      for (const filepath of options.path) {
+        optionPaths.push(_resolveHome(filepath));
+      }
     }
   }
 
-  try {
-    // Specifying an encoding returns a string instead of a buffer
-    const parsed = DotenvModule.parse(fs.readFileSync(dotenvPath, { encoding }));
+  // Build the parsed data in a temporary object (because we need to return it).  Once we have the final
+  // parsed data, we will combine it with process.env (or options.processEnv if provided).
+  let lastError;
+  const parsedAll = {};
+  for (const path of optionPaths) {
+    try {
+      // Specifying an encoding returns a string instead of a buffer
+      const parsed = DotenvModule.parse(fs.readFileSync(path, { encoding }));
 
-    let processEnv = process.env;
-    if (options && options.processEnv != null) {
-      processEnv = options.processEnv;
+      DotenvModule.populate(parsedAll, parsed, options);
+    } catch (e) {
+      if (debug) {
+        _debug(`Failed to load ${path} ${e.message}`);
+      }
+      lastError = e;
     }
+  }
 
-    DotenvModule.populate(processEnv, parsed, options);
+  let processEnv = process.env;
+  if (options && options.processEnv != null) {
+    processEnv = options.processEnv;
+  }
 
-    return { parsed }
-  } catch (e) {
-    if (debug) {
-      _debug(`Failed to load ${dotenvPath} ${e.message}`);
-    }
+  DotenvModule.populate(processEnv, parsedAll, options);
 
-    return { error: e }
+  if (lastError) {
+    return { parsed: parsedAll, error: lastError }
+  } else {
+    return { parsed: parsedAll }
   }
 }
 
 // Populates process.env from .env file
 function config (options) {
-  const vaultPath = _vaultPath(options);
-
   // fallback to original dotenv if DOTENV_KEY is not set
   if (_dotenvKey(options).length === 0) {
     return DotenvModule.configDotenv(options)
   }
 
+  const vaultPath = _vaultPath(options);
+
   // dotenvKey exists but .env.vault file does not exist
-  if (!fs.existsSync(vaultPath)) {
+  if (!vaultPath) {
     _warn(`You set DOTENV_KEY but you are missing a .env.vault file at ${vaultPath}. Did you forget to build it?`);
 
     return DotenvModule.configDotenv(options)
@@ -146460,9 +146800,9 @@ function decrypt (encrypted, keyStr) {
   const key = Buffer.from(keyStr.slice(-64), 'hex');
   let ciphertext = Buffer.from(encrypted, 'base64');
 
-  const nonce = ciphertext.slice(0, 12);
-  const authTag = ciphertext.slice(-16);
-  ciphertext = ciphertext.slice(12, -16);
+  const nonce = ciphertext.subarray(0, 12);
+  const authTag = ciphertext.subarray(-16);
+  ciphertext = ciphertext.subarray(12, -16);
 
   try {
     const aesgcm = crypto.createDecipheriv('aes-256-gcm', key, nonce);
@@ -146474,14 +146814,14 @@ function decrypt (encrypted, keyStr) {
     const decryptionFailed = error.message === 'Unsupported state or unable to authenticate data';
 
     if (isRange || invalidKeyLength) {
-      const msg = 'INVALID_DOTENV_KEY: It must be 64 characters long (or more)';
-      throw new Error(msg)
+      const err = new Error('INVALID_DOTENV_KEY: It must be 64 characters long (or more)');
+      err.code = 'INVALID_DOTENV_KEY';
+      throw err
     } else if (decryptionFailed) {
-      const msg = 'DECRYPTION_FAILED: Please check your DOTENV_KEY';
-      throw new Error(msg)
+      const err = new Error('DECRYPTION_FAILED: Please check your DOTENV_KEY');
+      err.code = 'DECRYPTION_FAILED';
+      throw err
     } else {
-      console.error('Error: ', error.code);
-      console.error('Error: ', error.message);
       throw error
     }
   }
@@ -146493,7 +146833,9 @@ function populate (processEnv, parsed, options = {}) {
   const override = Boolean(options && options.override);
 
   if (typeof parsed !== 'object') {
-    throw new Error('OBJECT_REQUIRED: Please check the processEnv argument being passed to populate')
+    const err = new Error('OBJECT_REQUIRED: Please check the processEnv argument being passed to populate');
+    err.code = 'OBJECT_REQUIRED';
+    throw err
   }
 
   // Set process.env
@@ -146536,82 +146878,94 @@ main$2.exports.populate = DotenvModule.populate;
 
 main$2.exports = DotenvModule;
 
+var mainExports = main$2.exports;
+var dotenv = /*@__PURE__*/getDefaultExportFromCjs(mainExports);
+
 var main = {};
 
-// like String.prototype.search but returns the last index
-function _searchLast (str, rgx) {
-  const matches = Array.from(str.matchAll(rgx));
-  return matches.length > 0 ? matches.slice(-1)[0].index : -1
-}
+// * /
+// *   (\\)?            # is it escaped with a backslash?
+// *   (\$)             # literal $
+// *   (?!\()           # shouldnt be followed by parenthesis
+// *   (\{?)            # first brace wrap opening
+// *   ([\w.]+)         # key
+// *   (?::-((?:\$\{(?:\$\{(?:\$\{[^}]*\}|[^}])*}|[^}])*}|[^}])+))? # optional default nested 3 times
+// *   (\}?)            # last brace warp closing
+// * /xi
 
-function _interpolate (envValue, environment, config) {
-  // find the last unescaped dollar sign in the
-  // value so that we can evaluate it
-  const lastUnescapedDollarSignIndex = _searchLast(envValue, /(?!(?<=\\))\$/g);
+const DOTENV_SUBSTITUTION_REGEX = /(\\)?(\$)(?!\()(\{?)([\w.]+)(?::?-((?:\$\{(?:\$\{(?:\$\{[^}]*\}|[^}])*}|[^}])*}|[^}])+))?(\}?)/gi;
 
-  // If we couldn't match any unescaped dollar sign
-  // let's return the string as is
-  if (lastUnescapedDollarSignIndex === -1) return envValue
+function _resolveEscapeSequences (value) {
+  return value.replace(/\\\$/g, '$')
+}
 
-  // This is the right-most group of variables in the string
-  const rightMostGroup = envValue.slice(lastUnescapedDollarSignIndex);
+function interpolate (value, processEnv, parsed) {
+  return value.replace(DOTENV_SUBSTITUTION_REGEX, (match, escaped, dollarSign, openBrace, key, defaultValue, closeBrace) => {
+    if (escaped === '\\') {
+      return match.slice(1)
+    } else {
+      if (processEnv[key]) {
+        if (processEnv[key] === parsed[key]) {
+          return processEnv[key]
+        } else {
+          // scenario: PASSWORD_EXPAND_NESTED=${PASSWORD_EXPAND}
+          return interpolate(processEnv[key], processEnv, parsed)
+        }
+      }
 
-  /**
-   * This finds the inner most variable/group divided
-   * by variable name and default value (if present)
-   * (
-   *   (?!(?<=\\))\$        // only match dollar signs that are not escaped
-   *   {?                   // optional opening curly brace
-   *     ([\w]+)            // match the variable name
-   *     (?::-([^}\\]*))?   // match an optional default value
-   *   }?                   // optional closing curly brace
-   * )
-   */
-  const matchGroup = /((?!(?<=\\))\${?([\w]+)(?::-([^}\\]*))?}?)/;
-  const match = rightMostGroup.match(matchGroup);
-
-  if (match != null) {
-    const [, group, variableName, defaultValue] = match;
-
-    return _interpolate(
-      envValue.replace(
-        group,
-        environment[variableName] ||
-          defaultValue ||
-          config.parsed[variableName] ||
-          ''
-      ),
-      environment,
-      config
-    )
-  }
+      if (parsed[key]) {
+        // avoid recursion from EXPAND_SELF=$EXPAND_SELF
+        if (parsed[key] === value) {
+          return parsed[key]
+        } else {
+          return interpolate(parsed[key], processEnv, parsed)
+        }
+      }
 
-  return envValue
-}
+      if (defaultValue) {
+        if (defaultValue.startsWith('$')) {
+          return interpolate(defaultValue, processEnv, parsed)
+        } else {
+          return defaultValue
+        }
+      }
 
-function _resolveEscapeSequences (value) {
-  return value.replace(/\\\$/g, '$')
+      return ''
+    }
+  })
 }
 
-function expand (config) {
-  // if ignoring process.env, use a blank object
-  const environment = config.ignoreProcessEnv ? {} : process.env;
+function expand (options) {
+  let processEnv = process.env;
+  if (options && options.processEnv != null) {
+    processEnv = options.processEnv;
+  }
+
+  for (const key in options.parsed) {
+    let value = options.parsed[key];
 
-  for (const configKey in config.parsed) {
-    const value = Object.prototype.hasOwnProperty.call(environment, configKey)
-      ? environment[configKey]
-      : config.parsed[configKey];
+    const inProcessEnv = Object.prototype.hasOwnProperty.call(processEnv, key);
+    if (inProcessEnv) {
+      if (processEnv[key] === options.parsed[key]) {
+        // assume was set to processEnv from the .env file if the values match and therefore interpolate
+        value = interpolate(value, processEnv, options.parsed);
+      } else {
+        // do not interpolate - assume processEnv had the intended value even if containing a $.
+        value = processEnv[key];
+      }
+    } else {
+      // not inProcessEnv so assume interpolation for this .env key
+      value = interpolate(value, processEnv, options.parsed);
+    }
 
-    config.parsed[configKey] = _resolveEscapeSequences(
-      _interpolate(value, environment, config)
-    );
+    options.parsed[key] = _resolveEscapeSequences(value);
   }
 
-  for (const processKey in config.parsed) {
-    environment[processKey] = config.parsed[processKey];
+  for (const processKey in options.parsed) {
+    processEnv[processKey] = options.parsed[processKey];
   }
 
-  return config
+  return options
 }
 
 main.expand = expand;
@@ -146619,12 +146973,12 @@ main.expand = expand;
 // @ts-check
 var _a, _b;
 process.env.TEST_ENV = (_a = process.env.TEST_ENV) !== null && _a !== void 0 ? _a : ENVIRONMENT.development;
-const env = main$2.exports.config({
+const env = dotenv.config({
     path: `./e2e/config/.env.${process.env.TEST_ENV}`,
 });
 main.expand(env);
 if (fs__namespace.existsSync("./e2e/config/.env.local")) {
-    const localEnv = main$2.exports.config({
+    const localEnv = dotenv.config({
         path: "./e2e/config/.env.local",
     });
     main.expand(localEnv);
@@ -146687,6 +147041,7 @@ exports.COMMON_SELECTORS = COMMON_SELECTORS;
 exports.CREDENTIALS = CREDENTIALS;
 exports.CustomCommands = CustomCommands;
 exports.ENVIRONMENT = ENVIRONMENT;
+exports.EmbedBase = EmbedBase;
 exports.GLOBAL_TRANSLATIONS_PATTERN = GLOBAL_TRANSLATIONS_PATTERN;
 exports.HELP_CENTER_SELECTORS = HELP_CENTER_SELECTORS;
 exports.HelpAndProfilePage = HelpAndProfilePage;
@@ -146748,6 +147103,7 @@ exports.skipTest = skipTest;
 exports.squish = squish;
 exports.stealthTest = stealth;
 exports.tableUtils = tableUtils;
+exports.toCamelCase = toCamelCase;
 exports.updateCredentials = updateCredentials;
 exports.writeDataToFile = writeDataToFile;
 //# sourceMappingURL=index.cjs.js.map