chore(tests): fix some recent Cypress flaky E2E tests in OData (#1222)

ghiscoding · Jun 8, 2024 · 8d256b9 · 8d256b9
1 parent 87c39fb
commit 8d256b9
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 21 deletions.
diff --git a/packages/demo/src/examples/slickgrid/example31.ts b/packages/demo/src/examples/slickgrid/example31.ts
@@ -412,6 +412,7 @@ export class Example31 {
   // ---
 
   changeCountEnableFlag() {
+    this.displaySpinner(true);
     this.isCountEnabled = !this.isCountEnabled;
     this.resetOptions({ enableCount: this.isCountEnabled });
     return true;
@@ -430,12 +431,14 @@ export class Example31 {
   }
 
   setOdataVersion(version: number) {
+    this.displaySpinner(true);
     this.odataVersion = version;
     this.resetOptions({ version: this.odataVersion });
     return true;
   }
 
   private resetOptions(options: Partial<OdataOption>) {
+    this.displaySpinner(true);
     const odataService = this.gridOptions.backendServiceApi!.service as GridOdataService;
     odataService.updateOptions(options);
     odataService.clearFilters();

diff --git a/packages/demo/src/examples/slickgrid/example5.ts b/packages/demo/src/examples/slickgrid/example5.ts
@@ -479,6 +479,7 @@ export class Example5 {
   }
 
   private resetOptions(options: Partial<OdataOption>) {
+    this.displaySpinner(true);
     const odataService = this.gridOptions.backendServiceApi!.service as GridOdataService;
     odataService.updateOptions(options);
     odataService.clearFilters();

diff --git a/packages/demo/src/examples/slickgrid/example6.ts b/packages/demo/src/examples/slickgrid/example6.ts
@@ -377,6 +377,7 @@ export class Example6 {
   }
 
   private resetOptions(options: Partial<GraphqlServiceOption>) {
+    this.displaySpinner(true);
     const graphqlService = this.gridOptions.backendServiceApi!.service as GraphqlService;
     this.aureliaGrid.paginationService!.setCursorBased(options.useCursor!);
     graphqlService.updateOptions(options);

diff --git a/test/cypress/e2e/example05.cy.ts b/test/cypress/e2e/example05.cy.ts
@@ -303,6 +303,24 @@ describe('Example 5 - OData Grid', () => {
         .should('have.length', 1);
     });
 
+    it('should return 3 rows using "C*n" (starts with "C" + ends with "n")', () => {
+      cy.get('input.filter-name')
+        .clear()
+        .type('C*n');
+
+      // wait for the query to finish
+      cy.get('[data-test=status]').should('contain', 'finished');
+
+      cy.get('[data-test=odata-query-result]')
+        .should(($span) => {
+          expect($span.text()).to.eq(`$count=true&$top=10&$filter=(startswith(Name, 'C') and endswith(Name, 'n'))`);
+        });
+
+      cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Carroll Buchanan');
+      cy.get(`[style="top: ${GRID_ROW_HEIGHT * 1}px;"] > .slick-cell:nth(1)`).should('contain', 'Consuelo Dickson');
+      cy.get(`[style="top: ${GRID_ROW_HEIGHT * 2}px;"] > .slick-cell:nth(1)`).should('contain', 'Christine Compton');
+    });
+
     it('should perform filterQueryOverride when operator "%%" is selected', () => {
       cy.get('.search-filter.filter-name select').find('option').last().then((element) => {
         cy.get('.search-filter.filter-name select').select(element.val());
@@ -402,6 +420,7 @@ describe('Example 5 - OData Grid', () => {
       cy.get('#items-per-page-label').select('20');
 
       cy.get('[data-test=enable-count]').click();
+      cy.get('[data-test=enable-count]').should('not.be.checked');
 
       // wait for the query to finish
       cy.get('[data-test=status]').should('contain', 'finished');
@@ -865,32 +884,13 @@ describe('Example 5 - OData Grid', () => {
       cy.get('[data-test=total-items]')
         .contains('50');
     });
-
-    it('should return 2 rows using "C*n" (starts with "C" + ends with "n")', () => {
-      cy.get('input.filter-name')
-        .clear()
-        .type('C*n');
-
-      // wait for the query to finish
-      cy.get('[data-test=status]').should('contain', 'finished');
-
-      cy.get('[data-test=odata-query-result]')
-        .should(($span) => {
-          expect($span.text()).to.eq(`$top=10&$orderby=Name desc&$filter=(Gender eq 'female' and startswith(Name, 'C') and endswith(Name, 'n'))`);
-        });
-
-      cy.get(`[style="top: ${GRID_ROW_HEIGHT * 0}px;"] > .slick-cell:nth(1)`).should('contain', 'Consuelo Dickson');
-      cy.get(`[style="top: ${GRID_ROW_HEIGHT * 1}px;"] > .slick-cell:nth(1)`).should('contain', 'Christine Compton');
-
-      // clear filter before next test
-      cy.get('input.filter-name')
-        .clear();
-    });
   });
 
   describe('Select and Expand Behaviors', () => {
     it('should enable "enableSelect" and "enableExpand" and expect the query to select/expand all fields', () => {
       cy.get('[data-test=enable-expand]').click();
+      cy.get('[data-test=enable-expand]').should('be.checked');
+      cy.wait(5);
 
       // wait for the query to finish
       cy.get('[data-test=status]').should('contain', 'finished');
@@ -901,6 +901,7 @@ describe('Example 5 - OData Grid', () => {
         });
 
       cy.get('[data-test=enable-select]').click();
+      cy.get('[data-test=enable-select]').should('be.checked');
 
       // wait for the query to finish
       cy.get('[data-test=status]').should('contain', 'finished');