EVG-20766: Fix test_table flake (#2029)

evergreen-ci · Sep 14, 2023 · 49be716 · 49be716
1 parent 9157744
commit 49be716
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 23 deletions.
diff --git a/README.md b/README.md
@@ -159,10 +159,12 @@ on localhost:9090 for the front-end to work.
 In order to run the Cypress tests, do the following, assuming you have this repo
 checked out and all the dependencies installed by yarn:
 
-1. Start the evergreen back-end with the sample local test data. You can do this
+1. Increase the limit on open files by running `ulimit -n 64000` before running mongod
+   in the same shell.
+2. Start the evergreen back-end with the sample local test data. You can do this
    by typing `make local-evergreen` in your evergreen folder.
-2. Start the Spruce local server by typing `yarn build:local && yarn serve` in this repo.
-3. Run Cypress by typing one of the following:
+3. Start the Spruce local server by typing `yarn build:local && yarn serve` in this repo.
+4. Run Cypress by typing one of the following:
    - `yarn cy:open` - opens the Cypress app in interactive mode. You can select
      tests to run from here in the Cypress browser.
    - `yarn cy:run` - runs all the Cypress tests at the command-line and reports

diff --git a/cypress/integration/task/test_table.ts b/cypress/integration/task/test_table.ts
@@ -5,9 +5,16 @@ import {
 } from "../../utils";
 
 describe("Tests Table", () => {
+  const visitAndWait = (url: string) => {
+    cy.visit(url);
+    cy.dataCy("tests-table")
+      .should("be.visible")
+      .should("not.have.attr", "data-loading", "true");
+  };
+  beforeEach(() => {
+    visitAndWait(TESTS_ROUTE);
+  });
   it("Test count should update to reflect filtered values", () => {
-    cy.visit(TESTS_ROUTE);
-
     cy.contains(TABLE_SORT_SELECTOR, "Name").click();
 
     cy.dataCy("filtered-count").contains(20);
@@ -22,16 +29,15 @@ describe("Tests Table", () => {
     cy.toggleTableFilter(1);
     cy.dataCy("testname-input-wrapper")
       .find("input")
-      .focus()
-      .type("hello")
-      .type("{enter}");
+      .as("testnameInputWrapper")
+      .focus();
+    cy.get("@testnameInputWrapper").type("hello{enter}");
 
     cy.dataCy("filtered-count").contains(0);
     cy.dataCy("total-count").contains(20);
   });
 
   it("Adjusts query params when table headers are clicked", () => {
-    cy.visit(TESTS_ROUTE);
     cy.contains(TABLE_SORT_SELECTOR, "Name").click();
     cy.location().should((loc) => {
       expect(loc.pathname).to.equal(TESTS_ROUTE);
@@ -70,7 +76,7 @@ describe("Tests Table", () => {
 
   describe("Test Status Selector", () => {
     beforeEach(() => {
-      cy.visit(TESTS_ROUTE);
+      visitAndWait(TESTS_ROUTE);
     });
 
     it("Clicking on 'All' checkbox adds all statuses to URL", () => {
@@ -103,17 +109,16 @@ describe("Tests Table", () => {
 
   describe("Test Name Filter", () => {
     const testNameInputValue = "group";
-    beforeEach(() => {
-      cy.visit(TESTS_ROUTE);
-    });
 
     it("Typing in test name filter updates testname query param", () => {
+      visitAndWait(TESTS_ROUTE);
       cy.toggleTableFilter(1);
       cy.dataCy("testname-input-wrapper")
         .find("input")
-        .focus()
-        .type(testNameInputValue)
-        .type("{enter}");
+        .as("testnameInputWrapper")
+        .focus();
+      cy.get("@testnameInputWrapper").type(testNameInputValue);
+      cy.get("@testnameInputWrapper").type("{enter}");
       cy.location().should((loc) => {
         expect(loc.search).to.include(`testname=${testNameInputValue}`);
       });
@@ -122,7 +127,7 @@ describe("Tests Table", () => {
 
   describe("Changing page number", () => {
     it("Displays the next page of results and updates URL when right arrow is clicked and next page exists", () => {
-      cy.visit(`${TESTS_ROUTE}?limit=10`);
+      visitAndWait(`${TESTS_ROUTE}?limit=10`);
       cy.dataCy("pagination").first().should("contain.text", "1 / 2");
       clickOnPageBtnAndAssertURLandTableResults(
         dataCyNextPage,
@@ -132,7 +137,7 @@ describe("Tests Table", () => {
     });
 
     it("Does not update results or URL when right arrow is clicked and next page does not exist", () => {
-      cy.visit(`${TESTS_ROUTE}?limit=10&page=1`);
+      visitAndWait(`${TESTS_ROUTE}?limit=10&page=1`);
       cy.dataCy("pagination").first().should("contain.text", "2 / 2");
       clickOnPageBtnAndAssertURLandTableResults(
         dataCyNextPage,
@@ -142,7 +147,7 @@ describe("Tests Table", () => {
     });
 
     it("Displays the previous page of results and updates URL when the left arrow is clicked and previous page exists", () => {
-      cy.visit(`${TESTS_ROUTE}?limit=10&page=1`);
+      visitAndWait(`${TESTS_ROUTE}?limit=10&page=1`);
       cy.dataCy("pagination").first().should("contain.text", "2 / 2");
       clickOnPageBtnAndAssertURLandTableResults(
         dataCyPrevPage,
@@ -152,7 +157,7 @@ describe("Tests Table", () => {
     });
 
     it("Does not update results or URL when left arrow is clicked and previous page does not exist", () => {
-      cy.visit(`${TESTS_ROUTE}?limit=10&page=0`);
+      visitAndWait(`${TESTS_ROUTE}?limit=10&page=0`);
       cy.dataCy("pagination").first().should("contain.text", "1 / 2");
       clickOnPageBtnAndAssertURLandTableResults(
         dataCyPrevPage,
@@ -166,7 +171,7 @@ describe("Tests Table", () => {
     it("Changing page size updates URL and renders less than or equal to that many rows", () => {
       [20, 50, 100].forEach((pageSize) => {
         it(`when the page size is set to ${pageSize}`, () => {
-          cy.visit(`${TESTS_ROUTE}`);
+          visitAndWait(TESTS_ROUTE);
           clickOnPageSizeBtnAndAssertURLandTableSize(pageSize, dataCyTableRows);
         });
       });
@@ -179,7 +184,7 @@ const DESCEND_PARAM = "sortDir=DESC";
 const ASCEND_PARAM = "sortDir=ASC";
 const TESTS_ROUTE =
   "/task/evergreen_ubuntu1604_test_model_patch_5e823e1f28baeaa22ae00823d83e03082cd148ab_5e4ff3abe3c3317e352062e4_20_02_21_15_13_48/tests";
-const dataCyTableRows = "[data-test-id=tests-table] tr td:first-child";
+const dataCyTableRows = "[data-cy=tests-table] tr td:first-child";
 const longTestName =
   "suuuuuupppppaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa-loooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonnnnnnnnnnnnnnnnnggggggggggggggggggggggggg name";
 

diff --git a/src/pages/task/taskTabs/TestsTable.tsx b/src/pages/task/taskTabs/TestsTable.tsx
@@ -164,7 +164,7 @@ export const TestsTable: React.FC<TestsTableProps> = ({ task }) => {
       shouldShowBottomTableControl={filteredTestCount > 10}
     >
       <Table
-        data-test-id="tests-table"
+        data-cy="tests-table"
         rowKey={rowKey}
         pagination={false}
         columns={columns}