@bigbinary/neeto-playwright-commons 1.22.38 → 1.22.39

package/index.cjs.js

@@ -3754,6 +3754,7 @@ const NEETO_EDITOR_SELECTORS = {
     videoEmbedSubmit: "neeto-editor-embed-cancel",
     videoWrapper: "neeto-editor-video-wrapper",
     paragraphOption: fixedMenuSelector("font-size-option-body2"),
+    calloutOption: fixedMenuSelector("callout-option"),
     attachmentPreview: "ne-attachments-wrapper",
     imageUploadLinkButton: "neeto-editor-media-uploader-link-tab",
     errorText: "neeto-editor-error-text",
@@ -3767,6 +3768,11 @@ const NEETO_EDITOR_SELECTORS = {
     videoUploadOption: optionSelector("video-upload"),
     todoListOption: optionSelector("todoList"),
     editorMenuWrapper: "neeto-editor-fixed-menu-wrapper",
+    dataEmojiType: (type) => `[data-emoji="${type}"]`,
+    //Use data-cy once https://github.com/neetozone/neeto-editor/issues/1651 is resolved
+    calloutContent: ".callout-content",
+    //Use data-cy once https://github.com/neetozone/neeto-editor/issues/1648 is resolved
+    calloutTypeOption: ".neeto-editor-callout-dropdown__type-option",
     editorMediaUploaderTab: "neeto-editor-media-uploader-local-tab",
     dynamicVariableSelector: (variable) => `dynamic-variables-list-item-${joinHyphenCase(variable)}`,
     neetoEditorFixedMenuFontSize: "neeto-editor-fixed-menu-font-size-option",
@@ -192879,6 +192885,30 @@ class EditorPage {
                 await test$1.expect(this.contentField.getByText(neetoCist.truncate(value, 25))).toBeVisible();
             }
         };
+        this.verifyCalloutSelector = async (isButtonInMoreMenu) => {
+            isButtonInMoreMenu && (await this.moreMenuSelector.click());
+            const calloutTypes = ["default", "info", "warning", "error", "success"];
+            const calloutContentField = this.contentField.locator(NEETO_EDITOR_SELECTORS.calloutContent);
+            const calloutTypeOption = this.page.locator(NEETO_EDITOR_SELECTORS.calloutTypeOption);
+            await this.moveCursorAtBottom();
+            for (const [index, type] of calloutTypes.entries()) {
+                await this.calloutSelector.click();
+                const calloutType = calloutTypeOption.filter({ hasText: type });
+                await test$1.expect(calloutType).toBeVisible({ timeout: 10000 });
+                await calloutType.click();
+                await Promise.all([
+                    test$1.expect(calloutTypeOption).toBeHidden(),
+                    test$1.expect(this.contentField.locator(NEETO_EDITOR_SELECTORS.dataEmojiType(type))).toBeVisible(),
+                ]);
+                const randomText = faker.faker.lorem.word(10);
+                await this.page.keyboard.type(randomText);
+                // The index is important here as it determines which callout content field to interact with
+                // eslint-disable-next-line playwright/no-nth-methods
+                await test$1.expect(calloutContentField.nth(index)).toContainText(randomText);
+                await this.moveCursorAtBottom();
+            }
+            return [{ key: "callout" }];
+        };
         this.buttonsAndVerifications = {
             "font-size": () => this.verifyFontSize(),
             emoji: isButtonInMoreMenu => this.verifyEmojiSelector(isButtonInMoreMenu),
@@ -192904,6 +192934,7 @@ class EditorPage {
             undo: isButtonInMoreMenu => this.verifyUndoSelector(isButtonInMoreMenu),
             redo: isButtonInMoreMenu => this.verifyRedoSelector(isButtonInMoreMenu),
             table: isButtonInMoreMenu => this.verifyTableSelector(isButtonInMoreMenu),
+            callout: isButtonInMoreMenu => this.verifyCalloutSelector(isButtonInMoreMenu),
             "video-upload": isButtonInMoreMenu => this.verifyVideoUploadOption({
                 filePath: this.videoPath,
                 isButtonInMoreMenu,
@@ -192980,6 +193011,7 @@ class EditorPage {
             .getByTestId(COMMON_SELECTORS.dropdownIcon);
         this.contentField = this.editorWrapper.getByTestId(NEETO_EDITOR_SELECTORS.contentField);
         this.dynamicVariablesButton = this.editorWrapper.getByTestId(NEETO_EDITOR_SELECTORS.dynamicVariablesButton);
+        this.calloutSelector = this.editorWrapper.getByTestId(NEETO_EDITOR_SELECTORS.calloutOption);
         this.undoSelector = this.editorWrapper.getByTestId(NEETO_EDITOR_SELECTORS.undoOption);
         this.redoSelector = this.editorWrapper.getByTestId(NEETO_EDITOR_SELECTORS.redoOption);
         this.tableOption = this.editorWrapper.getByTestId(NEETO_EDITOR_SELECTORS.tableOption);