/**
 * TEAM: frontend_infra
 * @flow
 */
// TODO: Fix this eslint issue on next edit. This is an autogenerated comment.
// eslint-disable-next-line flexport/no-legacy-dependencies
import {mount} from "enzyme";

import TextInput from "../TextInput";
import {getNameFromStyle} from "../tools/test";
import {inputStyles} from "../styles/input";

function mountTextInput(propOverrides: {...} = {}) {
  const defaultProps = {
    value: "Starting value...",
    onChange: () => {},
  };

  // $FlowFixMe[cannot-spread-inexact] upgrade 0.121.1 -> 0.122.0
  const mergedProps = {
    ...defaultProps,
    ...propOverrides,
  };
  return mount(<TextInput {...mergedProps} />);
}

const getInputNode = (textInput: any) => textInput.find("input").get(0);
describe("TextInput", () => {
  describe("handles various state booleans", () => {
    it("disabled renders properly", () => {
      const textInput = mountTextInput({disabled: true});
      expect(getInputNode(textInput).props.disabled).toBe(true);
    });
    it("isInvalid renders properly", () => {
      const textInput = mountTextInput({isInvalid: true});
      expect(
        getInputNode(textInput).props.className.indexOf(
          getNameFromStyle(inputStyles.isInvalid)
        )
      ).toBeGreaterThan(-1);
    });
    it("renders placeholder text", () => {
      const placeholder = "Placeholder";
      const textInput = mountTextInput({placeholder});
      expect(getInputNode(textInput).props.placeholder).toEqual(placeholder);
    });
  });
  describe("onFn's function as expected", () => {
    it("onChange is called when the user types", () => {
      const mockOnChange = jest.fn();
      const textInput = mountTextInput({onChange: mockOnChange});
      const newValue = "a"; // letter a
      textInput.find("input").simulate("change", {
        target: {
          value: newValue,
        },
      });
      expect(mockOnChange.mock.calls.length).toEqual(1);
      expect(mockOnChange.mock.calls[0][0]).toBe(newValue);
    });
  });
});