@bigbinary/neeto-playwright-commons 1.9.6 → 1.9.8

package/index.cjs.js

@@ -355,6 +355,9 @@ const COMMON_SELECTORS = {
     sidebarSubLink: (label) => `${hyphenize(label)}-sub-link`,
     sidebarGoBackButton: (label) => `${hyphenize(label)}-go-back-button`,
     selectSingleValue: "select-single-value",
+    actionSelectIndicator: "action-select-indicator",
+    takeActionDropdown: "take-action-dropdown-icon",
+    columnsSearchInput: "neeto-ui-columns-search",
 };
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -2766,6 +2769,10 @@ class CustomCommands {
             await uploadFile;
             await test$1.expect(this.page.getByTestId(NEETO_IMAGE_UPLOADER_SELECTORS.uploadedImage)).toHaveAttribute("src", new RegExp(imageName), { timeout: 20000 });
         };
+        this.verifyTooltip = async ({ triggerElement, content, }) => {
+            await triggerElement.hover();
+            await test$1.expect(this.page.getByTestId(COMMON_SELECTORS.tooltip)).toContainText(content);
+        };
         this.page = page;
         this.responses = [];
         this.request = request;
@@ -12702,6 +12709,10 @@ const CHAT_WIDGET_TEXTS = {
 };
 const MEMBER_TEXTS = {
     agent: "Agent",
+    admin: "Admin",
+    selectAll: "Select All",
+    hide: "Hide all",
+    show: "Show all",
 };
 const INTEGRATIONS_TEXTS = {
     connectHeader: (integration) => `Connect your ${integration} account`,
@@ -14039,6 +14050,232 @@ class ImageUploader {
     }
 }
 
