Browse Source

mobile mode: tests - WIP

pull/5114/head
Daniel Spaude 2 years ago
parent
commit
6f81441b17
No known key found for this signature in database
GPG Key ID: 654A3D1FA4F35FFE
  1. 6
      tests/playwright/pages/Dashboard/common/Toolbar/Fields.ts
  2. 12
      tests/playwright/pages/Dashboard/common/Toolbar/index.ts
  3. 23
      tests/playwright/tests/mobileMode.spec.ts

6
tests/playwright/pages/Dashboard/common/Toolbar/Fields.ts

@ -14,6 +14,12 @@ export class ToolbarFieldsPage extends BasePage {
return this.rootPage.locator(`[data-testid="nc-fields-menu"]`);
}
// async verifyVisibleWithIconAndText() {
// await expect(this.get()).toBeVisible();
// await expect(this.get().locator(`button`)).toBeVisible();
// await expect(this.get().locator(`button`).locator(`svg`)).toBeVisible();
// }
// todo: Click and toggle are similar method. Remove one of them
async toggle({ title, isLocallySaved }: { title: string; isLocallySaved?: boolean }) {
await this.toolbar.clickFields();

12
tests/playwright/pages/Dashboard/common/Toolbar/index.ts

@ -76,6 +76,18 @@ export class ToolbarPage extends BasePage {
if (menuOpen) await this.sort.get().waitFor({ state: 'hidden' });
}
async verifyFieldsButtonIsVisibleWithTextAndIcon() {
await expect(this.get().locator(`button.nc-fields-menu-btn`)).toBeVisible();
await expect(this.get().locator(`button.nc-fields-menu-btn`)).toHaveText('Fields');
expect(await this.get().locator(`button.nc-fields-menu-btn`).locator(`svg`).count()).toBe(2);
}
async verifyFieldsButtonIsVisibleWithoutTextButIcon() {
await expect(this.get().locator(`button.nc-fields-menu-btn`)).toBeVisible();
await expect(this.get().locator(`button.nc-fields-menu-btn`)).not.toHaveText('Fields');
expect(await this.get().locator(`button.nc-fields-menu-btn`).locator(`svg`).count()).toBe(2);
}
async clickFilter({
// `networkValidation` is used to verify that api calls are made when the button is clicked
// which happens when the filter is opened for the first time

23
tests/playwright/tests/mobileMode.spec.ts

@ -3,7 +3,7 @@ import { DashboardPage } from '../pages/Dashboard';
import { ToolbarPage } from '../pages/Dashboard/common/Toolbar';
import setup from '../setup';
test.describe('Mobile Mode', () => {
test.describe.only('Mobile Mode', () => {
let dashboard: DashboardPage;
let context: any;
let toolbar: ToolbarPage;
@ -15,18 +15,27 @@ test.describe('Mobile Mode', () => {
toolbar = dashboard.grid.toolbar;
});
test('activating Mobile Mode results in hiding some menu items and only showing the icons of menu items', async () => {
await dashboard.verifyTeamAndSettingsLinkIsVisible();
await dashboard.toggleMobileMode();
await dashboard.verifyTeamAndSettingsLinkIsNotVisible();
});
// test('displays Toggle Mobile Mode menu item in correct location and with correct label', async () => {
// const mobileModeButton = await homePage.getMobileModeButton();
// expect(await mobileModeButton.isVisible()).toBeTruthy();
// expect(await mobileModeButton.innerText()).toEqual('Toggle Mobile Mode');
// });
test('activating Mobile Mode results in hiding some menu items and only showing the icons of menu items', async () => {
await dashboard.verifyTeamAndSettingsLinkIsVisible();
await dashboard.treeView.createTable({ title: 'test-table-for-mobile-mode' });
// await dashboard.rootPage.pause();
// await toolbar.fields.verifyVisibleWithIconAndText();
await toolbar.verifyFieldsButtonIsVisibleWithTextAndIcon();
await dashboard.toggleMobileMode();
await dashboard.verifyTeamAndSettingsLinkIsNotVisible();
await toolbar.verifyFieldsButtonIsVisibleWithoutTextButIcon();
// await dashboard
});
// test('changes appearance of menu bars when Toggle Mobile Mode is clicked', async () => {
// await homePage.toggleMobileMode();
// expect(await homePage.menuBarHasMobileModeAppearance()).toBeTruthy();

Loading…
Cancel
Save