fleet/frontend/components/queries/QueryProgressDetails/QueryProgressDetails.tests.jsx

import React from "react";
import { mount } from "enzyme";
import { noop } from "lodash";

import { campaignStub } from "test/stubs";
import QueryProgressDetails from "./QueryProgressDetails";

describe("QueryProgressDetails - component", () => {
  const DEFAULT_CAMPAIGN = {
    hosts_count: {
      total: 0,
    },
  };

  const defaultProps = {
    campaign: DEFAULT_CAMPAIGN,
    onRunQuery: noop,
    onStopQuery: noop,
    query: "select * from users",
    queryIsRunning: false,
  };

  describe("rendering", () => {
    const DefaultComponent = mount(<QueryProgressDetails {...defaultProps} />);

    it("renders", () => {
      expect(DefaultComponent.length).toEqual(
        1,
        "QueryProgressDetails did not render"
      );
    });

    it("renders a Run Query Button", () => {
      const RunQueryButton = DefaultComponent.find(
        ".query-progress-details__run-btn"
      );

      expect(RunQueryButton.length).toBeGreaterThan(
        0,
        "RunQueryButton did not render"
      );
    });

    it("does not render a Stop Query Button", () => {
      const StopQueryButton = DefaultComponent.find(
        ".query-progress-details__stop-btn"
      );

      expect(StopQueryButton.length).toEqual(
        0,
        "StopQueryButton is not expected to render"
      );
    });

    it("does not render a Timer component", () => {
      const Timer = DefaultComponent.find("Timer");

      expect(Timer.length).toEqual(0, "Timer is not expected to render");
    });

    it("does not render a ProgressBar component", () => {
      const ProgressBar = DefaultComponent.find("ProgressBar");

      expect(ProgressBar.length).toEqual(
        0,
        "ProgressBar is not expected to render"
      );
    });

    describe("when the campaign has results", () => {
      describe("and the query is running", () => {
        const props = {
          ...defaultProps,
          campaign: campaignStub,
          queryIsRunning: true,
        };

        const Component = mount(<QueryProgressDetails {...props} />);

        it("renders a Timer component", () => {
          const Timer = Component.find("Timer");

          expect(Timer.length).toEqual(1, "Timer is expected to render");
        });

        it("renders a Stop Query Button", () => {
          const StopQueryButton = Component.find(
            ".query-progress-details__stop-btn"
          );

          expect(StopQueryButton.length).toBeGreaterThan(
            0,
            "StopQueryButton is expected to render"
          );
        });

        it("does not render a Run Query Button", () => {
          const RunQueryButton = Component.find(
            ".query-progress-details__run-btn"
          );

          expect(RunQueryButton.length).toEqual(
            0,
            "RunQueryButton is not expected render"
          );
        });

        it("renders a ProgressBar component", () => {
          const ProgressBar = Component.find("ProgressBar");

          expect(ProgressBar.length).toEqual(
            1,
            "ProgressBar is expected to render"
          );
        });
      });

      describe("and the query is not running", () => {
        const props = {
          ...defaultProps,
          campaign: campaignStub,
          queryIsRunning: false,
        };
        const Component = mount(<QueryProgressDetails {...props} />);

        it("does not render a Timer component", () => {
          const Timer = Component.find("Timer");

          expect(Timer.length).toEqual(0, "Timer is not expected to render");
        });

        it("does not render a Stop Query Button", () => {
          const StopQueryButton = Component.find(
            ".query-progress-details__stop-btn"
          );

          expect(StopQueryButton.length).toEqual(
            0,
            "StopQueryButton is not expected to render"
          );
        });

        it("renders a Run Query Button", () => {
          const RunQueryButton = Component.find(
            ".query-progress-details__run-btn"
          );

          expect(RunQueryButton.length).toBeGreaterThan(
            0,
            "RunQueryButton did not render"
          );
        });

        it("renders a ProgressBar component", () => {
          const ProgressBar = Component.find("ProgressBar");

          expect(ProgressBar.length).toEqual(
            1,
            "ProgressBar is expected to render"
          );
        });
      });
    });
  });

  describe("when the campaign is empty", () => {
    describe("and the query is running", () => {
      const noResults = { failed: 0, successful: 0, total: 0 };
      const campaignWithNoResults = Object.assign({}, campaignStub, {
        hosts_count: noResults,
      });
      const props = {
        ...defaultProps,
        campaign: campaignWithNoResults,
        queryIsRunning: true,
      };
      const Component = mount(<QueryProgressDetails {...props} />);

      it("renders a ProgressBar component", () => {
        const ProgressBar = Component.find("ProgressBar");

        expect(ProgressBar.length).toEqual(
          1,
          "ProgressBar is expected to render"
        );
      });
    });
  });

  describe("running a query", () => {
    it("calls the onRunQuery prop with the query text", () => {
      const spy = jest.fn();
      const props = {
        ...defaultProps,
        campaign: campaignStub,
        onRunQuery: spy,
      };
      const Component = mount(<QueryProgressDetails {...props} />);
      const RunQueryButton = Component.find(".query-progress-details__run-btn");

      RunQueryButton.hostNodes().simulate("click");

      expect(spy).toHaveBeenCalled();
    });
  });

  describe("stopping a query", () => {
    it("calls the onStopQuery prop", () => {
      const spy = jest.fn();
      const props = {
        ...defaultProps,
        campaign: campaignStub,
        onStopQuery: spy,
        queryIsRunning: true,
      };
      const Component = mount(<QueryProgressDetails {...props} />);
      const StopQueryButton = Component.find(
        ".query-progress-details__stop-btn"
      );

      StopQueryButton.hostNodes().simulate("click");

      expect(spy).toHaveBeenCalled();
    });
  });
});