+const MEMBER_SELECTORS = {
+    membersTab: "members-nav-tab",
+    newButton: "ntm-add-member-button",
+    continueButton: "ntm-manage-member-continue-button",
+    submitButton: "ntm-manage-member-submit-button",
+    searchTextField: "ntm-search-members-input",
+    deactivatedAgentsButton: "ntm-members-menubar-deactivated-block",
+    activatedMembersButton: "ntm-members-menubar-active-block",
+    columnCheckBox: "neeto-ui-columns-checkbox",
+    roleLabel: (role) => `${joinHyphenCase(role)}-radio-label`,
+    teamMembersTable: "ntm-members-table",
+    dropDownIcon: "ntm-members-table-row-dropdown-button",
+    editButton: "ntm-edit-member-button",
+    menuBarHeading: "ntm-members-menubar-heading",
+    activateOrDeactivateMember: "ntm-deactivate-member-button",
+    columnsButton: "columns-dropdown-button",
+    columnsDropdownContainer: "columns-dropdown-container",
+    emailDropdownItemLabel: "email-checkbox-label",
+    roleDropdownItemLabel: "role-checkbox-label",
+    inviteStatusDropdownItemLabel: "invite-status-checkbox-label",
+    heading: "ntm-manage-members-pane-header",
+    activateButton: "ntm-activate-members-button",
+    deactivateButton: "ntm-deactivate-members-button",
+    rolesButton: "ntm-manage-member-roles-button",
+    statusTag: "ntm-member-status-tag",
+    menubarSubLink: (sublink) => `members-menubar-${sublink}-block-sub-link`,
+    takeActionStateOption: (option = "") => `ntm-${hyphenize(option)}-members-button`,
+    checkboxLabel: (label) => `${hyphenize(label)}-checkbox-label`,
+};
+const MEMBER_FORM_SELECTORS = {
+    emailTextField: "email-select-input-field",
+    firstNameTextField: "ntm-edit-member-first-name-text-field",
+    lastNameTextField: "ntm-edit-member-last-name-text-field",
+    emailInput: "ntm-manage-member-email-input",
+    emailErrorField: "emails-input-error",
+    cancelButton: "ntm-manage-member-cancel-button",
+};
+
+class TeamMembers {
+    constructor({ page, neetoPlaywrightUtilities, }) {
+        this.navigateToTeamMembersSublink = async (sublink = "all") => {
+            await this.page.getByTestId(MEMBER_SELECTORS.membersTab).click();
+            await this.page
+                .getByTestId(MEMBER_SELECTORS.menubarSubLink(sublink))
+                .click();
+            await this.neetoPlaywrightUtilities.waitForPageLoad();
+        };
+        this.addMemberViaUI = async ({ emails = [faker.faker.internet.exampleEmail()], role = "standard", } = {}) => {
+            await this.page.getByTestId(MEMBER_SELECTORS.newButton).click();
+            await this.page
+                .getByTestId(MEMBER_FORM_SELECTORS.emailTextField)
+                .fill(emails.join(", "));
+            await this.page.getByTestId(MEMBER_SELECTORS.roleLabel(role)).click();
+            IS_STAGING_ENV &&
+                (await this.page
+                    .getByTestId(COMMON_SELECTORS.paneBody)
+                    .getByTestId(COMMON_SELECTORS.checkboxLabel)
+                    .click());
+            await this.page.getByTestId(MEMBER_SELECTORS.continueButton).click();
+            await this.page.getByTestId(MEMBER_SELECTORS.submitButton).click();
+            await this.neetoPlaywrightUtilities.waitForPageLoad();
+            await this.neetoPlaywrightUtilities.verifySuccessToast();
+        };
+        this.searchAndVerifyMemberByEmail = async ({ email, interceptOptions, }) => {
+            const searchMembers = this.neetoPlaywrightUtilities.interceptMultipleResponses({
+                responseUrl: API_ROUTES.teamMembers.index,
+                ...interceptOptions,
+            });
+            await this.page.getByTestId(MEMBER_SELECTORS.searchTextField).fill(email);
+            await searchMembers;
+            await test$1.expect(this.page.getByTestId(NEETO_FILTERS_SELECTORS.searchTermBlock)).toContainText(email);
+            await test$1.expect(this.page.getByRole("cell", { name: email, exact: true })).toBeVisible();
+            await test$1.expect(this.page.getByTestId(COMMON_SELECTORS.tableSpinner)).toBeHidden();
+        };
+        this.editMemberViaUI = async ({ email = "", firstName = "", lastName = "", role = "standard", } = {}) => {
+            await this.page.getByTestId(MEMBER_SELECTORS.dropDownIcon).click();
+            await this.page.getByTestId(MEMBER_SELECTORS.editButton).click();
+            neetoCist.isPresent(email) &&
+                (await this.page
+                    .getByTestId(MEMBER_FORM_SELECTORS.emailInput)
+                    .fill(email));
+            neetoCist.isPresent(firstName) &&
+                (await this.page
+                    .getByTestId(MEMBER_FORM_SELECTORS.firstNameTextField)
+                    .fill(firstName));
+            neetoCist.isPresent(lastName) &&
+                (await this.page
+                    .getByTestId(MEMBER_FORM_SELECTORS.lastNameTextField)
+                    .fill(lastName));
+            await this.page.getByTestId(MEMBER_SELECTORS.roleLabel(role)).click();
+            await this.page.getByTestId(MEMBER_SELECTORS.submitButton).click();
+            await this.neetoPlaywrightUtilities.verifySuccessToast();
+            await this.neetoPlaywrightUtilities.waitForPageLoad();
+        };
+        this.toggleMemberStateViaUI = async () => {
+            await this.page.getByTestId(MEMBER_SELECTORS.dropDownIcon).click();
+            await this.page
+                .getByTestId(MEMBER_SELECTORS.activateOrDeactivateMember)
+                .click();
+            await this.page
+                .getByTestId(COMMON_SELECTORS.alertModalSubmitButton)
+                .click();
+            await this.neetoPlaywrightUtilities.verifySuccessToast();
+            await this.neetoPlaywrightUtilities.waitForPageLoad();
+        };
+        this.filterMembersByMultiSelect = async ({ selectedOptions = [], selectContainerLocator = NEETO_FILTERS_SELECTORS.roleSelectContainer, }) => {
+            await this.page
+                .getByTestId(selectContainerLocator)
+                .getByTestId(COMMON_SELECTORS.actionSelectIndicator)
+                .click();
+            for (const option of selectedOptions) {
+                const fetchMembers = this.neetoPlaywrightUtilities.interceptMultipleResponses({
+                    responseUrl: API_ROUTES.teamMembers.index,
+                });
+                await this.page
+                    .getByTestId(COMMON_SELECTORS.selectOption(option))
+                    .click();
+                await fetchMembers;
+            }
+        };
+        this.filterMembers = async ({ email = { id: "", condition: "Is" }, roles = [], name = "", }) => {
+            await this.page.getByTestId(NEETO_FILTERS_SELECTORS.filterButton).click();
+            if (neetoCist.isPresent(email.id)) {
+                await this.page
+                    .getByTestId(NEETO_FILTERS_SELECTORS.emailSelectContainer)
+                    .getByTestId(COMMON_SELECTORS.actionSelectIndicator)
+                    .click();
+                await this.page
+                    .getByTestId(COMMON_SELECTORS.selectOption(email.condition))
+                    .click();
+                const fetchMembers = this.neetoPlaywrightUtilities.interceptMultipleResponses({
+                    responseUrl: API_ROUTES.teamMembers.index,
+                });
+                await this.page
+                    .getByTestId(NEETO_FILTERS_SELECTORS.filtersEmailFilter)
+                    .fill(email.id);
+                await fetchMembers;
+            }
+            if (neetoCist.isPresent(name)) {
+                const fetchMembers = this.neetoPlaywrightUtilities.interceptMultipleResponses({
+                    responseUrl: API_ROUTES.teamMembers.index,
+                });
+                await this.page
+                    .getByTestId(NEETO_FILTERS_SELECTORS.neetoFiltersNameFilterField)
+                    .fill(name);
+                await fetchMembers;
+            }
+            neetoCist.isPresent(roles) &&
+                (await this.filterMembersByMultiSelect({ selectedOptions: roles }));
+            await this.page
+                .getByTestId(NEETO_FILTERS_SELECTORS.filterDoneButton)
+                .click();
+        };
+        // TODO: Change the selector after this issue is resolved: https://github.com/bigbinary/neeto-team-members-nano/issues/258
+        this.getMemberRowByName = (name) => this.page.getByRole("row", { name: `avatar--${name}` });
+        this.takeActionOnMembers = async ({ names = [], state, action, }) => {
+            if (neetoCist.isPresent(names)) {
+                for (const name of names) {
+                    await this.getMemberRowByName(name).getByRole("checkbox").click();
+                }
+            }
+            else {
+                await this.page
+                    .getByRole("columnheader", { name: MEMBER_TEXTS.selectAll })
+                    .click();
+            }
+            await this.page.getByTestId(COMMON_SELECTORS.takeActionDropdown).click();
+            if (neetoCist.isPresent(state)) {
+                await this.page
+                    .getByTestId(MEMBER_SELECTORS.takeActionStateOption(state))
+                    .click();
+            }
+            else {
+                await this.page
+                    .getByRole("button", { name: action === null || action === void 0 ? void 0 : action.actionButtonText })
+                    .click();
+                await this.page
+                    .getByRole("button", { name: action === null || action === void 0 ? void 0 : action.valueButtonText })
+                    .click();
+            }
+            await this.page
+                .getByTestId(COMMON_SELECTORS.alertModalSubmitButton)
+                .click();
+            await this.neetoPlaywrightUtilities.verifySuccessToast();
+            await this.neetoPlaywrightUtilities.waitForPageLoad();
+        };
+        this.performColumnAction = async ({ columnName = "Name", actionButtonText = "Ascending", } = {}) => {
+            await this.page
+                .getByTestId(MEMBER_SELECTORS.teamMembersTable)
+                .getByLabel(columnName)
+                .getByTestId(COMMON_SELECTORS.dropdownIcon)
+                .click();
+            await this.page.getByRole("button", { name: actionButtonText }).click();
+            await test$1.expect(this.page.getByTestId(COMMON_SELECTORS.tableSpinner)).toBeHidden();
+        };
+        this.toggleMemberColumns = async ({ columns = [], bulkAction, }) => {
+            await this.page.getByTestId(COMMON_SELECTORS.columnsDropdownButton).click();
+            if (neetoCist.isPresent(bulkAction)) {
+                await this.page
+                    .getByRole("button", {
+                    name: bulkAction === "hide" ? "Hide All" : "Show All",
+                })
+                    .click();
+            }
+            else {
+                for (const column of columns) {
+                    await this.page
+                        .getByTestId(COMMON_SELECTORS.columnsSearchInput)
+                        .fill(column);
+                    await this.page
+                        .getByTestId(MEMBER_SELECTORS.checkboxLabel(column))
+                        .click();
+                }
+            }
+            await this.page.getByTestId(COMMON_SELECTORS.columnsDropdownButton).click();
+        };
+        this.verifyMemberInTable = ({ name, email }) => test$1.expect(this.getMemberRowByName(name).getByRole("cell", {
+            name: email,
+            exact: true,
+        })).toBeVisible();
+        this.page = page;
+        this.neetoPlaywrightUtilities = neetoPlaywrightUtilities;
+        this.t = playwrightI18nextFixture.getI18nInstance().t;
+    }
+}
+
 const LOGIN_SELECTORS = {
     appleAuthenticationButton: "apple-authentication-button",
     emailTextField: "login-email-text-field",
@@ -14343,40 +14580,6 @@ const networkConditions = {
     },
 };
 
