@applicaster/zapp-react-native-ui-components/Components/TextInputTv/__tests__/TextInputTv.test.js

Applicaster Zapp React Native ui components for the Quick Brick App

import React from "react";
import TestRenderer from "react-test-renderer";

jest.mock("react-native", () => {
  const RNMock = jest.genMockFromModule("react-native");
  const { TextInput } = jest.requireActual("react-native");

  return {
    ...RNMock,
    TextInput,
    Platform: {
      OS: "samsung_tv",
      isTV: true,
    },
  };
});

jest.mock("@applicaster/zapp-react-native-utils/localizationUtils", () => ({
  useIsRTL: jest.fn(() => false),
}));

const { TextInputTv } = require("../");
const { Platform, TextInput } = require("react-native");

describe("<TextInputTv />", () => {
  it("renders", () => {
    const testInstance = TestRenderer.create(<TextInputTv />);
    expect(testInstance.toJSON).toBeTruthy();
  });

  describe("on native", () => {
    beforeEach(() => {
      Platform.OS = "ios";
    });

    it("returns React-Native TextInput component if not on samsung", () => {
      const testInstance = TestRenderer.create(<TextInputTv />);
      expect(testInstance.root.findByType(TextInput)).toBeTruthy();
    });
  });

  describe("on samsung", () => {
    beforeEach(() => {
      Platform.OS = "samsung_tv";
    });

    it("returns React input component if on samsung", () => {
      const testInstance = TestRenderer.create(<TextInputTv type="samsung" />);
      expect(testInstance.root.findByType("input")).toBeTruthy();
    });

    it("flattens styles", () => {
      Platform.OS = "samsung_tv";
      const style = [{ width: 200 }, { height: 200 }];
      const testInstance = TestRenderer.create(<TextInputTv style={style} />);

      expect(typeof testInstance.root.findByType("input").props.style).toBe(
        "object"
      );
    });

    it("maps onChangeText to onChange", () => {
      Platform.OS = "samsung_tv";
      const onChangeText = jest.fn();

      const testInstance = TestRenderer.create(
        <TextInputTv onChangeText={onChangeText} />
      );

      const inputInstance = testInstance.root.findByType("input");
      expect(inputInstance.props.onChange).toBeDefined();
      expect(inputInstance.props.onChangeText).toBeUndefined();
    });

    it("it polyfills the behaviour of onChangeText", () => {
      Platform.OS = "samsung_tv";
      const onChangeText = jest.fn();

      const testInstance = TestRenderer.create(
        <TextInputTv onChangeText={onChangeText} />
      );

      const inputInstance = testInstance.root.findByType("input");
      const value = "foobar";
      inputInstance.props.onChange({ target: { value: value } });
      expect(onChangeText).toBeCalledWith(value);
    });

    it("maps onEndEditing to onBlur", () => {
      Platform.OS = "samsung_tv";

      const testInstance = TestRenderer.create(
        <TextInputTv onEndEditing={() => null} />
      );

      const inputInstance = testInstance.root.findByType("input");
      expect(inputInstance.props.onBlur).toBeDefined();
      expect(inputInstance.props.onEndEditing).toBeUndefined();
    });

    it("maps onPress to onClick", () => {
      Platform.OS = "samsung_tv";

      const testInstance = TestRenderer.create(
        <TextInputTv onPress={() => null} />
      );

      const inputInstance = testInstance.root.findByType("input");
      expect(inputInstance.props.onClick).toBeDefined();
      expect(inputInstance.props.onPress).toBeUndefined();
    });

    it("replaces secureTextEntry with type:'password'", () => {
      Platform.OS = "samsung_tv";

      const testInstance = TestRenderer.create(
        <TextInputTv secureTextEntry={true} />
      );

      const inputInstance = testInstance.root.findByType("input");
      expect(inputInstance.props.type).toBe("password");
    });

    it("removes 'onChangeText', 'secureTextEntry', 'onEndEditing', 'onPress' props", () => {
      Platform.OS = "samsung_tv";

      const testInstance = TestRenderer.create(
        <TextInputTv onChangeText secureTextEntry onEndEditing />
      );

      const inputInstance = testInstance.root.findByType("input");
      expect(inputInstance.props.onChangeText).toBeUndefined();
      expect(inputInstance.props.secureTextEntry).toBeUndefined();
      expect(inputInstance.props.onEndEditing).toBeUndefined();
    });
  });
});