@applicaster/quick-brick-player 16.0.0-rc.6 → 16.0.0-rc.61

package/src/Player/AudioLayer/__tests__/AudioDescription.test.tsx

@@ -0,0 +1,147 @@
+import React from "react";
+import { StyleSheet } from "react-native";
+import { render } from "@testing-library/react-native";
+
+import { AudioDescription } from "../AudioDescription";
+
+// `title`/`summary` come from the player manager's content channel rather than
+// from props or context, so the hook is mocked here. Read lazily inside the
+// factory: `jest.mock` is hoisted above the `let`, so capturing eagerly would
+// freeze it at `undefined`.
+let mockContent: {
+  title: Option<string | number>;
+  summary: Option<string | number>;
+} = { title: "A Title", summary: "A Summary" };
+
+jest.mock(
+  "@applicaster/zapp-react-native-utils/appUtils/playerManager/usePlayerContent",
+  () => ({ usePlayerContent: () => mockContent })
+);
+
+beforeEach(() => {
+  mockContent = { title: "A Title", summary: "A Summary" };
+});
+
+const layoutState = { inline: false, docked: false, isModal: true };
+
+const valueFrom =
+  (config: Record<string, unknown>): GetValue =>
+  (key: string) =>
+    (config[key] ?? null) as never;
+
+const renderDescription = (
+  config: Record<string, unknown>,
+  state = layoutState
+) =>
+  render(
+    <AudioDescription
+      layoutState={state}
+      value={valueFrom(config)}
+      maxWidth={400}
+    />
+  );
+
+// The wrapper's style prop is an array, so flatten before reading height.
+const wrapperHeight = (tree) =>
+  StyleSheet.flatten(tree.toJSON().props.style).height;
+
+describe("AudioDescription", () => {
+  it("renders both texts when both toggles are on", () => {
+    const { queryByText } = renderDescription({ title: true, subtitle: true });
+
+    expect(queryByText("A Title")).toBeTruthy();
+    expect(queryByText("A Summary")).toBeTruthy();
+  });
+
+  it("hides the title when the title toggle is off", () => {
+    const { queryByText } = renderDescription({ title: false, subtitle: true });
+
+    expect(queryByText("A Title")).toBeNull();
+    expect(queryByText("A Summary")).toBeTruthy();
+  });
+
+  it("hides the summary when the subtitle toggle is off", () => {
+    const { queryByText } = renderDescription({ title: true, subtitle: false });
+
+    expect(queryByText("A Title")).toBeTruthy();
+    expect(queryByText("A Summary")).toBeNull();
+  });
+
+  it("renders neither text when both toggles are off", () => {
+    const { queryByText } = renderDescription({
+      title: false,
+      subtitle: false,
+    });
+
+    expect(queryByText("A Title")).toBeNull();
+    expect(queryByText("A Summary")).toBeNull();
+  });
+
+  it("reserves no height when both toggles are off", () => {
+    const tree = renderDescription({ title: false, subtitle: false });
+
+    expect(wrapperHeight(tree)).toBe(0);
+  });
+
+  it("reserves less height when the title is hidden than when it is shown", () => {
+    const withTitle = renderDescription({ title: true, subtitle: true });
+    const withoutTitle = renderDescription({ title: false, subtitle: true });
+
+    expect(wrapperHeight(withoutTitle)).toBeLessThan(wrapperHeight(withTitle));
+  });
+
+  it("reserves less height when the subtitle is hidden than when it is shown", () => {
+    const withSubtitle = renderDescription({ title: true, subtitle: true });
+    const withoutSubtitle = renderDescription({ title: true, subtitle: false });
+
+    expect(wrapperHeight(withoutSubtitle)).toBeLessThan(
+      wrapperHeight(withSubtitle)
+    );
+  });
+
+  it("reads the docked toggle keys when docked", () => {
+    const { queryByText } = renderDescription(
+      { docked_player_title: true, docked_player_subtitle: false },
+      { ...layoutState, docked: true }
+    );
+
+    expect(queryByText("A Title")).toBeTruthy();
+    expect(queryByText("A Summary")).toBeNull();
+  });
+
+  /**
+   * Live audio resolves its text asynchronously: the channel feed is polled
+   * after playback starts, so the first render has no programme title yet. The
+   * row must hold its place across that transition instead of collapsing and
+   * expanding a second later.
+   */
+  describe("layout stability while the text is still missing", () => {
+    it("reserves the same height with and without text", () => {
+      const withText = renderDescription({ title: true, subtitle: true });
+
+      mockContent = { title: null, summary: null };
+
+      const withoutText = renderDescription({ title: true, subtitle: true });
+
+      expect(wrapperHeight(withoutText)).toBe(wrapperHeight(withText));
+    });
+
+    it("still renders both rows when the text has not arrived", () => {
+      mockContent = { title: null, summary: null };
+
+      const tree = renderDescription({ title: true, subtitle: true });
+
+      expect(wrapperHeight(tree)).toBeGreaterThan(0);
+    });
+
+    it("reserves height for the summary even when only the summary is missing", () => {
+      const withSummary = renderDescription({ title: true, subtitle: true });
+
+      mockContent = { title: "A Title", summary: null };
+
+      const withoutSummary = renderDescription({ title: true, subtitle: true });
+
+      expect(wrapperHeight(withoutSummary)).toBe(wrapperHeight(withSummary));
+    });
+  });
+});