-const MEMBER_SELECTORS = {
-    membersTab: "members-nav-tab",
-    newButton: "ntm-add-member-button",
-    continueButton: "ntm-manage-member-continue-button",
-    submitButton: "ntm-manage-member-submit-button",
-    searchTextField: "ntm-search-members-input",
-    deactivatedAgentsButton: "ntm-members-menubar-deactivated-block",
-    activatedMembersButton: "ntm-members-menubar-active-block",
-    columnCheckBox: "neeto-ui-columns-checkbox",
-    roleLabel: (role) => `${joinHyphenCase(role)}-radio-label`,
-    dropDownIcon: "ntm-members-table-row-dropdown-button",
-    editButton: "ntm-edit-member-button",
-    menuBarHeading: "ntm-members-menubar-heading",
-    activateOrDeactivateMember: "ntm-deactivate-member-button",
-    columnsButton: "columns-dropdown-button",
-    columnsDropdownContainer: "columns-dropdown-container",
-    emailDropdownItemLabel: "email-checkbox-label",
-    roleDropdownItemLabel: "role-checkbox-label",
-    inviteStatusDropdownItemLabel: "invite-status-checkbox-label",
-    heading: "ntm-manage-members-pane-header",
-    activateButton: "ntm-activate-members-button",
-    deactivateButton: "ntm-deactivate-members-button",
-    rolesButton: "ntm-manage-member-roles-button",
-    statusTag: "ntm-member-status-tag",
-};
-const MEMBER_FORM_SELECTORS = {
-    emailTextField: "email-select-input-field",
-    firstNameTextField: "ntm-edit-member-first-name-text-field",
-    lastNameTextField: "ntm-edit-member-last-name-text-field",
-    emailInput: "ntm-manage-member-email-input",
-    emailErrorField: "emails-input-error",
-    cancelButton: "ntm-manage-member-cancel-button",
-};
-
 const ROLES_SELECTORS = {
     newButton: "ntm-add-role-button",
     proceedButton: "ntm-add-role-submit-button",
@@ -14486,10 +14689,17 @@ const deactivateMemberViaRequest = ({ email, neetoPlaywrightUtilities, }) => nee
     url: API_ROUTES.teamMembers.bulkUpdate,
     body: { users: { active: false, emails: [email] } },
 });
