Skip to content

test: Merge modal page objects #37253

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
kodiakhq merged 2 commits into from
Oct 17, 2025
Merged

test: Merge modal page objects #37253

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5409963
test: merge `modal` page objects
dougfabris Oct 17, 2025
b6bee7f
Merge branch 'develop' into test/merge-modal-po
kodiakhq[bot] Oct 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions apps/meteor/client/views/modal/uikit/ModalBlock.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -175,10 +175,10 @@ const ModalBlock = ({ view, errors, onSubmit, onClose, onCancel }: ModalBlockPar
return (
<AnimatedVisibility visibility={AnimatedVisibility.UNHIDING}>
<FocusScope contain restoreFocus autoFocus>
<Modal open id={id} ref={ref}>
<Modal aria-labelledby={`${id}-title`} open id={id} ref={ref}>
<ModalHeader>
{view.showIcon ? <ModalThumb url={getURL(`/api/apps/${view.appId}/icon`)} /> : null}
<ModalTitle>{modalParser.text(view.title, UiKit.BlockContext.NONE, 0)}</ModalTitle>
<ModalTitle id={`${id}-title`}>{modalParser.text(view.title, UiKit.BlockContext.NONE, 0)}</ModalTitle>
<ModalClose tabIndex={-1} onClick={onClose} />
</ModalHeader>
<ModalContent>
Expand Down
24 changes: 9 additions & 15 deletions apps/meteor/tests/e2e/apps/apps-modal.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,23 @@ import type { Page } from '@playwright/test';
import { IS_EE } from '../config/constants';
import { Users } from '../fixtures/userStates';
import { HomeChannel } from '../page-objects';
import { Modal } from '../page-objects/modal';
import { AppsModal } from '../page-objects/fragments/apps-modal';
import { expect, test } from '../utils/test';

test.use({ storageState: Users.user1.state });

test.describe.serial('Apps > Modal', () => {
test.skip(!IS_EE, 'Premium Only');
let poHomeChannel: HomeChannel;
let poModal: Modal;
let poModal: AppsModal;

let page: Page;

test.beforeAll(async ({ browser }) => {
page = await browser.newPage();

poHomeChannel = new HomeChannel(page);
poModal = new Modal(page);
poModal = new AppsModal(page);

await page.goto('/home');
await poHomeChannel.sidenav.openChat('general');
Expand All @@ -29,23 +29,17 @@ test.describe.serial('Apps > Modal', () => {
await page.close();
});

test('expect allow user open app modal', async () => {
test('should allow user open app modal', async () => {
await poHomeChannel.content.dispatchSlashCommand('/modal');
await expect(poModal.btnModalSubmit).toBeVisible();
await poModal.waitForDisplay();
});

test('expect validation error message appears in app modal', async () => {
await expect(poModal.textInput).toBeVisible();

await poModal.btnModalSubmit.click();

test('should display validation error message in app modal', async () => {
await poModal.btnSubmit.click();
await expect(poModal.textInputErrorMessage).toBeVisible();
});

test("expect validation error message don't appears in app modal", async () => {
await poModal.textInput.fill('something');
await poModal.btnModalSubmit.click();

await expect(poModal.textInputErrorMessage).not.toBeVisible();
test('should not display validation error message in app modal', async () => {
await poModal.submit('something');
});
});
29 changes: 29 additions & 0 deletions apps/meteor/tests/e2e/page-objects/fragments/apps-modal.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import type { Locator, Page } from 'playwright-core';

import { Modal } from './modal';

export class AppsModal extends Modal {
protected readonly page: Page;

constructor(page: Page) {
super(page.getByRole('dialog', { name: 'Modal Example' }));
}

get textInput(): Locator {
return this.root.locator('[name="modal_input"]');
}

get textInputErrorMessage(): Locator {
return this.root.getByText('Validation failed');
}

get btnSubmit(): Locator {
return this.root.getByRole('button', { name: 'Submit' });
}

async submit(inputText: string) {
await this.textInput.fill(inputText);
await this.btnSubmit.click();
await this.waitForDismissal();
}
}
20 changes: 20 additions & 0 deletions apps/meteor/tests/e2e/page-objects/fragments/edit-status-modal.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import type { Page } from 'playwright-core';

import { Modal } from './modal';

export class EditStatusModal extends Modal {
protected readonly page: Page;

constructor(page: Page) {
super(page.getByRole('dialog', { name: 'Edit Status' }));
}

private get statusMessageInput() {
return this.root.getByRole('textbox', { name: 'Status message' });
}

async changeStatusMessage(statusMessage: string): Promise<void> {
await this.statusMessageInput.fill(statusMessage);
await this.save();
}
}
13 changes: 13 additions & 0 deletions apps/meteor/tests/e2e/page-objects/fragments/modal.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,20 @@ import { expect } from '../../utils/test';
export abstract class Modal {
constructor(protected root: Locator) {}

waitForDisplay() {
return expect(this.root).toBeVisible();
}

waitForDismissal() {
return expect(this.root).not.toBeVisible();
}

private get btnSave() {
return this.root.getByRole('button', { name: 'Save' });
}

async save() {
await this.btnSave.click();
await this.waitForDismissal();
}
}
1 change: 0 additions & 1 deletion apps/meteor/tests/e2e/page-objects/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,5 @@ export * from './omnichannel-settings';
export * from './omnichannel-business-hours';
export * from './omnichannel-tags';
export * from './utils';
export * from './modal';
export * from './marketplace';
export * from './toastBar';
28 changes: 0 additions & 28 deletions apps/meteor/tests/e2e/page-objects/modal.ts
View file
Open in desktop

This file was deleted.

7 changes: 3 additions & 4 deletions apps/meteor/tests/e2e/presence.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { DEFAULT_USER_CREDENTIALS, IS_EE } from './config/constants';
import { Users } from './fixtures/userStates';
import { Registration, HomeChannel } from './page-objects';
import { Modal } from './page-objects/modal';
import { EditStatusModal } from './page-objects/fragments/edit-status-modal';
import { setSettingValueById } from './utils/setSettingValueById';
import { test, expect } from './utils/test';

Expand Down Expand Up @@ -48,12 +48,11 @@ test.describe.serial('Presence', () => {
const user1Page = await browser.newPage({ storageState: Users.user1.state });
await user1Page.goto('/home');
const user1Channel = new HomeChannel(user1Page);
const user1Modal = new Modal(user1Page);
const user1Modal = new EditStatusModal(user1Page);

await user1Channel.sidenav.btnUserProfileMenu.click();
await user1Channel.sidenav.getUserProfileMenuOption('Custom Status').click();
await user1Modal.getModalByName('Edit Status').getByRole('textbox', { name: 'Status message' }).fill('new status');
await user1Modal.getModalByName('Edit Status').getByRole('button', { name: 'Save' }).click();
await user1Modal.changeStatusMessage('new status');

await user1Page.close();
});
Expand Down
Loading