package/src/Player/AudioLayer/__tests__/AudioPlayerWrapper.test.tsx

@@ -0,0 +1,130 @@
+import React from "react";
+import { render } from "@testing-library/react-native";
+
+/**
+ * Covers AudioPlayerWrapper's remaining Title/Subtitle responsibility, which is
+ * only lifecycle: keep the manager's live-content polling running while this
+ * player is mounted. It carries neither the text (consumers read it from the
+ * player manager via `usePlayerContent`) nor any decision about the polling -
+ * whether the content is live, where the channel's programme feed lives and
+ * how often to poll are all `OverlaysObserver`'s.
+ *
+ * The rest of the chain is covered where each link lives:
+ *   - is-live / feed url / interval           OverlayObserver/__tests__/liveContent.test.ts
+ *   - polling -> `observer.liveEntry`         OverlayObserver/__tests__/liveContent.test.ts
+ *   - liveEntry -> published content          playerManager/__tests__/playerContent.test.ts
+ *   - published content -> rendered text      AudioLayer/__tests__/AudioDescription.test.tsx
+ */
+
+const mockStartLiveContentUpdates = jest.fn();
+const mockStopLiveContentUpdates = jest.fn();
+
+const mockPlayer = {
+  getOverlayObservable: () => ({
+    startLiveContentUpdates: mockStartLiveContentUpdates,
+    stopLiveContentUpdates: mockStopLiveContentUpdates,
+  }),
+  addListener: jest.fn(() => jest.fn()),
+  play: jest.fn(),
+  pause: jest.fn(),
+  rewind: jest.fn(),
+  forward: jest.fn(),
+};
+
+let mockIsLive = false;
+
+jest.mock(
+  "@applicaster/zapp-react-native-utils/appUtils/playerManager/usePlayer",
+  () => ({ usePlayer: () => mockPlayer })
+);
+
+jest.mock(
+  "@applicaster/zapp-react-native-utils/appUtils/playerManager/usePlayerState",
+  () => ({
+    usePlayerState: () => ({
+      isLive: mockIsLive,
+      seekableDuration: 0,
+      isReadyToPlay: false,
+      isBuffering: false,
+      isPaused: false,
+    }),
+  })
+);
+
+jest.mock("@applicaster/zapp-react-native-utils/appUtils", () => ({
+  playerManager: {
+    close: jest.fn(),
+    isCasting: jest.fn(() => false),
+  },
+}));
+
+jest.mock("@applicaster/zapp-react-native-utils/reactHooks", () => ({
+  useNavigation: jest.fn(() => ({ maximiseVideoModal: jest.fn() })),
+}));
+
+jest.mock("@applicaster/zapp-react-native-utils/modalState", () => ({
+  useModalStoreState: jest.fn(() => ({ visible: false })),
+  dismissModal: jest.fn(),
+  openBottomSheetModal: jest.fn(),
+}));
+
+jest.mock("../Layout", () => ({
+  __esModule: true,
+  default: () => null,
+}));
+
+import { AudioPlayerWrapper } from "../AudioPlayerWrapper";
+
+const LIVE_ENTRY = {
+  id: "entry-1",
+  title: "Channel Title",
+  summary: "Channel Summary",
+  extensions: {
+    live: { channel_src: "https://feed.test/subClass/audio" },
+  },
+} as any;
+
+const baseProps = {
+  configuration: { audio_live_player_update_interval: 30 },
+  style: { width: 100, height: 100 } as any,
+  entry: LIVE_ENTRY,
+  layoutState: { inline: false, docked: false, isModal: false, pip: false },
+  playNextData: null,
+  children: null,
+};
+
+describe("AudioPlayerWrapper live content polling", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockIsLive = true;
+  });
+
+  it("asks the observer to keep live content fresh while mounted", () => {
+    render(<AudioPlayerWrapper {...baseProps} />);
+
+    expect(mockStartLiveContentUpdates).toHaveBeenCalled();
+  });
+
+  it("stops polling on unmount", () => {
+    const { unmount } = render(<AudioPlayerWrapper {...baseProps} />);
+
+    unmount();
+
+    expect(mockStopLiveContentUpdates).toHaveBeenCalled();
+  });
+
+  it("re-evaluates when the player reports the content is live", () => {
+    // `isLive` is unknown until the player loads, so the effect has to run
+    // again once it settles - the observer decides what to do with it.
+    mockIsLive = false;
+
+    const { rerender } = render(<AudioPlayerWrapper {...baseProps} />);
+
+    mockStartLiveContentUpdates.mockClear();
+    mockIsLive = true;
+
+    rerender(<AudioPlayerWrapper {...baseProps} />);
+
+    expect(mockStartLiveContentUpdates).toHaveBeenCalled();
+  });
+});

