Added UX test for column, split&join (#3641), issue #3641

Added UX test for column, split&join
This commit is contained in:
Florian Giroud 2021-03-10 15:46:50 +01:00 committed by GitHub
parent a07ca9d72d
commit 91c3cc734d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 158 additions and 35 deletions

View File

@ -0,0 +1,31 @@
describe(__filename, function () {
it('Join cells', function () {
// Load a splitted dataset, one number per row,
// expect that the joined dataset would be 1,2,3,4
const fixture = [
['Column A', 'Column B'],
['a', '1'],
[null, '2'],
[null, '3'],
[null, '4'],
['b', '5'],
[null, '6'],
];
cy.loadAndVisitProject(fixture);
cy.window().then(($win) => {
cy.stub($win, 'prompt').returns(',');
});
cy.columnActionClick('Column B', [
'Edit cells',
'Join multi-valued cells...',
]);
cy.assertGridEquals([
['Column A', 'Column B'],
['a', '1,2,3,4'],
['b', '5,6'],
]);
});
});

View File

@ -0,0 +1,96 @@
describe(__filename, function () {
it('Test a split by separator', function () {
const fixture = [
['A column'],
['b_0_0***b_0_1***b_0_2'],
['b_1_0***b_1_1***b_1_2'],
];
cy.loadAndVisitProject(fixture);
// click
cy.columnActionClick('A column', [
'Edit cells',
'Split multi-valued cells...',
]);
cy.get('.dialog-container label').contains('by separator').click();
cy.get('.dialog-container input[bind="separatorInput"]').type('***');
cy.confirmDialogPanel();
cy.assertGridEquals([
['A column'],
['b_0_0'],
['b_0_1'],
['b_0_2'],
['b_1_0'],
['b_1_1'],
['b_1_2'],
]);
});
it('Test a split by regex', function () {
// each cell contains a number between letters, we will split by \d which is the regex for any int
const fixture = [['A column'], ['a1b2c'], ['d3e4f']];
cy.loadAndVisitProject(fixture);
cy.columnActionClick('A column', [
'Edit cells',
'Split multi-valued cells...',
]);
cy.get('.dialog-container label').contains('by separator').click();
cy.get('.dialog-container input[bind="separatorInput"]').type('\\d');
cy.get('.dialog-container label').contains('regular expression').click();
cy.confirmDialogPanel();
cy.assertGridEquals([
['A column'],
['a'],
['b'],
['c'],
['d'],
['e'],
['f'],
]);
});
it('Test a split by field length', function () {
const fixture = [['A column'], ['BUTTER,WITH SALT']];
cy.loadAndVisitProject(fixture);
cy.columnActionClick('A column', [
'Edit cells',
'Split multi-valued cells...',
]);
cy.get('.dialog-container').should('to.contain', 'Split multi-valued');
cy.get('.dialog-container textarea[bind="lengthsTextarea"]').type('2,4,8');
cy.get('.dialog-container label').contains('by field lengths').click();
cy.confirmDialogPanel();
cy.assertGridEquals([['A column'], ['BU'], ['TTER'], [',WITH SA']]);
});
it('Test a split by transition from lowercase to uppercase (with the example from the UX)', function () {
const fixture = [['A column'], ['11AbcDef22']];
cy.loadAndVisitProject(fixture);
cy.columnActionClick('A column', [
'Edit cells',
'Split multi-valued cells...',
]);
cy.get('.dialog-container input[value="cases"]').check();
cy.confirmDialogPanel();
cy.assertGridEquals([['A column'], ['11Abc'], ['Def22']]);
});
it('Test a split by transition from numbers to letters', function () {
const fixture = [['A column'], ['Abcdef1Abcdef2Abcdef3']];
cy.loadAndVisitProject(fixture);
cy.columnActionClick('A column', [
'Edit cells',
'Split multi-valued cells...',
]);
cy.get('.dialog-container input[value="number"]').check();
cy.confirmDialogPanel();
cy.assertGridEquals([['A column'], ['Abcdef1'], ['Abcdef2'], ['Abcdef3']]);
});
});

View File

@ -160,41 +160,37 @@ Cypress.Commands.add('assertCellEquals', (rowIndex, columnName, value) => {
* )
*/
Cypress.Commands.add('assertGridEquals', (values) => {
// 1. Collect headers first
const columnNames = [];
cy.get('.data-table thead th.column-header', { log: false }).then(
($headers) => {
cy.wrap($headers, { log: false }).each(($header) => {
const columnName = $header.text().trim();
if (columnName != 'All') {
columnNames.push(columnName);
}
});
}
);
// 2. Collect grid content and make one single assertion with deep.equal
const gridValues = [];
cy.get('.data-table tbody tr', { log: false })
.each(($row) => {
// cy.log($row.index());
const rowIndex = $row.index();
gridValues[rowIndex] = [];
cy.wrap($row, { log: false })
.find('td', { log: false })
.each(($td) => {
// cy.log($td.index());
if ($td.index() > 2) {
gridValues[rowIndex][$td.index() - 3] = $td.text().trim();
if (gridValues[rowIndex][$td.index() - 3] == 'null') {
gridValues[rowIndex][$td.index() - 3] = '';
}
}
});
})
.then(() => {
gridValues.unshift(columnNames);
expect(gridValues).to.deep.equal(values);
});
/**
* This assertion is performed inside a should() method
* So it will be retried until the timeout expires
* "Should()" expect assertions to be made, so promises can't be used
* Hence the use of Jquery with the Cypress.$ wrapper, to collect values for headers and grid cells
*/
cy.get('table.data-table').should((table) => {
const headers = Cypress.$('table.data-table th')
.filter(function (index, element) {
return element.innerText != 'All';
})
.map(function (index, element) {
return element.innerText;
})
.get();
const cells = Cypress.$('table.data-table tbody tr')
.map(function (i, el) {
return [
Cypress.$('td', el)
.filter((index) => index > 2)
.map(function (index, element) {
return element.innerText;
})
.get(),
];
})
.get();
const fullTable = [headers, ...cells];
expect(fullTable).to.deep.equal(values);
});
});
/**