+const generateRandomTeamMembers = ({ count = 1, role = "standard" }) => neetoCist.dynamicArray(count, () => ({
+    firstName: faker.faker.person.firstName(),
+    lastName: faker.faker.person.lastName(),
+    email: faker.faker.internet.exampleEmail(),
+    role,
+}));
 const memberUtils = {
     addMemberViaRequest,
     editMemberViaRequest,
     deactivateMemberViaRequest,
+    generateRandomTeamMembers,
 };
 
 const assertColumnHeaderVisibility = async ({ page, columnName, shouldBeVisible, }) => {
@@ -147417,8 +147627,15 @@ const openFilterPane = async (page) => {
     await page.getByTestId(NEETO_FILTERS_SELECTORS.filterButton).click();
     await test$1.expect(page.getByTestId(COMMON_SELECTORS.paneHeader)).toHaveText(playwrightI18nextFixture.getI18nInstance().t("neetoFilters.common.filters"));
 };
+const clearFiltersFromActionBlock = async (page) => {
+    await page
+        .getByTestId(NEETO_FILTERS_SELECTORS.neetoFiltersBarClearButton)
+        .click();
+    await test$1.expect(page.getByTestId(NEETO_FILTERS_SELECTORS.neetoFiltersBarClearButton)).toBeHidden();
+};
 const filterUtils = {
     openFilterPane,
+    clearFiltersFromActionBlock,
 };
 
 var main$2 = {exports: {}};
@@ -148080,6 +148297,7 @@ exports.TEXT_MODIFIER_SELECTORS = TEXT_MODIFIER_SELECTORS;
 exports.TEXT_MODIFIER_TAGS = TEXT_MODIFIER_TAGS;
 exports.THIRD_PARTY_ROUTES = THIRD_PARTY_ROUTES;
 exports.TOASTR_MESSAGES = TOASTR_MESSAGES;
+exports.TeamMembers = TeamMembers;
 exports.USER_AGENTS = USER_AGENTS;
 exports.WebhooksPage = WebhooksPage;
 exports.ZAPIER_LIMIT_EXHAUSTED_MESSAGE = ZAPIER_LIMIT_EXHAUSTED_MESSAGE;