@applicaster/quick-brick-player 16.0.0-rc.11 → 16.0.0-rc.111

package/src/Player/PlayerModal/__tests__/VideoPlayerModal.test.tsx

@@ -0,0 +1,160 @@
+import React from "react";
+import { Text } from "react-native";
+import { act, render, screen } from "@testing-library/react-native";
+
+/**
+ * The modal's fullscreen layout is not directly observable, but the collapsed
+ * bar is: it renders only while the modal is NOT in that layout. Every case
+ * below therefore reads `collapsedBarWrapper` as the proxy for the state under
+ * test.
+ *
+ * Why it matters: while the modal sits in the fullscreen layout, a drag still
+ * drives navigation to MINIMIZED, which docks the player and hides the native
+ * controls (see Player/index.tsx `shouldUseNativeControls`). If the layout
+ * cannot follow the mode back out, the modal is stranded on top of the tab bar
+ * with no controls and no way to restore them.
+ */
+
+let mockIsTabletLandscape = false;
+let orientationListener: ((event: any) => void) | null = null;
+const mockRemove = jest.fn();
+
+const mockAddOrientationChangeListener = jest.fn((cb) => {
+  orientationListener = cb;
+
+  return { remove: mockRemove };
+});
+
+jest.mock(
+  "@applicaster/zapp-react-native-utils/appUtils/orientationHelper",
+  () => ({
+    addOrientationChangeListener: (cb) => mockAddOrientationChangeListener(cb),
+  })
+);
+
+jest.mock(
+  "@applicaster/zapp-react-native-utils/reactHooks/device/useMemoizedIsTablet",
+  () => ({ useIsTabletLandscape: () => mockIsTabletLandscape })
+);
+
+jest.mock("@applicaster/zapp-react-native-utils/reactHooks", () => ({
+  useIsTablet: () => mockIsTabletLandscape,
+}));
+
+jest.mock(
+  "@applicaster/zapp-react-native-ui-components/Components/VideoModal/utils",
+  () => ({ useConfiguration: () => ({ minimised_height: 60 }) })
+);
+
+jest.mock(
+  "@applicaster/zapp-react-native-ui-components/Components/VideoModal/ModalAnimation/utils",
+  () => ({ PROGRESS_BAR_HEIGHT: 3 })
+);
+
+jest.mock("react-native-safe-area-context", () => {
+  const { View } = require("react-native");
+
+  return {
+    SafeAreaView: View,
+    useSafeAreaFrame: () => ({ x: 0, y: 0, width: 1024, height: 768 }),
+    useSafeAreaInsets: () => ({ top: 24, bottom: 34, left: 0, right: 0 }),
+  };
+});
+
+jest.mock("../GestureAnimatedScrollView", () => {
+  const { ScrollView } = require("react-native");
+
+  return { GestureAnimatedScrollView: ScrollView };
+});
+
+jest.mock("../styles", () => ({
+  useStyles: () => ({
+    modal: {},
+    modalWrapper: {},
+    collapsedModalBg: {},
+    modalContent: {},
+    modalContentPiP: {},
+    expandedContentContainer: {},
+    extraContentScrollView: {},
+    collapsedBarContainer: {},
+    collapsedBarWrapper: {},
+    flexNone: {},
+  }),
+}));
+
+jest.mock("../hooks", () => ({
+  useVideoModalState: () => ({
+    collapsed: false,
+    offset: { current: 700 },
+    gestureHandlerProps: {},
+    translateY: new (require("react-native").Animated.Value)(0),
+    expand: jest.fn(),
+  }),
+}));
+
+// eslint-disable-next-line import/first
+import { VideoPlayerModal } from "../VideoPlayerModal";
+
+const renderModal = (props = {}) =>
+  render(
+    <VideoPlayerModal
+      modal
+      content={<Text>content</Text>}
+      collapsedContent={<Text>collapsed</Text>}
+      style={{ width: 1024, height: 768, tabletLandscapeWidth: 600 }}
+      {...props}
+    />
+  );
+
+const collapsedBar = () => screen.queryByTestId("collapsedBarWrapper");
+
+beforeEach(() => {
+  jest.clearAllMocks();
+  orientationListener = null;
+  mockIsTabletLandscape = false;
+});
+
+describe("VideoPlayerModal fullscreen layout", () => {
+  describe("on a tablet in landscape", () => {
+    beforeEach(() => {
+      mockIsTabletLandscape = true;
+    });
+
+    it("leaves the orientation listener alone, since landscape is its regular orientation", () => {
+      renderModal();
+
+      expect(mockAddOrientationChangeListener).not.toHaveBeenCalled();
+    });
+
+    it("follows the mode back out of fullscreen", () => {
+      const { rerender } = renderModal({ fullscreen: true });
+
+      expect(collapsedBar()).toBeNull();
+
+      rerender(
+        <VideoPlayerModal
+          modal
+          fullscreen={false}
+          content={<Text>content</Text>}
+          collapsedContent={<Text>collapsed</Text>}
+          style={{ width: 1024, height: 768, tabletLandscapeWidth: 600 }}
+        />
+      );
+
+      expect(collapsedBar()).not.toBeNull();
+    });
+  });
+
+  describe("on a phone", () => {
+    it("still lets orientation drive the layout", () => {
+      renderModal();
+
+      expect(mockAddOrientationChangeListener).toHaveBeenCalled();
+      expect(collapsedBar()).not.toBeNull();
+
+      act(() => orientationListener?.({ toOrientation: 4 }));
+
+      expect(collapsedBar()).toBeNull();
+    });
+  });
+});

