test: fields re-order

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>

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

@@ -15,16 +15,33 @@ export class ToolbarFieldsPage extends BasePage {
   }
 
   // todo: Click and toggle are similar method. Remove one of them
-  async toggle({ title, isLocallySaved }: { title: string; isLocallySaved?: boolean }) {
+  async toggle({
+    title,
+    isLocallySaved,
+    validateResponse = true,
+  }: {
+    title: string;
+    isLocallySaved?: boolean;
+    validateResponse?: boolean;
+  }) {
     await this.toolbar.clickFields();
+
+    // hack
+    await this.rootPage.waitForTimeout(100);
+
     const toggleColumn = () =>
       this.get().locator(`[data-testid="nc-fields-menu-${title}"]`).locator('input[type="checkbox"]').click();
 
-    await this.waitForResponse({
-      uiAction: toggleColumn,
-      requestUrlPathToMatch: isLocallySaved ? '/api/v1/db/public/' : '/api/v1/db/data/noco/',
-      httpMethodsToMatch: ['GET'],
-    });
+    if (validateResponse) {
+      await this.waitForResponse({
+        uiAction: toggleColumn,
+        requestUrlPathToMatch: isLocallySaved ? '/api/v1/db/public/' : '/api/v1/db/data/noco/',
+        httpMethodsToMatch: ['GET'],
+      });
+    } else {
+      await toggleColumn();
+    }
+
     await this.toolbar.parent.dashboard.waitForLoaderToDisappear();
     await this.toolbar.clickFields();
   }
@@ -90,8 +107,18 @@ export class ToolbarFieldsPage extends BasePage {
     // remove empty strings from array
     fields = fields.filter(field => field !== '');
 
-    console.log(fields);
-
     return fields;
   }
+
+  async dragDropFields(param: { from: number; to: number }) {
+    await this.toolbar.clickFields();
+    const { from, to } = param;
+    const [fromStack, toStack] = await Promise.all([
+      this.get().locator(`.nc-icon.cursor-move`).nth(from),
+      this.get().locator(`.nc-icon.cursor-move`).nth(to),
+    ]);
+
+    await fromStack.dragTo(toStack);
+    await this.toolbar.clickFields();
+  }
 }

tests/playwright/tests/undo-redo.spec.ts

@@ -16,6 +16,8 @@ let dashboard: DashboardPage,
   cityTable: any,
   countryTable: any;
 
+const validateResponse = true;
+
 /**
  This change provides undo/redo on multiple actions over UI.
 
@@ -110,12 +112,18 @@ test.describe('Undo Redo', () => {
 
   async function undo({ page }: { page: Page }) {
     const isMac = await grid.isMacOs();
-    await dashboard.grid.waitForResponse({
-      uiAction: () => page.keyboard.press(isMac ? 'Meta+z' : 'Control+z'),
-      httpMethodsToMatch: ['GET'],
-      requestUrlPathToMatch: `/api/v1/db/data/noco/`,
-      responseJsonMatcher: json => json.pageInfo,
-    });
+
+    if (validateResponse) {
+      await dashboard.grid.waitForResponse({
+        uiAction: () => page.keyboard.press(isMac ? 'Meta+z' : 'Control+z'),
+        httpMethodsToMatch: ['GET'],
+        requestUrlPathToMatch: `/api/v1/db/data/noco/`,
+        responseJsonMatcher: json => json.pageInfo,
+      });
+    } else {
+      await page.keyboard.press(isMac ? 'Meta+z' : 'Control+z');
+      await page.waitForTimeout(100);
+    }
   }
 
   test('Row: Create, Update, Delete', async ({ page }) => {
@@ -198,6 +206,14 @@ test.describe('Undo Redo', () => {
     // Undo : hide Decimal
     await undo({ page });
     await verifyFieldsOrder(['Number', 'Decimal', 'Currency']);
+
+    // reorder test
+    await toolbar.fields.dragDropFields({ from: 1, to: 0 });
+    await verifyFieldsOrder(['Number', 'Currency', 'Decimal']);
+
+    // Undo : reorder
+    await undo({ page });
+    await verifyFieldsOrder(['Number', 'Decimal', 'Currency']);
   });
 });