test(filter): Add test for the new filter feature

cypress/integration/datatable_spec.js

@@ -95,7 +95,7 @@ describe('DataTable', function () {
         });
 
         it('mouse selection', function () {
-            // TODO
+            // TODO:
             // cy.getCell(2, 1)
             //     .trigger('mousedown', { which: 1, pageX: 331, pageY: 207, force: true })
             //     .trigger('mousemove', { which: 1, pageX: 489, pageY: 312 })
@@ -162,4 +162,51 @@ describe('DataTable', function () {
             cy.get('.dt-toast').contains('1 row selected');
         });
     });
+
+    describe('Inline Filters', function () {
+        before(function () {
+            cy.visit('/');
+        });
+
+        beforeEach(function () {
+            cy.get('.dt-filter[data-col-index=5]').as('filterInput5');
+        });
+
+        afterEach(function () {
+            cy.get('@filterInput5').clear();
+            cy.get('.dt-row[data-row-index=0]').should('be.visible');
+        });
+
+        it('simple text filter', function () {
+            cy.getCell(4, 0).click().type('{ctrl}f');
+
+            cy.get('.dt-filter[data-col-index=4]').as('filterInput4').type('edin');
+            cy.get('.dt-row[data-row-index=0]').should('be.visible');
+            cy.get('.dt-row[data-row-index=1]').should('not.be.visible');
+            cy.get('@filterInput4').clear();
+
+            cy.get('@filterInput5').type('15');
+            cy.get('.dt-row[data-row-index=2]').should('be.visible');
+            cy.get('.dt-row[data-row-index=15]').should('be.visible');
+            cy.get('.dt-row[data-row-index=22]').should('not.be.visible');
+        });
+
+        it('greater than', function () {
+            cy.get('@filterInput5').type('> 6000');
+            cy.get('.dt-row[data-row-index=0]').should('not.be.visible');
+            cy.get('.dt-row[data-row-index=3]').should('be.visible');
+        });
+
+        it('less than', function () {
+            cy.get('@filterInput5').type('< 2000');
+            cy.get('.dt-row[data-row-index=0]').should('not.be.visible');
+            cy.get('.dt-row[data-row-index=51]').should('be.visible');
+        });
+
+        it('range', function () {
+            cy.get('@filterInput5').type(' 2000: 5000');
+            cy.get('.dt-row[data-row-index=4]').should('not.be.visible');
+            cy.get('.dt-row[data-row-index=5]').should('be.visible');
+        });
+    });
 });

cypress/support/commands.js

@@ -47,3 +47,12 @@ Cypress.Commands.add('clickDropdownItem', (col, item) => {
         .find(`.dt-dropdown__list-item:contains("${item}")`)
         .click({ force: true });
 });
+
+Cypress.Commands.add('typeTab', (shiftKey, ctrlKey) => {
+    cy.focused().trigger('keydown', {
+        keyCode: 9,
+        which: 9,
+        shiftKey: shiftKey,
+        ctrlKey: ctrlKey
+    });
+});