progress bar test

fabiothiroki · May 1, 2021 · d13dbf5 · d13dbf5
1 parent 2168f3b
commit d13dbf5
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 10 deletions.
diff --git a/src/components/AirportSelector/tests/AirPortSelector.test.js b/src/components/AirportSelector/tests/AirPortSelector.test.js
@@ -7,7 +7,7 @@ import mockAirportResponse from "../../../services/Airport/test/mockAirportRepon
 import AirportSelector from "../AirportSelector";
 
 const server = setupServer(
-  rest.get("https://api.skypicker.com/locations", (req, res, ctx) =>
+  rest.get("https://api.skypicker.com/locations", (_req, res, ctx) =>
     res(ctx.json(mockAirportResponse))
   )
 );
@@ -20,29 +20,27 @@ const props = {
 
 const renderComponent = () => {
   const queryClient = new QueryClient();
-  const wrapper = (
+  return render(
     <QueryClientProvider client={queryClient}>
       <AirportSelector {...props} />
     </QueryClientProvider>
   );
-
-  return wrapper;
 };
 
 beforeAll(() => server.listen());
 afterEach(() => server.resetHandlers());
 afterAll(() => server.close());
 
 test("initial render", () => {
-  render(renderComponent());
+  renderComponent();
   const input = screen.getByRole("textbox");
 
   expect(input).toBeInTheDocument();
   expect(input).toHaveValue("");
 });
 
 test("search airport by term", async () => {
-  render(renderComponent());
+  renderComponent();
 
   const input = screen.getByRole("textbox");
   userEvent.type(input, "prag");
@@ -51,7 +49,7 @@ test("search airport by term", async () => {
 });
 
 test("autocomplete suggestions", async () => {
-  render(renderComponent());
+  renderComponent();
 
   const input = screen.getByRole("textbox");
   userEvent.type(input, "prag");
@@ -60,7 +58,7 @@ test("autocomplete suggestions", async () => {
 });
 
 test("select autocomplete suggestion", async () => {
-  render(renderComponent());
+  renderComponent();
 
   const input = screen.getByRole("textbox");
   userEvent.type(input, "prag");
@@ -76,7 +74,7 @@ test("select autocomplete suggestion", async () => {
 });
 
 test("clear autocomplete suggestion", async () => {
-  render(renderComponent());
+  renderComponent();
 
   const input = screen.getByRole("textbox");
   userEvent.type(input, "prag");

diff --git a/src/components/App/tests/App.test.js b/src/components/App/tests/App.test.js
@@ -1,9 +1,11 @@
-import { render, screen, waitFor } from "@testing-library/react";
+import { render, screen, waitFor, fireEvent } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import { rest } from "msw";
 import { setupServer } from "msw/node";
 import { QueryClientProvider, QueryClient } from "react-query";
 import mockAirportResponse from "../../../services/Airport/test/mockAirportReponse";
 import App from "../App";
+import FORM_FIELDS from "../../Search/constants";
 
 const server = setupServer(
   rest.get("https://api.skypicker.com/locations", (req, res, ctx) =>
@@ -33,3 +35,27 @@ test("Render form and results", async () => {
     expect(screen.queryByText(/Find cheap flights/i)).toBeInTheDocument();
   });
 });
+
+test("Search submit", async () => {
+  renderComponent();
+
+  userEvent.type(screen.getByRole("textbox", { name: "From" }), "prag");
+  userEvent.click(await screen.findByText(/prague/i));
+
+  userEvent.type(screen.getByRole("textbox", { name: "To" }), "prag");
+  userEvent.click(await screen.findByText(/prague/i));
+
+  fireEvent.change(screen.getByTestId(FORM_FIELDS.DEPARTURE_DATE), {
+    target: { value: "2020-05-13" },
+  });
+
+  fireEvent.change(screen.getByTestId(FORM_FIELDS.RETURN_DATE), {
+    target: { value: "2020-05-15" },
+  });
+
+  fireEvent.submit(screen.getByTestId("submitButton"));
+
+  await waitFor(() => {
+    expect(screen.getByRole("progressbar")).toBeInTheDocument();
+  });
+});