package/src/Player/__tests__/getNativeProps.test.ts

@@ -0,0 +1,115 @@
+import VideoPlayer from "../index";
+import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils";
+
+/**
+ * Pins where `getNativeProps()`'s `metadata` object comes from: the player
+ * manager's content channel, looked up by `props.playerId`.
+ *
+ * This deliberately does NOT depend on tree position. An earlier version read
+ * the values from `PlayerContainerContext` via `static contextType`, which
+ * made native's props depend on `Player` being rendered inside
+ * `PlayerContainerContextProvider` - safe only as long as an exhaustive
+ * render-site search stayed true. Reading from the manager removes that whole
+ * class of fragility, so the tests below assert the value's source rather than
+ * a render-site invariant.
+ *
+ * Lookup is by id rather than `getActivePlayer()` because these props are
+ * handed to this component's own native view: they must describe that player
+ * even while a cast session is running.
+ *
+ * The instance is constructed directly (bypassing `render()`/mount) so this
+ * exercises the real `getNativeProps()` without paying for a full render of
+ * the ~37KB `VideoPlayer` class tree.
+ */
+
+jest.mock("@applicaster/zapp-react-native-utils/appUtils", () => ({
+  ...jest.requireActual("@applicaster/zapp-react-native-utils/appUtils"),
+  playerManager: {
+    getPlayerWithId: jest.fn(),
+  },
+}));
+
+const entry = {
+  id: "1",
+  title: "Entry Title",
+  summary: "Entry Summary",
+} as unknown as ZappEntry;
+
+const baseProps = {
+  entry,
+  pluginConfiguration: {},
+  docked: false,
+  fullscreen: false,
+  inline: false,
+  isModal: false,
+  isTabletPortrait: false,
+  muted: false,
+  playerId: "player-1",
+  PlayerComponent: "QuickBrickDefaultPlayerView",
+} as unknown as ConstructorParameters<typeof VideoPlayer>[0];
+
+const publishContent = (
+  content: {
+    title: Option<string | number>;
+    summary: Option<string | number>;
+  } | null
+) => {
+  (playerManager.getPlayerWithId as jest.Mock).mockReturnValue(
+    content ? { getContent: () => content } : null
+  );
+};
+
+describe("Player's getNativeProps() reading Title/Subtitle from the manager", () => {
+  it("sends the title/summary the player published", () => {
+    publishContent({
+      title: "Resolved Title",
+      summary: "Resolved Summary",
+    });
+
+    const nativeProps = new VideoPlayer(baseProps).getNativeProps();
+
+    expect(nativeProps.metadata.title).toBe("Resolved Title");
+    expect(nativeProps.metadata.subtitle).toBe("Resolved Summary");
+  });
+
+  it("looks the player up by its own id, not the active player", () => {
+    publishContent({ title: "Resolved Title", summary: "Resolved Summary" });
+
+    new VideoPlayer(baseProps).getNativeProps();
+
+    expect(playerManager.getPlayerWithId).toHaveBeenCalledWith("player-1");
+  });
+
+  it("sends undefined when the player published no text", () => {
+    publishContent({ title: null, summary: null });
+
+    const nativeProps = new VideoPlayer(baseProps).getNativeProps();
+
+    expect(nativeProps.metadata.title).toBeUndefined();
+    expect(nativeProps.metadata.subtitle).toBeUndefined();
+  });
+
+  it("sends undefined rather than crashing when no player is registered", () => {
+    publishContent(null);
+
+    const nativeProps = new VideoPlayer(baseProps).getNativeProps();
+
+    expect(nativeProps.metadata.title).toBeUndefined();
+    expect(nativeProps.metadata.subtitle).toBeUndefined();
+  });
+
+  it("does not fall back to entry.title/entry.summary itself - the resolver owns that fallback", () => {
+    // `entry.title`/`entry.summary` are "Entry Title"/"Entry Summary" (see
+    // `baseProps`); with nothing published, nativeProps must NOT silently pick
+    // those up as a second, redundant fallback layer inside `Player`. The
+    // entry-field fallback lives in `resolvePlayerContentText`, reached
+    // through the player's own `getContent()`.
+    publishContent({ title: null, summary: null });
+
+    const nativeProps = new VideoPlayer(baseProps).getNativeProps();
+
+    expect(nativeProps.metadata.title).not.toBe(entry.title);
+    expect(nativeProps.metadata.subtitle).not.toBe(entry.summary);
+    expect(nativeProps.entry).toBe(entry);
+  });
+});

