Merge pull request #162 from zimmerman-team/feat/DX-1484

feat: DX-1484 Write new test cases to prevent regression [End-to-End]
zimmerman-team · Jun 14, 2024 · f43b9f3 · f43b9f3
2 parents 597e85b + ea59cca
commit f43b9f3
Show file tree

Hide file tree

Showing 12 changed files with 241 additions and 3 deletions.
diff --git a/cypress/e2e/1-dx/2-datasets.cy.ts b/cypress/e2e/1-dx/2-datasets.cy.ts
@@ -31,6 +31,22 @@ describe("Testing connecting data on DX", () => {
     cy.get('[data-cy="home-connect-dataset-button"]').click();
   });
 
+  it("Can filter results by source in the federated search", () => {
+    cy.intercept(`${apiUrl}/external-sources/search?q=*`).as("getDefaultData");
+    cy.wait("@getDefaultData").then((interception) => {
+      cy.get('[data-cy="external-search-card-Kaggle"]').should(
+        "have.length.greaterThan",
+        1
+      );
+    });
+
+    cy.contains('[data-cy="source-category-button"]', "WHO").click();
+    cy.wait("@getDefaultData");
+
+    cy.get('[data-cy="external-search-card-Kaggle"]').should("have.length", 0);
+    cy.get('[data-cy="external-search-card-WHO"]').should("be.visible");
+  });
+
   it("Can import data from External Search", () => {
     cy.intercept(`${apiUrl}/external-sources/search?q=*`).as("getDefaultData");
 

diff --git a/cypress/e2e/1-dx/4-reports.cy.ts b/cypress/e2e/1-dx/4-reports.cy.ts
@@ -241,6 +241,33 @@ describe("Edit, duplicate and delete report", () => {
     cy.contains(`${reportTestName} - Edited`).should("be.visible");
   });
 
+  it("Can drag and drop rows in a report", () => {
+    cy.get("[data-cy=home-search-button]").click();
+    cy.get("[data-cy=home-search-input]").type(
+      `{selectall}{backspace}${reportTestName}`
+    );
+
+    cy.wait("@fetchReports");
+
+    cy.contains('[data-cy="report-grid-item"]', `${reportTestName} - Edited`)
+      .first()
+      .scrollIntoView()
+      .within(() => {
+        cy.get('[data-cy="report-grid-item-menu-btn"]').click();
+      });
+
+    cy.intercept(`${apiUrl}/report/*`).as("fetchReport");
+
+    cy.get('[data-cy="report-grid-item-edit-btn"]').click();
+
+    cy.wait("@fetchReport");
+
+    cy.get('[data-cy="row-frame-container-0"]').within(() => {
+      cy.get('[data-cy="row-frame-handle"]').drag();
+    });
+    cy.get('[data-cy="report-row-placeholder"]').eq(2).scrollIntoView().drop();
+  });
+
   it("Can Duplicate a report", () => {
     cy.get("[data-cy=home-search-button]").click();
     cy.get("[data-cy=home-search-input]").type(
@@ -386,6 +413,101 @@ describe("Edit, duplicate and delete report", () => {
     );
   });
 
+  it("Can edit a chart from a report", () => {
+    cy.get("[data-cy=home-search-button]").click();
+    cy.get("[data-cy=home-search-input]").type(
+      `{selectall}{backspace}${reportTestName}`
+    );
+
+    cy.wait("@fetchReports");
+
+    cy.contains(
+      '[data-cy="report-grid-item"]',
+      `${reportTestName} - Edited (Copy)`
+    )
+      .first()
+      .scrollIntoView()
+      .within(() => {
+        cy.get('[data-cy="report-grid-item-menu-btn"]').click();
+      });
+
+    cy.intercept(`${apiUrl}/report/*`).as("fetchReport");
+
+    cy.get('[data-cy="report-grid-item-edit-btn"]').click();
+
+    cy.wait("@fetchReport");
+
+    cy.intercept(`${apiUrl}/chart/*`).as("renderChart");
+    cy.intercept(`${apiUrl}/chart/*/render`).as("renderChart2");
+
+    cy.get('[data-cy="row-frame-chart-item-0-1"]')
+      .trigger("mouseover")
+      .within(() => {
+        cy.get('[data-cy="edit-chart-button"]').click();
+      });
+
+    cy.wait("@renderChart");
+    cy.wait("@renderChart2");
+
+    cy.get('[data-cy="chart-toolbox-mapping-tab"]')
+      .invoke("attr", "disabled", false)
+      .trigger("mouseover")
+      .click();
+
+    cy.get('[data-cy="chart-toolbox-mapping-tab"]').click();
+
+    cy.location("pathname").should("include", "/mapping");
+    cy.intercept(`${apiUrl}/chart/*`).as("saveChart2");
+
+    cy.get('[data-cy="report-sub-header-title-input"]').type(
+      `{selectall}{backspace}${chartTestName}-Edited`
+    );
+
+    cy.get('[data-cy="nonstatic-dimension-container"]')
+      .first()
+      .within(() => {
+        cy.get('[data-cy="chart-dimension-mapping-item"]').click();
+      });
+
+    cy.get('[data-cy="chart-dimension-mapping-item"]').eq(2).click();
+
+    cy.intercept(`${apiUrl}/chart/*/render`).as("renderChart");
+
+    cy.get('[data-cy="chart-dimension-mapping-item"]').first().click();
+
+    cy.wait("@renderChart");
+
+    cy.get('[data-cy="common-chart-container"]').should("be.visible");
+
+    cy.get('[data-cy="toolbox-chart-next"]').click();
+
+    // cy.wait("@renderChart");
+
+    cy.get('[data-cy="toolbox-chart-next"]').click();
+
+    // cy.wait("@renderChart");
+
+    cy.get('[data-cy="toolbox-chart-next"]').click();
+
+    cy.wait("@saveChart2");
+
+    cy.intercept(`${apiUrl}/charts?filter=*`).as("fetchCharts");
+
+    cy.get('[data-cy="back-to-report-button"]').click();
+
+    cy.wait("@fetchCharts");
+
+    cy.get('[data-cy="report-panel-chart-search-input"]').type(
+      `${chartTestName}-Edited`
+    );
+    cy.wait("@fetchCharts");
+
+    cy.contains(
+      '[data-cy="report-panel-chart-item"]',
+      `${chartTestName}-Edited`
+    ).should("be.visible");
+  });
+
   it("Can delete a report", () => {
     cy.intercept("DELETE", `${apiUrl}/report/*`).as("deleteReport");
 

diff --git a/cypress/e2e/1-dx/5-dashboard.cy.ts b/cypress/e2e/1-dx/5-dashboard.cy.ts
@@ -0,0 +1,89 @@
+/// <reference types="cypress" />
+
+describe("Dashboard", () => {
+  const apiUrl = Cypress.env("api_url");
+  beforeEach(() => {
+    cy.intercept("GET", `${apiUrl}/assets**`).as("fetchAssets");
+    cy.intercept("GET", `${apiUrl}/datasets?filter=*`).as("fetchDatasets");
+    cy.intercept("GET", `${apiUrl}/charts*`).as("fetchCharts");
+    cy.intercept(`${apiUrl}/reports?filter=*`).as("fetchReports");
+
+    cy.restoreLocalStorageCache();
+    cy.visit("/");
+
+    cy.get('[data-cy="cookie-btn"]').click();
+  });
+
+  it("Can view all asset types on the dashboard", () => {
+    cy.get('[data-cy="home-all-tab"]').scrollIntoView().click();
+    cy.wait("@fetchAssets");
+    cy.get('[data-cy="dataset-grid-item"]').should("be.visible");
+    cy.get('[data-cy="report-grid-item"]').should("be.visible");
+    cy.get('[data-cy="dataset-grid-item"]').should("be.visible");
+  });
+
+  it("Can filter datasets by category", () => {
+    cy.get('[data-cy="home-data-tab"]').scrollIntoView().click();
+    cy.wait("@fetchDatasets");
+
+    cy.contains('[data-cy="dataset-category-button"]', "Social").click();
+    cy.wait("@fetchDatasets");
+
+    cy.get('[data-cy="dataset-grid-item"]').should(
+      "have.length.greaterThan",
+      0
+    );
+  });
+  it("Can get to assets from the table view", () => {
+    cy.get('[data-cy="home-all-tab"]').scrollIntoView().click();
+    cy.wait("@fetchAssets");
+
+    cy.get('[data-cy="home-table-view-button"]').click();
+
+    cy.get('[data-cy="homepage-table"]').within(() => {
+      cy.get('[data-cy="table-row-chart"]').first().click();
+    });
+
+    cy.location("pathname").should("include", "/chart/");
+    cy.visit("/");
+
+    cy.get('[data-cy="home-data-tab"]').scrollIntoView().click();
+    cy.wait("@fetchDatasets");
+
+    cy.get('[data-cy="home-table-view-button"]').click();
+
+    cy.get('[data-cy="homepage-table"]').within(() => {
+      cy.get('[data-cy="table-row-dataset"]').first().click();
+    });
+
+    cy.location("pathname").should("include", "/dataset/");
+
+    cy.visit("/");
+
+    cy.get('[data-cy="home-charts-tab"]').scrollIntoView().click();
+    cy.wait("@fetchCharts");
+
+    cy.get('[data-cy="home-table-view-button"]').click();
+
+    cy.get('[data-cy="homepage-table"]').within(() => {
+      cy.get('[data-cy="table-row-chart"]').first().click();
+    });
+
+    cy.location("pathname").should("include", "/chart/");
+
+    cy.visit("/");
+
+    cy.get('[data-cy="home-reports-tab"]').scrollIntoView().click();
+    cy.wait("@fetchReports");
+
+    cy.get('[data-cy="home-table-view-button"]').click();
+
+    cy.get('[data-cy="homepage-table"]').within(() => {
+      cy.get('[data-cy="table-row-report"]').first().click();
+    });
+
+    cy.location("pathname").should("include", "/report/");
+
+    cy.visit("/");
+  });
+});
diff --git a/cypress/e2e/1-dx/5-home.cy.ts → cypress/e2e/1-dx/6-home.cy.ts b/cypress/e2e/1-dx/5-home.cy.ts → cypress/e2e/1-dx/6-home.cy.ts
diff --git a/cypress/support/e2e.ts b/cypress/support/e2e.ts
@@ -14,7 +14,7 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
+import "./commands";
 
 // Alternatively you can use CommonJS syntax:
-// require('./commands')
+// require('./commands')
diff --git a/src/app/modules/dataset-upload-module/component/externalSourcesList.tsx b/src/app/modules/dataset-upload-module/component/externalSourcesList.tsx
@@ -59,6 +59,7 @@ export default function SourceCategoryList(props: Readonly<Props>) {
               props.setSources(fSource);
             }
           }}
+          data-cy="source-category-button"
           style={
             props.sources.includes(s.value)
               ? {

diff --git a/src/app/modules/home-module/components/Datasets/datasetCategoryList.tsx b/src/app/modules/home-module/components/Datasets/datasetCategoryList.tsx
@@ -56,6 +56,7 @@ export default function DatasetCategoryList(props: Readonly<Props>) {
               props.setCategories(fCategory);
             }
           }}
+          data-cy="dataset-category-button"
           style={
             props.categories.includes(c)
               ? {

diff --git a/src/app/modules/home-module/components/Table/index.tsx b/src/app/modules/home-module/components/Table/index.tsx
@@ -54,6 +54,7 @@ export function HomepageTable(props: {
             }
           }
         `}
+        data-cy="homepage-table"
       >
         <TableHead
           css={`
@@ -98,6 +99,7 @@ export function HomepageTable(props: {
                   background: #f1f3f5;
                 }
               `}
+              data-cy={`table-row-${data.type}`}
             >
               <TableCell>{index + 1}</TableCell>
               <TableCell>{data.name}</TableCell>

diff --git a/src/app/modules/home-module/index.tsx b/src/app/modules/home-module/index.tsx
@@ -371,6 +371,7 @@ export default function HomeModule() {
                     setTableView(!tableView);
                   }}
                   css={iconButtonCss(tableView)}
+                  data-cy="home-table-view-button"
                 >
                   <GridIcon />
                 </IconButton>

diff --git a/src/app/modules/report-module/components/order-container/index.tsx b/src/app/modules/report-module/components/order-container/index.tsx
@@ -70,6 +70,7 @@ export function ItemComponent(props: ItemComponentProps) {
             ? "none"
             : "flex"};
         `}
+        data-cy="row-frame-handle"
       >
         <RowFrameHandleAdornment />
       </div>

diff --git a/src/app/modules/report-module/sub-module/rowStructure/rowStructureDisplay.tsx b/src/app/modules/report-module/sub-module/rowStructure/rowStructureDisplay.tsx
@@ -551,6 +551,7 @@ const Box = (props: {
             ref={textResizableRef}
             onMouseEnter={() => setDisplayBoxIcons(true)}
             onMouseLeave={() => setDisplayBoxIcons(false)}
+            data-cy={`row-frame-text-item-${props.rowIndex}-${props.itemIndex}`}
           >
             {!viewOnlyMode && displayBoxIcons && (
               <IconButton
@@ -626,6 +627,7 @@ const Box = (props: {
             onMouseLeave={() => setDisplayBoxIcons(false)}
             onFocus={() => setDisplayBoxIcons(true)}
             onBlur={() => setDisplayBoxIcons(false)}
+            data-cy={`row-frame-chart-item-${props.rowIndex}-${props.itemIndex}`}
           >
             {!viewOnlyMode && displayBoxIcons && (
               <div>
@@ -662,6 +664,7 @@ const Box = (props: {
                 </IconButton>
                 <IconButton
                   onClick={handleEditChart}
+                  data-cy="edit-chart-button"
                   css={`
                     top: 12px;
                     z-index: 1;
@@ -727,6 +730,7 @@ const Box = (props: {
           <div
             onMouseEnter={() => setDisplayBoxIcons(true)}
             onMouseLeave={() => setDisplayBoxIcons(false)}
+            data-cy={`row-frame-video-item-${props.rowIndex}-${props.itemIndex}`}
           >
             {!viewOnlyMode && displayBoxIcons && (
               <IconButton
@@ -808,6 +812,7 @@ const Box = (props: {
           <div
             onMouseEnter={() => setDisplayBoxIcons(true)}
             onMouseLeave={() => setDisplayBoxIcons(false)}
+            data-cy={`row-frame-image-item-${props.rowIndex}-${props.itemIndex}`}
           >
             {!viewOnlyMode && displayBoxIcons && (
               <IconButton

diff --git a/src/app/modules/report-module/views/edit/index.tsx b/src/app/modules/report-module/views/edit/index.tsx
@@ -290,7 +290,7 @@ function ReportEditView(props: ReportEditViewProps) {
 
           {props.framesArray?.map((frame, index) => {
             return (
-              <div key={frame.id}>
+              <div key={frame.id} data-cy={`row-frame-container-${index}`}>
                 {index === 0 && (
                   <PlaceHolder
                     index={index}
-Original file line number
+Diff line change
@@ Expand Up @@
                   props.setSources(fSource);
                 }
               }}
+              data-cy="source-category-button"
               style={
                 props.sources.includes(s.value)
                   ? {
@@ Expand Down @@