Controller notion removed from test cases and support for coverage added

Author: shubhamBansal

dashboard/package.json

@@ -37,7 +37,7 @@
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
-    "test": "react-scripts test",
+    "test": "react-scripts test --coverage",
     "eject": "react-scripts eject"
   },
   "jest":{

dashboard/src/modules/components/DatePickerComponent/DatePicker.test.js

@@ -14,17 +14,26 @@ jest.mock("utils/api", () => {
   return {
     get: () => ({
       data: MOCK_DATA,
+      status:200
     }),
   };
 });
 test("data is filtered based on date range selected from date picker", async () => {
   render(<AppWrapper />);
-  await screen.findByText("dhcp1");
+  await screen.findByText("pbench_user_benchmark1");
   const datePickerInput = screen.getAllByPlaceholderText(/yyyy-mm-dd/i);
   fireEvent.change(datePickerInput[0], { target: { value: "2022-02-16" } });
   fireEvent.change(datePickerInput[1], { target: { value: "2022-02-20" } });
   const updateBtn = screen.getByRole("button", { name: /update/i });
   fireEvent.click(updateBtn);
-  const cells = screen.getAllByRole("cell");
-  expect(cells).toHaveLength(12);
+  const datasetNameOne = screen.queryByText("pbench_user_benchmark1");
+  const datasetNameTwo = screen.queryByText("pbench_user_benchmark2");
+  const datasetNameThree = screen.queryByText("pbench_user_benchmark3");
+  const datasetNameFour = screen.queryByText("pbench_user_benchmark4");
+  const datasetNameFive = screen.queryByText("pbench_user_benchmark5");
+  expect(datasetNameOne).toBeInTheDocument();
+  expect(datasetNameTwo).toBeInTheDocument();
+  expect(datasetNameThree).toBeInTheDocument();
+  expect(datasetNameFour).not.toBeInTheDocument();
+  expect(datasetNameFive).not.toBeInTheDocument();
 });

dashboard/src/modules/components/HeadingComponent/Heading.test.js

@@ -2,12 +2,7 @@ import { Provider } from "react-redux";
 import store from "store/store";
 import { MOCK_DATA } from "utils/mockData";
 import App from "../../../App";
-const {
-  render,
-  screen,
-  waitFor,
-  fireEvent,
-} = require("@testing-library/react");
+const { render, screen, fireEvent } = require("@testing-library/react");
 const AppWrapper = () => {
   return (
     <Provider store={store}>
@@ -19,21 +14,34 @@ jest.mock("utils/api", () => {
   return {
     get: () => ({
       data: MOCK_DATA,
+      status: 200,
     }),
   };
 });
-
+test("Page heading is displayed on initial load", async () => {
+  render(<AppWrapper />);
+  await screen.findByText("pbench_user_benchmark1");
+  const heading = screen.getByRole("heading", { name: /results/i });
+  expect(heading).toBeInTheDocument();
+});
 test("data from API is displayed on initial load", async () => {
   render(<AppWrapper />);
-  const benchmarkName = await screen.findByText("pbench_user_benchmark1");
-  const cells = await screen.findAllByRole("cell");
-  await waitFor(() => expect(benchmarkName).toBeInTheDocument());
-  await waitFor(() => expect(cells).toHaveLength(20));
+  await screen.findByText("pbench_user_benchmark1");
+  const datasetNameOne = screen.queryByText("pbench_user_benchmark1");
+  const datasetNameTwo = screen.queryByText("pbench_user_benchmark2");
+  const datasetNameThree = screen.queryByText("pbench_user_benchmark3");
+  const datasetNameFour = screen.queryByText("pbench_user_benchmark4");
+  const datasetNameFive = screen.queryByText("pbench_user_benchmark5");
+  expect(datasetNameOne).toBeInTheDocument();
+  expect(datasetNameTwo).toBeInTheDocument();
+  expect(datasetNameThree).toBeInTheDocument();
+  expect(datasetNameFour).toBeInTheDocument();
+  expect(datasetNameFive).toBeInTheDocument();
 });
 
 test("row is favorited after clicking on favorite icon", async () => {
   render(<AppWrapper />);
-  await screen.findByText("dhcp1");
+  await screen.findByText("pbench_user_benchmark1");
   const starBtn = screen.getAllByRole("button", {
     name: /not starred/i,
   });
@@ -43,6 +51,28 @@ test("row is favorited after clicking on favorite icon", async () => {
     name: /see favorites button/i,
   });
   fireEvent.click(favoriteBtn);
-  const favoriteCell = screen.getAllByRole("cell");
-  expect(favoriteCell).toHaveLength(8);
+  const datasetNameOne = screen.queryByText("pbench_user_benchmark1");
+  const datasetNameTwo = screen.queryByText("pbench_user_benchmark2");
+  const datasetNameThree = screen.queryByText("pbench_user_benchmark3");
+  const datasetNameFour = screen.queryByText("pbench_user_benchmark4");
+  const datasetNameFive = screen.queryByText("pbench_user_benchmark5");
+  expect(datasetNameOne).toBeInTheDocument();
+  expect(datasetNameTwo).toBeInTheDocument();
+  expect(datasetNameThree).not.toBeInTheDocument();
+  expect(datasetNameFour).not.toBeInTheDocument();
+  expect(datasetNameFive).not.toBeInTheDocument();
+});
+test("data is filtered based on value in search box", async () => {
+  render(<AppWrapper />);
+  await screen.findByText("pbench_user_benchmark1");
+  const searchBox = screen.getByPlaceholderText(/search dataset/i);
+  fireEvent.change(searchBox, { target: { value: "pbench_user_benchmark2" } });
+  const searchBtn = screen.getByRole("button", {
+    name: /searchButton/i,
+  });
+  fireEvent.click(searchBtn);
+  const datasetNameTwo = screen.queryByText("pbench_user_benchmark2");
+  const datasetNameThree = screen.queryByText("pbench_user_benchmark3");
+  expect(datasetNameTwo).toBeInTheDocument();
+  expect(datasetNameThree).not.toBeInTheDocument();
 });

dashboard/src/modules/components/SearchComponent/Search.test.js

@@ -26,11 +26,11 @@ import DatePickerWidget from "../DatePickerComponent";
 import PathBreadCrumb from "../BreadCrumbComponent";
 import { LoginHint, Heading, EmptyTable, SearchBox } from "./common-components";
 import { getTodayMidnightUTCDate } from "utils/dateFunctions";
+import { bumpToDate } from "utils/dateFunctions";
 
 let startDate = new Date(Date.UTC(1990, 10, 4));
-let endDate = getTodayMidnightUTCDate();
+let endDate = bumpToDate(getTodayMidnightUTCDate(),1);
 let datasetName = "";
-let dataArray = [];
 
 const TableWithFavorite = () => {
   const columnNames = {
@@ -51,7 +51,7 @@ const TableWithFavorite = () => {
     dispatch(getFavoritedDatasets());
   }, [dispatch]);
 
-  const { publicData, favoriteRepoNames } = useSelector(
+  const { publicData, favoriteRepoNames,tableData } = useSelector(
     (state) => state.datasetlist
   );
   const setPublicData = (data) => {
@@ -141,20 +141,17 @@ const TableWithFavorite = () => {
 
       <PageSection variant={PageSectionVariants.light}>
         <PathBreadCrumb pathList={datasetBreadcrumb} />
-        <Heading
-          containerClass="publicDataPageTitle"
-          headingTitle="Results"
-        />
+        <Heading containerClass="publicDataPageTitle" headingTitle="Results" />
         <div className="filterContainer">
           <SearchBox
-            dataArray={dataArray}
+            dataArray={tableData}
             setPublicData={setPublicData}
             startDate={startDate}
             endDate={endDate}
             setDatasetName={setDatasetName}
           />
           <DatePickerWidget
-            dataArray={dataArray}
+            dataArray={tableData}
             setPublicData={setPublicData}
             datasetName={datasetName}
             setDateRange={setDateRange}
@@ -167,13 +164,15 @@ const TableWithFavorite = () => {
             isSelected={isSelected === "datasetListButton"}
             onChange={handleButtonClick}
             className="datasetListButton"
+            aria-label="see dataset button"
           />
           <ToggleGroupItem
             text={`Favorites(${favoriteRepoNames?.length})`}
             buttonId="favoriteListButton"
             isSelected={isSelected === "favoriteListButton"}
             onChange={handleButtonClick}
             className="favoriteListButton"
+            aria-label="see favorites button"
           />
         </ToggleGroup>
         <TableComposable aria-label="Favoritable table" variant="compact">

dashboard/src/modules/components/SearchComponent/index.jsx

@@ -1,34 +1,29 @@
 export const MOCK_DATA = [
   {
-    controller: "dhcp1",
     name: "pbench_user_benchmark1",
     metadata: {
       "dataset.created": "2022-02-16T13:21:29+00:00",
     },
   },
   {
-    controller: "dhcp2",
     name: "pbench_user_benchmark2",
     metadata: {
       "dataset.created": "2022-02-18T13:21:29+00:00",
     },
   },
   {
-    controller: "dhcp3",
     name: "pbench_user_benchmark3",
     metadata: {
       "dataset.created": "2022-02-20T13:21:29+00:00",
     },
   },
   {
-    controller: "dhcp4",
     name: "pbench_user_benchmark4",
     metadata: {
       "dataset.created": "2022-02-25T13:21:29+00:00",
     },
   },
   {
-    controller: "dhcp5",
     name: "pbench_user_benchmark5",
     metadata: {
       "dataset.created": "2022-03-08T13:21:29+00:00",