package/src/Player/__tests__/onTracksChanged.test.ts

@@ -0,0 +1,192 @@
+import VideoPlayer from "../index";
+import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils";
+
+/**
+ * Tests for the track-selection reconciliation logic in `onTracksChanged`.
+ *
+ * The handler uses `resolveReportedTrackId` to prevent an infinite feedback
+ * loop: a transient native "nothing selected" (reported id === undefined)
+ * must NOT clear controlled state when the previous track is still available,
+ * while genuine track changes must still propagate.
+ *
+ * Instances are constructed directly (no render) to keep these tests fast and
+ * focused on the instance method, mirroring the pattern used in
+ * `getNativeProps.test.ts`.
+ */
+
+jest.mock("@applicaster/zapp-react-native-utils/appUtils", () => ({
+  ...jest.requireActual("@applicaster/zapp-react-native-utils/appUtils"),
+  playerManager: {
+    getPlayerWithId: jest.fn(),
+  },
+}));
+
+jest.mock(
+  "@applicaster/zapp-react-native-utils/playerUtils/configurationUtils",
+  () => ({
+    parseLanguageTracks: jest.fn(),
+  })
+);
+
+import { parseLanguageTracks } from "@applicaster/zapp-react-native-utils/playerUtils/configurationUtils";
+
+const baseProps = {
+  entry: { id: "1", title: "Entry Title", summary: "Entry Summary" },
+  pluginConfiguration: {},
+  docked: false,
+  fullscreen: false,
+  inline: false,
+  isModal: false,
+  isTabletPortrait: false,
+  muted: false,
+  playerId: "player-1",
+  PlayerComponent: "QuickBrickDefaultPlayerView",
+} as unknown as ConstructorParameters<typeof VideoPlayer>[0];
+
+const audioTrack = { id: "en-audio", type: "audio" };
+const textTrack = { id: "en-text", type: "text" };
+
+/** Helper: call onTracksChanged with a mocked parseLanguageTracks result. */
+function callOnTracksChanged(
+  instance: VideoPlayer,
+  parsed: {
+    audioTracks?: { id: string; type: string }[];
+    textTracks?: { id: string; type: string }[];
+    audioTrackId?: string | undefined;
+    textTrackId?: string | undefined;
+  }
+) {
+  (parseLanguageTracks as jest.Mock).mockReturnValue({
+    audioTracks: [],
+    textTracks: [],
+    audioTrackId: undefined,
+    textTrackId: undefined,
+    ...parsed,
+  });
+
+  instance.onTracksChanged({ nativeEvent: {} });
+}
+
+describe("onTracksChanged — resolveReportedTrackId reconciliation", () => {
+  beforeEach(() => {
+    (playerManager.getPlayerWithId as jest.Mock).mockReturnValue(null);
+  });
+
+  it("sets audioTrackId and textTrackId when native reports real selections", () => {
+    const instance = new VideoPlayer(baseProps);
+    const setState = jest.spyOn(instance, "setState");
+
+    callOnTracksChanged(instance, {
+      audioTracks: [audioTrack],
+      textTracks: [textTrack],
+      audioTrackId: audioTrack.id,
+      textTrackId: textTrack.id,
+    });
+
+    expect(setState).toHaveBeenCalledWith(
+      expect.objectContaining({
+        audioTrackId: audioTrack.id,
+        textTrackId: textTrack.id,
+      }),
+      expect.any(Function)
+    );
+  });
+
+  it("does NOT clear audioTrackId when native transiently reports undefined and the track is still in the list", () => {
+    const instance = new VideoPlayer(baseProps);
+    // Establish prior selection state without a React reconciler.
+    instance.state = { ...instance.state, audioTrackId: audioTrack.id };
+
+    const setState = jest.spyOn(instance, "setState");
+
+    callOnTracksChanged(instance, {
+      audioTracks: [audioTrack],
+      textTracks: [],
+      audioTrackId: undefined, // transient native blip — nothing selected
+      textTrackId: undefined,
+    });
+
+    // State must NOT change because the resolved id equals the current id.
+    expect(setState).not.toHaveBeenCalled();
+  });
+
+  it("does NOT clear textTrackId when native transiently reports undefined and the track is still in the list", () => {
+    const instance = new VideoPlayer(baseProps);
+    instance.state = { ...instance.state, textTrackId: textTrack.id };
+
+    const setState = jest.spyOn(instance, "setState");
+
+    callOnTracksChanged(instance, {
+      audioTracks: [],
+      textTracks: [textTrack],
+      audioTrackId: undefined,
+      textTrackId: undefined,
+    });
+
+    expect(setState).not.toHaveBeenCalled();
+  });
+
+  it("clears the id when the previously-selected track is no longer present in the list", () => {
+    const instance = new VideoPlayer(baseProps);
+    instance.state = { ...instance.state, audioTrackId: audioTrack.id };
+
+    const setState = jest.spyOn(instance, "setState");
+
+    // Track is gone from the available list.
+    callOnTracksChanged(instance, {
+      audioTracks: [], // track not available anymore
+      textTracks: [],
+      audioTrackId: undefined,
+      textTrackId: undefined,
+    });
+
+    expect(setState).toHaveBeenCalledWith(
+      expect.objectContaining({ audioTrackId: null }),
+      expect.any(Function)
+    );
+  });
+
+  it("propagates a genuine track change to a different id", () => {
+    const newTrack = { id: "fr-audio", type: "audio" };
+    const instance = new VideoPlayer(baseProps);
+    instance.state = { ...instance.state, audioTrackId: audioTrack.id };
+
+    const setState = jest.spyOn(instance, "setState");
+
+    callOnTracksChanged(instance, {
+      audioTracks: [audioTrack, newTrack],
+      textTracks: [],
+      audioTrackId: newTrack.id,
+      textTrackId: undefined,
+    });
+
+    expect(setState).toHaveBeenCalledWith(
+      expect.objectContaining({ audioTrackId: newTrack.id }),
+      expect.any(Function)
+    );
+  });
+
+  it("calls the listener with resolved ids even when state does not change", () => {
+    const instance = new VideoPlayer(baseProps);
+    instance.state = { ...instance.state, audioTrackId: audioTrack.id };
+
+    const onTracksChangedListener = jest.fn();
+
+    (instance as any).props = {
+      ...instance.props,
+      listener: { onTracksChanged: onTracksChangedListener },
+    };
+
+    callOnTracksChanged(instance, {
+      audioTracks: [audioTrack],
+      textTracks: [],
+      audioTrackId: undefined, // transient blip
+      textTrackId: undefined,
+    });
+
+    // notifyListener is called with the resolved (non-null) audioTrackId
+    expect(onTracksChangedListener).toHaveBeenCalledWith(
+      expect.objectContaining({ audioTrackId: audioTrack.id })
+    );
+  });
+});

