@bigbinary/neeto-playwright-commons 1.13.15 → 1.14.1

package/index.cjs.js

@@ -472,6 +472,7 @@ const NEETO_FILTERS_SELECTORS = {
     paneModalCrossIcon: "neeto-filters-close-button",
     searchTermBlock: "neeto-filters-search-term-block",
     neetoFiltersFilter: (filterName) => `neeto-filters-${hyphenize(filterName)}-filter`,
+    filtersTermBlock: (filterType = "search-term") => `neeto-filters-${hyphenize(filterType)}-block`,
 };
 
 const HELP_CENTER_SELECTORS = {
@@ -4043,6 +4044,21 @@ class CustomCommands {
             await customPageContext.mouse.move(0, 0);
             await test$1.expect(tooltipBox).toBeHidden();
         };
+        this.verifySearchTermBlock = async (searchTerm) => {
+            const filtersSearchTermBlock = this.page.getByTestId(NEETO_FILTERS_SELECTORS.filtersTermBlock());
+            if (searchTerm) {
+                const textContent = await (filtersSearchTermBlock === null || filtersSearchTermBlock === void 0 ? void 0 : filtersSearchTermBlock.textContent());
+                (textContent === null || textContent === void 0 ? void 0 : textContent.includes(".."))
+                    ? await this.verifyTooltip({
+                        triggerElement: filtersSearchTermBlock,
+                        content: searchTerm,
+                    })
+                    : await test$1.expect(filtersSearchTermBlock).toContainText(searchTerm);
+            }
+            else {
+                await test$1.expect(filtersSearchTermBlock).toBeHidden();
+            }
+        };
         this.page = page;
         this.responses = [];
         this.request = request;
@@ -12127,7 +12143,7 @@ class MailerUtils {
             const { ids } = await this.queryEmail(messageSearchCriteria, listMessagesFilterCriteria);
             return this.getEmails(ids);
         };
-        this.findMessage = async (messageSearchCriteria = {}, { timeout = 10000, receivedAfter = dateTimeOneHourAgo(), } = {}, shouldThrowErrorOnTimeout = true) => {
+        this.findMessage = async (messageSearchCriteria = {}, { timeout = 10000, receivedAfter = dateTimeOneHourAgo(), expectedEmailCount = 1, } = {}, shouldThrowErrorOnTimeout = true) => {
             const ids = (await this.neetoPlaywrightUtilities.executeRecursively({
                 callback: async () => {
                     const { ids } = await this.queryEmail(messageSearchCriteria, {
@@ -12139,7 +12155,7 @@ class MailerUtils {
                     const { total } = await this.queryEmail(messageSearchCriteria, {
                         receivedAfter,
                     });
-                    return total > 0;
+                    return total >= expectedEmailCount;
                 },
                 timeout,
             }));
@@ -12150,8 +12166,11 @@ class MailerUtils {
             }
             return (await this.getEmails(ids))[0];
         };
-        this.findOtpFromEmail = async ({ email, subjectSubstring = OTP_EMAIL_PATTERN, timeout = 2 * 60 * 1000, receivedAfter = new Date(), }) => {
-            const { html: { codes }, } = await this.findMessage({ to: email, subject: subjectSubstring }, { timeout, receivedAfter });
+        this.findOtpFromEmail = async ({ email, subjectSubstring = OTP_EMAIL_PATTERN, timeout = 2 * 60 * 1000, receivedAfter = new Date(), expectedEmailCount = 1, }) => {
+            if (!this.accountId) {
+                await this.fastmailApi.authorizeAndSetAccountId();
+            }
+            const { html: { codes }, } = await this.findMessage({ to: email, subject: subjectSubstring }, { timeout, receivedAfter, expectedEmailCount });
             return codes === null || codes === void 0 ? void 0 : codes[0];
         };
         this.generateRandomEmail = () => faker.faker.internet.email({
@@ -24269,6 +24288,7 @@ const LIST_MODIFIER_TAGS = {
 
 class EditorPage {
     constructor(page, neetoPlaywrightUtilities, editorWrapper) {
+        this.wordsUsedInEditor = [];
         this.linkUrl = faker.faker.internet.url();
         this.filePath = "../../../e2e/assets/images/BigBinary.png";
         this.imageUrl = "https://picsum.photos/200/300";
@@ -24291,48 +24311,88 @@ class EditorPage {
         };
         this.moreMenuOptions = async () => {
             await this.moreMenuSelector.click();
-            const moreMenuButtons = await this.page
-                .getByTestId(COMMON_SELECTORS.dropdownContainer)
-                .getByRole("button")
-                .all();
-            return Promise.all(moreMenuButtons.map(async (button) => {
+            const dropdownContainer = this.page.getByTestId(COMMON_SELECTORS.dropdownContainer);
+            const moreMenuButtons = await dropdownContainer.getByRole("button").all();
+            const moreMenuButtonLocators = Promise.all(moreMenuButtons.map(async (button) => {
                 const dataCy = await button.getAttribute("data-cy");
                 return this.cleanString(dataCy);
             }));
+            await this.moreMenuSelector.click();
+            // eslint-disable-next-line playwright/no-standalone-expect
+            await test$1.expect(dropdownContainer).toBeHidden();
+            return moreMenuButtonLocators;
         };
         this.verifyFontSize = async () => {
+            const fontsAndTexts = [];
             const fontSizeDropdown = this.editorWrapper.getByTestId(NEETO_EDITOR_SELECTORS.fontSize);
-            await fontSizeDropdown.click();
             const fontSize = Object.keys(FONT_SIZE_SELECTORS);
             for (const font of fontSize) {
                 const fontKey = font;
+                const randomText = await this.fillRandomText();
+                await fontSizeDropdown.click();
                 await this.editorWrapper
                     .getByTestId(FONT_SIZE_SELECTORS[fontKey])
                     .click();
-                await test$1.expect(this.contentField.getByRole("heading", { level: Number(font.slice(1)) })).toBeVisible();
-                await fontSizeDropdown.click();
+                await test$1.expect(this.contentField.getByRole("heading", {
+                    level: Number(font.slice(1)),
+                    name: randomText,
+                })).toBeVisible();
+                fontsAndTexts.push({
+                    key: fontKey,
+                    value: randomText,
+                });
             }
+            return fontsAndTexts;
         };
-        this.verifyTextModifiers = async (modifier) => {
+        this.verifyTextModifiers = async (modifier, isButtonInMoreMenu) => {
             const modifierKey = modifier;
             const textModifierRole = TEXT_MODIFIER_ROLES[modifierKey];
+            const randomText = await this.fillRandomText();
             const textModifierSelector = this.editorWrapper.getByTestId(TEXT_MODIFIER_SELECTORS[modifierKey]);
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await textModifierSelector.click();
-            await test$1.expect(this.contentField.getByRole(textModifierRole)).toBeVisible();
+            await test$1.expect(this.contentField
+                .getByRole(textModifierRole)
+                .filter({ hasText: randomText })).toBeVisible();
+            await this.moveCursorAtBottom();
+            await this.page.keyboard.press("Enter");
+            if (modifierKey !== "codeBlock") {
+                isButtonInMoreMenu && (await this.moreMenuSelector.click());
+                await textModifierSelector.click();
+            }
+            return [{ key: modifierKey, value: randomText }];
         };
-        this.verifyTextDeskModifier = async (modifier) => {
+        this.verifyTextDeskModifier = async (modifier, isButtonInMoreMenu) => {
             const modifierKey = modifier;
             const textModifierSelector = this.editorWrapper.getByTestId(NEETO_TEXT_MODIFIER_SELECTORS[modifierKey]);
+            const randomText = await this.fillRandomText();
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await textModifierSelector.click();
-            await test$1.expect(this.contentField.locator(TEXT_MODIFIER_TAGS[modifierKey])).toBeVisible();
+            await test$1.expect(this.contentField
+                .locator(TEXT_MODIFIER_TAGS[modifierKey])
+                .filter({ hasText: randomText })).toBeVisible();
+            await this.moveCursorAtBottom();
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
+            await textModifierSelector.click();
+            return [{ key: modifierKey, value: randomText }];
         };
-        this.verifyListModifiers = async (modifier) => {
+        this.verifyListModifiers = async (modifier, isButtonInMoreMenu) => {
             const modifierKey = modifier;
             const listModifierSelector = this.editorWrapper.getByTestId(LIST_MODIFIER_SELECTORS[modifierKey]);
+            const randomText = await this.fillRandomText();
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
+            await listModifierSelector.click();
+            await test$1.expect(this.contentField
+                .locator(LIST_MODIFIER_TAGS[modifierKey])
+                .filter({ hasText: randomText })).toBeVisible();
+            await this.moveCursorAtBottom();
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await listModifierSelector.click();
-            await test$1.expect(this.contentField.locator(LIST_MODIFIER_TAGS[modifierKey])).toBeVisible();
+            return [{ key: modifierKey, value: randomText }];
         };
-        this.verifyEditorLinkButton = async (linkUrl) => {
+        this.verifyEditorLinkButton = async (linkUrl, isButtonInMoreMenu) => {
+            const randomText = await this.fillRandomText();
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await this.editorLinkButton.click();
             await this.page
                 .getByTestId(NEETO_EDITOR_SELECTORS.addLinkUrlInput)
@@ -24342,10 +24402,12 @@ class EditorPage {
                 .click();
             const linkRole = DESCRIPTION_EDITOR_TEXTS.link;
             await test$1.expect(this.contentField.getByRole(linkRole)).toBeVisible();
-            await this.page.getByTestId(NEETO_EDITOR_SELECTORS.unlinkButton).click();
+            await this.moveCursorAtBottom();
+            return [{ key: "link", value: randomText }];
         };
-        this.verifyEditorAttachmentsButton = async (filePath) => {
+        this.verifyEditorAttachmentsButton = async (filePath, isButtonInMoreMenu, shouldRemoveAttachment = false) => {
             const fileUploaderPromise = this.page.waitForEvent("filechooser");
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await this.editorAttachmentsButton.click();
             const fileUploader = await fileUploaderPromise;
             const imagePath = Path__namespace.join(__dirname, filePath);
@@ -24354,18 +24416,22 @@ class EditorPage {
                 responseUrl: ROUTES.attachment,
             });
             await test$1.expect(this.attachmentPreview).toBeVisible();
-            await this.attachmentPreview
-                .getByTestId(COMMON_SELECTORS.dropdownIcon)
-                .click();
-            await this.page
-                .getByTestId(NEETO_EDITOR_SELECTORS.attachmentPreviewDeleteButton)
-                .click();
-            await this.page
-                .getByTestId(COMMON_SELECTORS.alertModalSubmitButton)
-                .click();
-            await test$1.expect(this.attachmentPreview).toBeHidden({ timeout: 10000 });
+            if (shouldRemoveAttachment) {
+                await this.attachmentPreview
+                    .getByTestId(COMMON_SELECTORS.dropdownIcon)
+                    .click();
+                await this.page
+                    .getByTestId(NEETO_EDITOR_SELECTORS.attachmentPreviewDeleteButton)
+                    .click();
+                await this.page
+                    .getByTestId(COMMON_SELECTORS.alertModalSubmitButton)
+                    .click();
+                await test$1.expect(this.attachmentPreview).toBeHidden({ timeout: 10000 });
+            }
+            return [{ key: "attachments", value: filePath }];
         };
-        this.verifyImageUploadOption = async ({ imageUrl, filePath, }) => {
+        this.verifyImageUploadOption = async ({ imageUrl, filePath, isButtonInMoreMenu, shouldRemoveImage = false, }) => {
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await this.imageUploadOption.click();
             const fileUploaderPromise = this.page.waitForEvent("filechooser");
             await this.page
@@ -24380,8 +24446,7 @@ class EditorPage {
             await test$1.expect(this.imageWrapper).toBeHidden({
                 timeout: 15000,
             });
-            (await this.imageUploadOption.isHidden()) &&
-                (await this.moreMenuSelector.click());
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await this.imageUploadOption.click();
             await this.page
                 .getByTestId(NEETO_EDITOR_SELECTORS.imageUploadLinkButton)
@@ -24393,13 +24458,19 @@ class EditorPage {
                 .getByTestId(NEETO_EDITOR_SELECTORS.imageUploadLinkSubmitButton)
                 .click();
             await test$1.expect(this.imageWrapper).toBeVisible({ timeout: 15000 });
-            await this.imageWrapper.getByTestId(COMMON_SELECTORS.dropdownIcon).click();
-            await this.imageUploadDeleteButton.click();
-            await test$1.expect(this.imageWrapper).toBeHidden({
-                timeout: 15000,
-            });
+            if (shouldRemoveImage) {
+                await this.imageWrapper
+                    .getByTestId(COMMON_SELECTORS.dropdownIcon)
+                    .click();
+                await this.imageUploadDeleteButton.click();
+                await test$1.expect(this.imageWrapper).toBeHidden({
+                    timeout: 15000,
+                });
+            }
+            return [{ key: "image-upload", value: imageUrl }];
         };
-        this.verifyCannedResponseOption = async (cannedResponseSuccessMessage) => {
+        this.verifyCannedResponseOption = async (isButtonInMoreMenu, cannedResponseSuccessMessage) => {
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await this.cannedResponseOption.click();
             await test$1.expect(this.page.getByTestId(COMMON_SELECTORS.paneHeader)).toContainText(DESCRIPTION_EDITOR_TEXTS.cannedResponseHeader);
             await this.page
@@ -24412,23 +24483,32 @@ class EditorPage {
             await this.neetoPlaywrightUtilities.verifyToast({
                 message: cannedResponseSuccessMessage,
             });
+            return [
+                { key: "canned-responses", value: cannedResponseSuccessMessage },
+            ];
         };
-        this.verifyVideoEmbedOption = async (videoUrl) => {
+        this.verifyVideoEmbedOption = async (videoUrl, isButtonInMoreMenu, shouldRemoveVideo = false) => {
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await this.videoEmbedOption.click();
             await this.videoEmbedInput.fill(videoUrl);
             await this.page
                 .getByTestId(NEETO_EDITOR_SELECTORS.videoEmbedSubmit)
                 .click();
             await test$1.expect(this.videoWrapperSelector).toBeVisible({ timeout: 15000 });
-            await this.videoWrapperSelector
-                .getByTestId(COMMON_SELECTORS.dropdownIcon)
-                .click();
-            await this.imageUploadDeleteButton.click();
-            await test$1.expect(this.videoWrapperSelector).toBeHidden({
-                timeout: 15000,
-            });
+            if (shouldRemoveVideo) {
+                await this.videoWrapperSelector
+                    .getByTestId(COMMON_SELECTORS.dropdownIcon)
+                    .click();
+                await this.imageUploadDeleteButton.click();
+                await test$1.expect(this.videoWrapperSelector).toBeHidden({
+                    timeout: 15000,
+                });
+            }
+            return [{ key: "video-embed", value: videoUrl }];
         };
-        this.verifyEmojiSelector = async () => {
+        this.verifyEmojiSelector = async (isButtonInMoreMenu) => {
+            const emoji = "👍";
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
             await this.emojiSelector.click();
             const emojiContainer = this.page.getByTestId(NEETO_EDITOR_SELECTORS.emojiContainer);
             await test$1.expect(emojiContainer).toBeVisible({
@@ -24438,8 +24518,9 @@ class EditorPage {
                 .getByPlaceholder(DESCRIPTION_EDITOR_TEXTS.search)
                 .fill(EMOJI_LABEL);
             await this.page.keyboard.press("Enter");
-            await test$1.expect(this.contentField).toContainText("👍");
+            await test$1.expect(this.contentField).toContainText(emoji);
             await this.page.keyboard.press("Escape");
+            return [{ key: "emoji", value: emoji }];
         };
         this.verifyDynamicVariables = async (dynamicVariables) => {
             for (const { key, value } of dynamicVariables) {
@@ -24452,62 +24533,72 @@ class EditorPage {
             }
         };
         this.buttonsAndVerifications = {
-            "font-size": this.verifyFontSize,
-            emoji: this.verifyEmojiSelector,
-            bold: () => this.verifyTextModifiers("bold"),
-            italic: () => this.verifyTextModifiers("italic"),
-            code: () => this.verifyTextModifiers("code"),
-            blockquote: () => this.verifyTextModifiers("blockquote"),
-            codeBlock: () => this.verifyTextModifiers("codeBlock"),
-            underline: () => this.verifyTextDeskModifier("underline"),
-            strike: () => this.verifyTextDeskModifier("strike"),
-            highlight: () => this.verifyTextDeskModifier("highlight"),
-            bulletList: () => this.verifyListModifiers("bulletList"),
-            orderedList: () => this.verifyListModifiers("orderedList"),
-            link: () => this.verifyEditorLinkButton(this.linkUrl),
-            attachments: () => this.verifyEditorAttachmentsButton(this.filePath),
-            "image-upload": () => this.verifyImageUploadOption({
+            "font-size": () => this.verifyFontSize(),
+            emoji: isButtonInMoreMenu => this.verifyEmojiSelector(isButtonInMoreMenu),
+            bold: isButtonInMoreMenu => this.verifyTextModifiers("bold", isButtonInMoreMenu),
+            italic: isButtonInMoreMenu => this.verifyTextModifiers("italic", isButtonInMoreMenu),
+            code: isButtonInMoreMenu => this.verifyTextModifiers("code", isButtonInMoreMenu),
+            blockquote: isButtonInMoreMenu => this.verifyTextModifiers("blockquote", isButtonInMoreMenu),
+            codeBlock: isButtonInMoreMenu => this.verifyTextModifiers("codeBlock", isButtonInMoreMenu),
+            underline: isButtonInMoreMenu => this.verifyTextDeskModifier("underline", isButtonInMoreMenu),
+            strike: isButtonInMoreMenu => this.verifyTextDeskModifier("strike", isButtonInMoreMenu),
+            highlight: isButtonInMoreMenu => this.verifyTextDeskModifier("highlight", isButtonInMoreMenu),
+            bulletList: isButtonInMoreMenu => this.verifyListModifiers("bulletList", isButtonInMoreMenu),
+            orderedList: isButtonInMoreMenu => this.verifyListModifiers("orderedList", isButtonInMoreMenu),
+            link: isButtonInMoreMenu => this.verifyEditorLinkButton(this.linkUrl, isButtonInMoreMenu),
+            attachments: isButtonInMoreMenu => this.verifyEditorAttachmentsButton(this.filePath, isButtonInMoreMenu),
+            "image-upload": isButtonInMoreMenu => this.verifyImageUploadOption({
                 imageUrl: this.imageUrl,
                 filePath: this.filePath,
+                isButtonInMoreMenu,
             }),
-            "canned-responses": this.verifyCannedResponseOption,
-            "video-embed": () => this.verifyVideoEmbedOption(this.videoUrl),
+            "canned-responses": isButtonInMoreMenu => this.verifyCannedResponseOption(isButtonInMoreMenu),
+            "video-embed": isButtonInMoreMenu => this.verifyVideoEmbedOption(this.videoUrl, isButtonInMoreMenu),
         };
-        this.verifyDescriptionEditor = async ({ text, dynamicVariables, linkUrl, filePath, imageUrl, videoUrl, cannedResponseSuccessMessage, }) => {
+        this.verifyDescriptionEditor = async ({ dynamicVariables, linkUrl, filePath, imageUrl, videoUrl, cannedResponseSuccessMessage, } = {}) => {
             const fixedMenuButtons = await this.fixedMenuOptions();
             let moreMenuButtons = [];
             (await this.moreMenuSelector.isVisible()) &&
                 (moreMenuButtons = await this.moreMenuOptions());
-            const needToSkipDisabling = [
-                "link",
-                "attachments",
-                "image-upload",
-                "canned-responses",
-                "video-embed",
-                "emoji",
-            ];
             this.linkUrl = linkUrl || this.linkUrl;
             this.filePath = filePath || this.filePath;
             this.imageUrl = imageUrl || this.imageUrl;
             this.videoUrl = videoUrl || this.videoUrl;
             this.cannedResponseSuccessMessage = cannedResponseSuccessMessage;
-            await this.contentField.fill(text);
-            for (const button of fixedMenuButtons) {
-                await this.contentField.click({ clickCount: 3 });
-                await this.buttonsAndVerifications[button]();
-                !needToSkipDisabling.includes(button) &&
-                    (await this.editorWrapper.getByTestId(optionSelector(button)).click());
-            }
-            for (const button of moreMenuButtons) {
-                await this.contentField.click({ clickCount: 3 });
-                await this.moreMenuSelector.click();
-                await this.buttonsAndVerifications[button]();
-                if (!needToSkipDisabling.includes(button)) {
-                    await this.moreMenuSelector.click();
-                    await this.editorWrapper.getByTestId(optionSelector(button)).click();
-                }
+            const keysAndValues = [];
+            for (const button of [...fixedMenuButtons, ...moreMenuButtons]) {
+                const isMoreMenuButton = moreMenuButtons.includes(button);
+                const keyValuesForButton = await this.buttonsAndVerifications[button](isMoreMenuButton);
+                keysAndValues.push(...keyValuesForButton);
             }
             dynamicVariables && (await this.verifyDynamicVariables(dynamicVariables));
+            return keysAndValues;
+        };
+        this.moveCursorAtBottom = async () => {
+            const platform = require$$0$2.platform();
+            if (platform === "darwin") {
+                await this.page.keyboard.press("Meta+ArrowRight");
+                await this.page.keyboard.press("Meta+ArrowDown");
+            }
+            else {
+                await this.page.keyboard.press("End");
+                await this.page.keyboard.press("PageDown");
+            }
+            await this.page.keyboard.press("Enter");
+        };
+        this.fillRandomText = async () => {
+            let randomText;
+            do {
+                randomText = faker.faker.lorem.word(10);
+            } while (this.wordsUsedInEditor.includes(randomText));
+            await this.contentField.click();
+            await this.moveCursorAtBottom();
+            await this.page.keyboard.type(randomText);
+            this.wordsUsedInEditor.push(randomText);
+            const randomTextLocator = this.contentField.getByText(randomText);
+            await randomTextLocator.scrollIntoViewIfNeeded();
+            await randomTextLocator.click({ clickCount: 3 });
+            return randomText;
         };
         this.page = page;
         this.neetoPlaywrightUtilities = neetoPlaywrightUtilities;