package/src/Player/AudioLayer/__tests__/SleepTimerManager.test.ts

@@ -0,0 +1,78 @@
+import { localStorage } from "@applicaster/zapp-react-native-bridge/ZappStorage/LocalStorage";
+import { SLEEP_TIMER_OFF, SleepTimerController } from "../SleepTimerManager";
+
+jest.mock(
+  "@applicaster/zapp-react-native-bridge/ZappStorage/LocalStorage",
+  () => ({
+    localStorage: {
+      getItem: jest.fn(),
+      setItem: jest.fn(),
+      removeItem: jest.fn(),
+    },
+  })
+);
+
+describe("SleepTimerController", () => {
+  const player = {
+    startSleepTimer: jest.fn(),
+    cancelSleepTimer: jest.fn(),
+  };
+
+  let sleepController: SleepTimerController;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    (localStorage.setItem as jest.Mock).mockResolvedValue(undefined);
+    (localStorage.removeItem as jest.Mock).mockResolvedValue(undefined);
+    (localStorage.getItem as jest.Mock).mockResolvedValue(undefined);
+    sleepController = new SleepTimerController(player as any);
+  });
+
+  it("starts from the off state", () => {
+    expect(sleepController.currentState.timer).toEqual(SLEEP_TIMER_OFF);
+  });
+
+  it("starts a sleep timer on the constructed player", async () => {
+    await sleepController.setSleepTimer({
+      label: "15 minutes",
+      value: 15,
+    });
+
+    expect(player.cancelSleepTimer).toHaveBeenCalled();
+    expect(player.startSleepTimer).toHaveBeenCalled();
+    expect(sleepController.currentState.timer.value).toBe(15);
+  });
+
+  it("loadSleep restores an unexpired timer", async () => {
+    const futureSleepDate = Date.now() + 60 * 1000;
+
+    (localStorage.getItem as jest.Mock).mockResolvedValue({
+      label: "15 minutes",
+      value: 15,
+      futureSleepDate,
+    });
+
+    player.startSleepTimer.mockClear();
+
+    await sleepController.loadSleep();
+
+    expect(player.startSleepTimer).toHaveBeenCalledWith(futureSleepDate);
+    expect(sleepController.currentState.timer.value).toBe(15);
+  });
+
+  it("loadSleep drops an expired timer without starting a native timer", async () => {
+    (localStorage.getItem as jest.Mock).mockResolvedValue({
+      label: "15 minutes",
+      value: 15,
+      futureSleepDate: Date.now() - 1000,
+    });
+
+    player.startSleepTimer.mockClear();
+
+    await sleepController.loadSleep();
+
+    expect(player.startSleepTimer).not.toHaveBeenCalled();
+    expect(localStorage.removeItem).toHaveBeenCalled();
+    expect(sleepController.currentState.timer).toEqual(SLEEP_TIMER_OFF);
+  });
+});

package/src/Player/AudioLayer/__tests__/SpeedManager.test.ts

@@ -0,0 +1,57 @@
+import { localStorage } from "@applicaster/zapp-react-native-bridge/ZappStorage/LocalStorage";
+import { DEFAULT_SPEED, SpeedController } from "../SpeedManager";
+
+jest.mock(
+  "@applicaster/zapp-react-native-bridge/ZappStorage/LocalStorage",
+  () => ({
+    localStorage: {
+      getItem: jest.fn(),
+      setItem: jest.fn(),
+      removeItem: jest.fn(),
+    },
+  })
+);
+
+describe("SpeedController", () => {
+  const player = { setPlaybackRate: jest.fn() };
+  let speedController: SpeedController;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    (localStorage.setItem as jest.Mock).mockResolvedValue(undefined);
+    (localStorage.getItem as jest.Mock).mockResolvedValue(undefined);
+    speedController = new SpeedController(player as any);
+  });
+
+  it("requires a player in the constructor", () => {
+    expect(speedController.currentSpeed).toEqual(DEFAULT_SPEED);
+  });
+
+  it("applies playback speed on the constructed player", async () => {
+    await speedController.setPlaybackSpeed({
+      asset: "speed_1_5",
+      value: 1.5,
+    });
+
+    expect(player.setPlaybackRate).toHaveBeenCalledWith(1.5);
+
+    expect(speedController.currentSpeed).toEqual({
+      asset: "speed_1_5",
+      value: 1.5,
+    });
+  });
+
+  it("loadSpeed restores a stored rate onto the player", async () => {
+    (localStorage.getItem as jest.Mock).mockResolvedValue({
+      asset: "speed_1_5",
+      value: 1.5,
+    });
+
+    player.setPlaybackRate.mockClear();
+
+    await speedController.loadSpeed();
+
+    expect(player.setPlaybackRate).toHaveBeenCalledWith(1.5);
+    expect(speedController.currentSpeed.value).toBe(1.5);
+  });
+});