package/src/Player/__tests__/toNativeMetadata.test.ts

@@ -0,0 +1,77 @@
+import { toNativeMetadata } from "../index";
+
+// `toNativeMetadata` used to be `resolveNativeTitleSubtitle`, which resolved
+// Title/Subtitle from `entry` + `pluginConfiguration` itself (the dot-path /
+// custom-key / fallback logic). That resolution now happens once in
+// `Player.getContent()` (via `resolvePlayerTitleSubtitle`, already covered by
+// `playerUtils/__tests__/resolvePlayerTitleSubtitle.test.ts` and
+// `playerUtils/__tests__/contentDataKeys.test.ts` - custom-key resolution,
+// fallback-when-unresolvable, and entry-non-mutation are all still asserted
+// there). `toNativeMetadata` only adapts the already-resolved
+// `player.getContent()` value into the `metadata` object the native bridge
+// receives, so this file only covers that adaptation: the shape coercion, and
+// the numeric coercion the native bridge specifically needs (it cannot render
+// a number the way `<Text>` can).
+describe("toNativeMetadata", () => {
+  it("returns undefined for both fields when title/summary are null (what the player publishes when there is nothing to show)", () => {
+    expect(toNativeMetadata({ title: null, summary: null })).toEqual({
+      title: undefined,
+      subtitle: undefined,
+    });
+  });
+
+  it("returns undefined for both fields when content itself is undefined", () => {
+    expect(toNativeMetadata(undefined)).toEqual({
+      title: undefined,
+      subtitle: undefined,
+    });
+  });
+
+  it("passes through string title/summary as-is", () => {
+    expect(
+      toNativeMetadata({
+        title: "Resolved Title",
+        summary: "Resolved Summary",
+      })
+    ).toEqual({
+      title: "Resolved Title",
+      subtitle: "Resolved Summary",
+    });
+  });
+
+  it("coerces a numeric title/summary to a string for the native bridge", () => {
+    expect(toNativeMetadata({ title: 0, summary: 42 })).toEqual({
+      title: "0",
+      subtitle: "42",
+    });
+  });
+
+  it("handles title and summary independently (one present, one absent)", () => {
+    expect(toNativeMetadata({ title: "Only Title", summary: null })).toEqual({
+      title: "Only Title",
+      subtitle: undefined,
+    });
+  });
+
+  it("passes the cover image url through", () => {
+    expect(
+      toNativeMetadata({
+        title: "A Title",
+        summary: "A Summary",
+        imageUrl: "https://img.test/base.jpg",
+      })
+    ).toEqual({
+      title: "A Title",
+      subtitle: "A Summary",
+      imageUrl: "https://img.test/base.jpg",
+    });
+  });
+
+  it("sends undefined rather than an empty string when there is no image", () => {
+    // Native treats an empty URI as a load attempt; `undefined` means "none".
+    expect(
+      toNativeMetadata({ title: "A Title", summary: null, imageUrl: null })
+        .imageUrl
+    ).toBeUndefined();
+  });
+});