|
|
@ -2,6 +2,7 @@ import { test } from '@playwright/test'; |
|
|
|
import { DashboardPage } from '../pages/Dashboard'; |
|
|
|
import { DashboardPage } from '../pages/Dashboard'; |
|
|
|
import { GridPage } from '../pages/Dashboard/Grid'; |
|
|
|
import { GridPage } from '../pages/Dashboard/Grid'; |
|
|
|
import setup from '../setup'; |
|
|
|
import setup from '../setup'; |
|
|
|
|
|
|
|
import { ToolbarPage } from '../pages/Dashboard/common/Toolbar'; |
|
|
|
|
|
|
|
|
|
|
|
test.describe('Multi select', () => { |
|
|
|
test.describe('Multi select', () => { |
|
|
|
let dashboard: DashboardPage, grid: GridPage; |
|
|
|
let dashboard: DashboardPage, grid: GridPage; |
|
|
@ -157,3 +158,106 @@ test.describe('Multi select', () => { |
|
|
|
await grid.column.delete({ title: 'MultiSelect' }); |
|
|
|
await grid.column.delete({ title: 'MultiSelect' }); |
|
|
|
}); |
|
|
|
}); |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
test.describe('Multi select - filters', () => { |
|
|
|
|
|
|
|
// https://github.com/nocodb/nocodb/issues/534
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Row values
|
|
|
|
|
|
|
|
// no values (row ❶)
|
|
|
|
|
|
|
|
// only Foo (row ❷)
|
|
|
|
|
|
|
|
// only Bar (row ❸)
|
|
|
|
|
|
|
|
// only Quux (row ❹)
|
|
|
|
|
|
|
|
// Foo and Bar (row ❺)
|
|
|
|
|
|
|
|
// Foo and Bar and Quux (row ❻)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Example filters:
|
|
|
|
|
|
|
|
//
|
|
|
|
|
|
|
|
// where tags contains all of Foo
|
|
|
|
|
|
|
|
// result: rows ❷, ❺ and ❻
|
|
|
|
|
|
|
|
// where tags contains any of Foo, Bar
|
|
|
|
|
|
|
|
// result: rows ❷, ❸, ❺ and ❻
|
|
|
|
|
|
|
|
// where tags contains all of Foo, Bar
|
|
|
|
|
|
|
|
// result: rows ❺ and ❻
|
|
|
|
|
|
|
|
// where tags is equal Foo, Bar
|
|
|
|
|
|
|
|
// result: row ❺
|
|
|
|
|
|
|
|
// where tags is equal Bar
|
|
|
|
|
|
|
|
// result: row ❸
|
|
|
|
|
|
|
|
// where tags is not null
|
|
|
|
|
|
|
|
// result: rows ❷, ❸, ❹, ❺ and ❻
|
|
|
|
|
|
|
|
// where tags is null
|
|
|
|
|
|
|
|
// result: row ❶
|
|
|
|
|
|
|
|
// where tags does not contain any of Quux
|
|
|
|
|
|
|
|
// result: rows ❶, ❷, ❸ and ❺
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
let dashboard: DashboardPage, grid: GridPage, toolbar: ToolbarPage; |
|
|
|
|
|
|
|
let context: any; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
test.beforeAll(async ({ page }) => { |
|
|
|
|
|
|
|
context = await setup({ page }); |
|
|
|
|
|
|
|
dashboard = new DashboardPage(page, context.project); |
|
|
|
|
|
|
|
toolbar = dashboard.grid.toolbar; |
|
|
|
|
|
|
|
grid = dashboard.grid; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
await dashboard.treeView.createTable({ title: 'sheet1' }); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
await grid.column.create({ title: 'MultiSelect', type: 'MultiSelect' }); |
|
|
|
|
|
|
|
await grid.column.selectOption.addOptions({ |
|
|
|
|
|
|
|
columnTitle: 'MultiSelect', |
|
|
|
|
|
|
|
options: ['foo', 'bar', 'baz'], |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
await grid.addNewRow({ index: 0, value: '1' }); |
|
|
|
|
|
|
|
await grid.addNewRow({ index: 1, value: '2' }); |
|
|
|
|
|
|
|
await grid.addNewRow({ index: 2, value: '3' }); |
|
|
|
|
|
|
|
await grid.addNewRow({ index: 3, value: '4' }); |
|
|
|
|
|
|
|
await grid.addNewRow({ index: 4, value: '5' }); |
|
|
|
|
|
|
|
await grid.addNewRow({ index: 5, value: '6' }); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 1, columnHeader: 'MultiSelect', option: 'foo', multiSelect: true }); |
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 2, columnHeader: 'MultiSelect', option: 'bar', multiSelect: true }); |
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 3, columnHeader: 'MultiSelect', option: 'baz', multiSelect: true }); |
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 4, columnHeader: 'MultiSelect', option: 'foo', multiSelect: true }); |
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 4, columnHeader: 'MultiSelect', option: 'bar', multiSelect: true }); |
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 5, columnHeader: 'MultiSelect', option: 'foo', multiSelect: true }); |
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 5, columnHeader: 'MultiSelect', option: 'bar', multiSelect: true }); |
|
|
|
|
|
|
|
await grid.cell.selectOption.select({ index: 5, columnHeader: 'MultiSelect', option: 'baz', multiSelect: true }); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 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.add({ |
|
|
|
|
|
|
|
columnTitle: 'MultiSelect', |
|
|
|
|
|
|
|
opType: param.opType, |
|
|
|
|
|
|
|
value: param.value, |
|
|
|
|
|
|
|
isLocallySaved: false, |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
await toolbar.clickFilter(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// verify filtered rows
|
|
|
|
|
|
|
|
await validateRowArray(param.result); |
|
|
|
|
|
|
|
// Reset filter
|
|
|
|
|
|
|
|
await toolbar.filter.reset(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
test('Select and clear options and rename options', async () => { |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'contains all of', value: 'foo', result: ['2', '5', '6'] }); |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'contains any of', value: 'foo,bar', result: ['2', '3', '5', '6'] }); |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'contains all of', value: 'foo,bar', result: ['5', '6'] }); |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'is equal', value: 'foo,bar', result: ['5'] }); |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'is equal', value: 'bar', result: ['3'] }); |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'is not null', result: ['2', '3', '4', '5', '6'] }); |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'is null', result: ['1'] }); |
|
|
|
|
|
|
|
await verifyFilter({ opType: 'does not contain any of', value: 'baz', result: ['1', '2', '3', '5'] }); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
}); |
|
|
|