test: checkbox column verification

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

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

@@ -37,7 +37,7 @@ export class ToolbarFilterPage extends BasePage {
   }: {
     columnTitle: string;
     opType: string;
-    value: string;
+    value?: string;
     isLocallySaved: boolean;
   }) {
     await this.get().locator(`button:has-text("Add Filter")`).first().click();
@@ -70,14 +70,17 @@ export class ToolbarFilterPage extends BasePage {
       await this.toolbar.parent.dashboard.waitForLoaderToDisappear();
     }
 
-    const fillFilter = this.rootPage.locator('.nc-filter-value-select').last().fill(value);
-    await this.waitForResponse({
-      uiAction: fillFilter,
-      httpMethodsToMatch: ['GET'],
-      requestUrlPathToMatch: isLocallySaved ? `/api/v1/db/public/` : `/api/v1/db/data/noco/`,
-    });
-    await this.toolbar.parent.dashboard.waitForLoaderToDisappear();
-    await this.toolbar.parent.waitLoading();
+    // if value field was provided, fill it
+    if (value) {
+      const fillFilter = this.rootPage.locator('.nc-filter-value-select').last().fill(value);
+      await this.waitForResponse({
+        uiAction: fillFilter,
+        httpMethodsToMatch: ['GET'],
+        requestUrlPathToMatch: isLocallySaved ? `/api/v1/db/public/` : `/api/v1/db/data/noco/`,
+      });
+      await this.toolbar.parent.dashboard.waitForLoaderToDisappear();
+      await this.toolbar.parent.waitLoading();
+    }
   }
 
   async resetFilter() {

tests/playwright/tests/columnCheckbox.spec.ts

@@ -0,0 +1,120 @@
+import { test } from '@playwright/test';
+import { DashboardPage } from '../pages/Dashboard';
+import setup from '../setup';
+import { ToolbarPage } from '../pages/Dashboard/common/Toolbar';
+
+test.describe('Checkbox - cell, filter, sort', () => {
+  let dashboard: DashboardPage, toolbar: ToolbarPage;
+  let context: any;
+
+  // define validateRowArray function
+  async function validateRowArray(value: string[]) {
+    const length = value.length;
+    for (let i = 0; i < length; i++) {
+      await dashboard.grid.cell.verify({
+        index: i,
+        columnHeader: 'Title',
+        value: value[i],
+      });
+    }
+  }
+
+  async function verifyFilter(param: { opType: string; value?: string; result: string[] }) {
+    await toolbar.clickFilter();
+    await toolbar.filter.addNew({
+      columnTitle: 'checkbox',
+      opType: param.opType,
+      value: param.value,
+      isLocallySaved: false,
+    });
+    await toolbar.clickFilter();
+
+    // verify filtered rows
+    await validateRowArray(param.result);
+    // Reset filter
+    await toolbar.filter.resetFilter();
+  }
+
+  test.beforeEach(async ({ page }) => {
+    context = await setup({ page });
+    dashboard = new DashboardPage(page, context.project);
+    toolbar = dashboard.grid.toolbar;
+  });
+
+  test('Checkbox', async () => {
+    // close 'Team & Auth' tab
+    await dashboard.closeTab({ title: 'Team & Auth' });
+
+    await dashboard.treeView.createTable({ title: 'Sheet1' });
+
+    await dashboard.grid.addNewRow({ index: 0, value: '1a' });
+    await dashboard.grid.addNewRow({ index: 1, value: '1b' });
+    await dashboard.grid.addNewRow({ index: 2, value: '1c' });
+    await dashboard.grid.addNewRow({ index: 3, value: '1d' });
+    await dashboard.grid.addNewRow({ index: 4, value: '1e' });
+    await dashboard.grid.addNewRow({ index: 5, value: '1f' });
+
+    // Create Checkbox column
+    await dashboard.grid.column.create({
+      title: 'checkbox',
+      type: 'Checkbox',
+    });
+
+    // In cell insert
+    await dashboard.grid.cell.checkbox.click({ index: 0, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.click({ index: 1, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.click({ index: 2, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.click({ index: 5, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.click({ index: 1, columnHeader: 'checkbox' });
+
+    // verify checkbox state
+    await dashboard.grid.cell.checkbox.verifyChecked({ index: 0, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.verifyChecked({ index: 2, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.verifyChecked({ index: 5, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.verifyUnchecked({ index: 1, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.verifyUnchecked({ index: 3, columnHeader: 'checkbox' });
+    await dashboard.grid.cell.checkbox.verifyUnchecked({ index: 4, columnHeader: 'checkbox' });
+
+    // column values
+    // 1a : true
+    // 1b : false
+    // 1c : true
+    // 1d : null
+    // 1e : null
+    // 1f : true
+
+    // Filter column
+    await verifyFilter({ opType: 'is checked', result: ['1a', '1c', '1f'] });
+    await verifyFilter({ opType: 'is not checked', result: ['1b', '1d', '1e'] });
+    await verifyFilter({ opType: 'is equal', value: '0', result: ['1b'] });
+    await verifyFilter({ opType: 'is not equal', value: '1', result: ['1b', '1d', '1e'] });
+    await verifyFilter({ opType: 'is null', result: ['1d', '1e'] });
+    await verifyFilter({ opType: 'is not null', result: ['1a', '1b', '1c', '1f'] });
+
+    // Sort column
+    await toolbar.sort.addSort({
+      columnTitle: 'checkbox',
+      isAscending: true,
+      isLocallySaved: false,
+    });
+    await validateRowArray(['1d', '1e', '1b', '1a', '1c', '1f']);
+    await toolbar.sort.resetSort();
+
+    // sort descending & validate
+    await toolbar.sort.addSort({
+      columnTitle: 'checkbox',
+      isAscending: false,
+      isLocallySaved: false,
+    });
+    await validateRowArray(['1a', '1c', '1f', '1b', '1d', '1e']);
+    await toolbar.sort.resetSort();
+
+    // wait for 10 seconds
+    await dashboard.rootPage.waitForTimeout(10000);
+
+    // TBD: Add more tests
+    // Expanded form insert
+    // Expanded record insert
+    // Expanded form insert
+  });
+});