diff --git a/packages/demo/src/examples/slickgrid/example13.ts b/packages/demo/src/examples/slickgrid/example13.ts index 0ca187d66..2ee5e4b52 100644 --- a/packages/demo/src/examples/slickgrid/example13.ts +++ b/packages/demo/src/examples/slickgrid/example13.ts @@ -59,7 +59,7 @@ export class Example13 { defineGrid() { this.columnDefinitions = [ { - id: 'sel', name: '#', field: 'num', width: 40, + id: 'sel', name: '#', field: 'num', width: 40, type: FieldType.number, excludeFromExport: true, maxWidth: 70, resizable: true, @@ -178,6 +178,13 @@ export class Example13 { excelExportOptions: { sanitizeDataExport: true }, textExportOptions: { sanitizeDataExport: true }, externalResources: [this.excelExportService, this.textExportService], + showCustomFooter: true, + customFooterOptions: { + // optionally display some text on the left footer container + hideMetrics: false, + hideTotalItemCount: false, + hideLastUpdateTimestamp: false + }, }; } diff --git a/test/cypress/e2e/example13.cy.ts b/test/cypress/e2e/example13.cy.ts index 10a65d219..fd6233778 100644 --- a/test/cypress/e2e/example13.cy.ts +++ b/test/cypress/e2e/example13.cy.ts @@ -73,4 +73,113 @@ describe('Example 13 - Grouping & Aggregators', () => { .find('.slick-cell:nth(3)').contains('Avg: '); }); }); + + describe('Diverse Input Text Filters with multiple symbol variances', () => { + it('should clear all Groupings', () => { + cy.get('[data-test="clear-grouping-btn"]').click(); + }); + + it('should return 500 rows using "Ta*33" (starts with "Ta" + ends with 33)', () => { + cy.get('.search-filter.filter-title') + .clear() + .type('Ta*3'); + + cy.get('.item-count') + .should('contain', 5000); + + cy.get('.search-filter.filter-title') + .clear() + .type('Ta*33'); + + cy.get('.item-count') + .should('contain', 500); + + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 33'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 1}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 133'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 2}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 233'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 3}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 333'); + }); + + it('should return 40000 rows using "Ta*" (starts with "Ta")', () => { + cy.get('.search-filter.filter-title') + .clear() + .type('Ta*'); + + cy.get('.item-count') + .should('contain', 50000); + + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 0'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 1}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 1'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 2}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 2'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 3}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 3'); + }); + + it('should return 500 rows using "*11" (ends with "11")', () => { + cy.get('.search-filter.filter-title') + .clear() + .type('*11'); + + cy.get('.item-count') + .should('contain', 500); + + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 1'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 1}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 11'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 2}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 21'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 3}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 31'); + }); + + it('should return 497 rows using ">222" (greater than 222)', () => { + cy.get('.search-filter.filter-sel') + .clear() + .type('>222'); + + cy.get('.item-count') + .should('contain', 497); + + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 311'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 1}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 411'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 2}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 511'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 3}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 611'); + }); + + it('should return 499 rows using "<>311" (not equal to 311)', () => { + cy.get('.search-filter.filter-sel') + .clear() + .type('<>311'); + + cy.get('.item-count') + .should('contain', 499); + + cy.get('.search-filter.filter-sel') + .clear() + .type('!=311'); + + cy.get('.item-count') + .should('contain', 499); + + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 11'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 1}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 111'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 2}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 211'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 3}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 411'); + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 4}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 511'); + }); + + it('should return 1 rows using "=311" or "==311" (equal to 311)', () => { + cy.get('.search-filter.filter-sel') + .clear() + .type('=311'); + + cy.get('.item-count') + .should('contain', 1); + + cy.get('.search-filter.filter-sel') + .clear() + .type('==311'); + + cy.get('.item-count') + .should('contain', 1); + + cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Task 311'); + }); + }); });