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

Applicaster Zapp React Native ui components for the Quick Brick App

import React from "react";
import { screen } from "@testing-library/react-native";
import { renderWithProviders } from "@applicaster/zapp-react-native-utils/testUtils";

import { ScreenResolver } from "../../ScreenResolver";
import { RiverComponent } from "../River";

jest.mock(
  "@applicaster/zapp-react-native-ui-components/Components/GeneralContentScreen",
  () => {
    const { View } = jest.requireActual("react-native");

    return {
      GeneralContentScreen: (props) => (
        <View testID="general-content-screen" {...props} />
      ),
    };
  }
);

jest.mock(
  "@applicaster/zapp-react-native-utils/analyticsUtils/helpers/hooks",
  () => ({
    useScreenAnalytics: jest.fn(),
  })
);

jest.mock(
  "@applicaster/zapp-react-native-utils/reactHooks/navigation/useNavigation",
  () => ({
    useNavigation: jest.fn(() => ({
      videoModalState: {
        mode: "test",
      },
    })),
  })
);

jest.mock(
  "@applicaster/zapp-react-native-utils/reactHooks/navigation/useIsScreenActive",
  () => ({
    useIsScreenActive: jest.fn(() => true),
  })
);

const river = {
  home: true,
  id: "A1234",
  name: "foo",
  type: "general_content",
  ui_components: [
    {
      component_type: "hero",
    },
    {
      component_type: "grid",
    },
  ],
};

const riverWithScreenPlugin = {
  home: false,
  id: "C0987",
  name: "Some-Screen-Plugin",
  type: "some-screen-plugin",
  ui_components: [],
};

const rivers = {
  A1234: river,
  B4567: { id: "B4567" },
  C0987: riverWithScreenPlugin,
};

const contexts = {
  setScreenTitle: () => {},
  setScreenSummary: () => {},
  setIsScreenWrappedInContainer: () => {},
};

const riverProps = {
  river,
  ...contexts,
  groupId: "ZF-C4",
};

const appData = { layoutVersion: "v1" };

const store = { rivers, appData };

describe("When River has a general_content type", () => {
  it("renders GeneralContentScreen correctly", () => {
    const { getByTestId } = renderWithProviders(
      <RiverComponent {...riverProps} />,
      store
    );

    expect(getByTestId("general-content-screen")).toBeTruthy();
  });
});

describe("When River has any other type other than general_content", () => {
  const riverPropsWithScreenPlugin = {
    river: riverWithScreenPlugin,
    ...contexts,
    appData,
  };

  it("renders ScreenResolver correctly", () => {
    renderWithProviders(<RiverComponent {...riverPropsWithScreenPlugin} />);

    expect(screen.UNSAFE_getByType(ScreenResolver)).toBeDefined();
  });
});

describe("When River has feed url", () => {
  const riverPropsWithFeedUrl = {
    river,
    ...contexts,
    feedUrl: "https://some-feed-url.net",
    appData: { layoutVersion: "v1" },
  };

  it("renders FeedLoader when layout is v1", () => {
    const wrapper = renderWithProviders(
      <RiverComponent {...riverPropsWithFeedUrl} />,
      {
        zappPipes: {
          "https://some-feed-url.net": {
            loading: false,
            data: { entry: [] },
          },
        },
      }
    );

    expect(wrapper.getByTestId("general-content-screen")).toBeDefined();
  });
});