Browse Source

mobile mode: tests - WIP

pull/5114/head
Daniel Spaude 2 years ago
parent
commit
3da65a1736
No known key found for this signature in database
GPG Key ID: 654A3D1FA4F35FFE
  1. 4
      tests/playwright/pages/Dashboard/TreeView.ts
  2. 4
      tests/playwright/pages/Dashboard/common/Toolbar/index.ts
  3. 31
      tests/playwright/tests/findRowByScanner.spec.ts
  4. 31
      tests/playwright/tests/mobileMode.spec.ts

4
tests/playwright/pages/Dashboard/TreeView.ts

@ -22,6 +22,10 @@ export class TreeViewPage extends BasePage {
return await this.get().isVisible(); return await this.get().isVisible();
} }
// async isInViewport() {
// return await this.get().isIntersectingViewport();
// }
async verifyVisibility({ isVisible }: { isVisible: boolean }) { async verifyVisibility({ isVisible }: { isVisible: boolean }) {
if (isVisible) { if (isVisible) {
await expect(this.get()).toBeVisible(); await expect(this.get()).toBeVisible();

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

@ -67,6 +67,10 @@ export class ToolbarPage extends BasePage {
if (menuOpen) await this.fields.get().waitFor({ state: 'hidden' }); if (menuOpen) await this.fields.get().waitFor({ state: 'hidden' });
} }
async clickFindRowByScanButton() {
await this.get().locator(`button.nc-btn-find-row-by-scan`).click();
}
async clickSort() { async clickSort() {
const menuOpen = await this.sort.get().isVisible(); const menuOpen = await this.sort.get().isVisible();

31
tests/playwright/tests/findRowByScanner.spec.ts

@ -0,0 +1,31 @@
import { expect, test } from '@playwright/test';
import { DashboardPage } from '../pages/Dashboard';
import { ToolbarPage } from '../pages/Dashboard/common/Toolbar';
import { FormPage } from '../pages/Dashboard/Form';
import setup from '../setup';
test.describe('Find row by scanner', () => {
let dashboard: DashboardPage;
let context: any;
let toolbar: ToolbarPage;
let form: FormPage;
test.beforeEach(async ({ page }) => {
context = await setup({ page });
dashboard = new DashboardPage(page, context.project);
form = dashboard.form;
toolbar = dashboard.grid.toolbar;
});
test.describe('clicking on the toolbars scanner button', async () => {
test.beforeEach(async () => {
// close 'Team & Auth' tab
await dashboard.closeTab({ title: 'Team & Auth' });
await dashboard.treeView.openTable({ title: 'Country' });
// await toolbar.clickActions;
});
test('opens the scanner overlay', async () => {
expect(2 + 2).toBe(4);
});
});
});

31
tests/playwright/tests/mobileMode.spec.ts

@ -1,10 +1,10 @@
import { expect, test } from '@playwright/test'; import { test } from '@playwright/test';
import { DashboardPage } from '../pages/Dashboard'; import { DashboardPage } from '../pages/Dashboard';
import { ToolbarPage } from '../pages/Dashboard/common/Toolbar'; import { ToolbarPage } from '../pages/Dashboard/common/Toolbar';
import { FormPage } from '../pages/Dashboard/Form'; import { FormPage } from '../pages/Dashboard/Form';
import setup from '../setup'; import setup from '../setup';
test.describe.only('Mobile Mode', () => { test.describe('Mobile Mode', () => {
let dashboard: DashboardPage; let dashboard: DashboardPage;
let context: any; let context: any;
let toolbar: ToolbarPage; let toolbar: ToolbarPage;
@ -14,16 +14,9 @@ test.describe.only('Mobile Mode', () => {
context = await setup({ page }); context = await setup({ page });
dashboard = new DashboardPage(page, context.project); dashboard = new DashboardPage(page, context.project);
form = dashboard.form; form = dashboard.form;
console.log('dashboard(in test.beforeEach)', dashboard);
toolbar = dashboard.grid.toolbar; toolbar = dashboard.grid.toolbar;
}); });
// 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 and deactivating Mobile Mode results correct behavior', async () => { test('activating and deactivating Mobile Mode results correct behavior', async () => {
// in non-mobile mode, all menu items are visible // in non-mobile mode, all menu items are visible
await dashboard.verifyTeamAndSettingsLinkIsVisible(); await dashboard.verifyTeamAndSettingsLinkIsVisible();
@ -33,9 +26,7 @@ test.describe.only('Mobile Mode', () => {
// and all toolbar items have icons AND text // and all toolbar items have icons AND text
await toolbar.verifyFieldsButtonIsVisibleWithTextAndIcon(); await toolbar.verifyFieldsButtonIsVisibleWithTextAndIcon();
// await dashboard.rootPage.pause();
await dashboard.toggleMobileMode(); await dashboard.toggleMobileMode();
// await dashboard.rootPage.pause();
// in mobile-mode, some menu items are hidden // in mobile-mode, some menu items are hidden
await dashboard.verifyTeamAndSettingsLinkIsNotVisible(); await dashboard.verifyTeamAndSettingsLinkIsNotVisible();
@ -45,10 +36,12 @@ test.describe.only('Mobile Mode', () => {
// operations (like creating views, toolbar operations, open treeview for opening tables) still work as expected // operations (like creating views, toolbar operations, open treeview for opening tables) still work as expected
await dashboard.treeView.openTable({ title: 'Country' }); await dashboard.treeView.openTable({ title: 'Country' });
await dashboard.viewSidebar.createFormView({ title: 'CountryForm' }); await dashboard.viewSidebar.createFormView({ title: 'CountryForm' });
await dashboard.viewSidebar.verifyView({ title: 'CountryForm', index: 1 }); await dashboard.viewSidebar.verifyView({ title: 'CountryForm', index: 1 });
// // verify form-view fields order // verify form-view fields order
await form.verifyFormViewFieldsOrder({ await form.verifyFormViewFieldsOrder({
fields: ['Country', 'LastUpdate', 'City List'], fields: ['Country', 'LastUpdate', 'City List'],
}); });
@ -69,18 +62,4 @@ test.describe.only('Mobile Mode', () => {
await dashboard.verifyTeamAndSettingsLinkIsVisible(); await dashboard.verifyTeamAndSettingsLinkIsVisible();
await toolbar.verifyFieldsButtonIsVisibleWithTextAndIcon(); await toolbar.verifyFieldsButtonIsVisibleWithTextAndIcon();
}); });
// test('performs expected actions when clicking menu items with hidden text in mobile mode', async () => {
// await homePage.toggleMobileMode();
// await homePage.clickFirstMobileMenuItem();
// expect(await homePage.getCurrentUrl()).toContain('/expected-url');
// });
// test('hides left Tables sidebar menu when clicking outside of the bar in mobile mode', async () => {
// await homePage.toggleMobileMode();
// await homePage.openTablesSidebarMenu();
// expect(await homePage.isTablesSidebarMenuOpen()).toBeTruthy();
// await homePage.clickOutsideTablesSidebarMenu();
// expect(await homePage.isTablesSidebarMenuOpen()).toBeFalsy();
// });
}); });

Loading…
Cancel
Save