@applicaster/zapp-react-dom-app 16.0.0-alpha.9225550512 → 16.0.0-alpha.9235607812

package/App/InteractionManager/__tests__/InteractionManager.test.tsx

@@ -0,0 +1,132 @@
+import { DISPLAY_STATES } from "@applicaster/zapp-react-native-ui-components/Contexts/DisplayStateContext";
+import { confirmationDialogStore } from "@applicaster/zapp-react-native-ui-components/Contexts/ConfirmDialogState";
+import { focusManager } from "@applicaster/zapp-react-native-utils/appUtils";
+import { showConfirmationDialog } from "@applicaster/zapp-react-native-utils/alertUtils";
+
+import { InteractionManagerClass } from "..";
+
+jest.mock("@applicaster/zapp-react-native-utils/alertUtils", () => ({
+  showConfirmationDialog: jest.fn(),
+}));
+
+jest.mock(
+  "@applicaster/zapp-react-native-ui-components/Decorators/Navigator",
+  () => ({ withNavigator: (C) => C })
+);
+
+jest.mock("@applicaster/zapp-react-native-redux/utils/connectToStore", () => ({
+  connectToStore: () => (C) => C,
+}));
+
+jest.mock("@applicaster/zapp-react-native-utils/logger", () => {
+  const actual = jest.requireActual(
+    "@applicaster/zapp-react-native-utils/logger"
+  );
+
+  return {
+    ...actual,
+    getXray: () => ({ ...actual.getXray(), withXray: (C) => C }),
+  };
+});
+
+const globalAny: any = global;
+
+const createBackEvent = () => ({
+  code: "Escape",
+  preventDefault: jest.fn(),
+  stopPropagation: jest.fn(),
+});
+
+const createManager = (props = {}) => {
+  const navigator = {
+    canGoBack: jest.fn(() => false),
+    goBack: jest.fn(),
+    replace: jest.fn(),
+    currentRoute: "/river/home",
+  };
+
+  const defaultProps = {
+    displayState: DISPLAY_STATES.DEFAULT,
+    setDisplayState: jest.fn(),
+    navigator,
+    rivers: {},
+    backToTopAction: jest.fn(() => "GO_BACK"),
+    emitFocusOnSelectedTopMenuItem: jest.fn(),
+    emitFocusOnSelectedTab: jest.fn(),
+  };
+
+  const mergedProps = { ...defaultProps, ...props };
+
+  return {
+    manager: new InteractionManagerClass(mergedProps as any),
+    props: mergedProps,
+  };
+};
+
+describe("InteractionManager (web)", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    (focusManager as any).setInitialFocus = jest.fn();
+    confirmationDialogStore.getState().hideDialog();
+  });
+
+  afterEach(() => {
+    delete globalAny.webOS;
+  });
+
+  describe("onBackPress with exit dialog visible", () => {
+    it.each([DISPLAY_STATES.DEFAULT, DISPLAY_STATES.PLAYER])(
+      "dismisses the dialog instead of navigating (displayState: %s)",
+      (displayState) => {
+        const { manager, props } = createManager({ displayState });
+        confirmationDialogStore.getState().showDialog();
+
+        const event = createBackEvent();
+        manager.onBackPress(event);
+
+        expect(confirmationDialogStore.getState().isDialogVisible).toBe(false);
+        expect(props.backToTopAction).not.toHaveBeenCalled();
+        expect(props.navigator.goBack).not.toHaveBeenCalled();
+        expect(event.preventDefault).toHaveBeenCalled();
+
+        expect(focusManager.setInitialFocus).toHaveBeenCalledWith(undefined, {
+          source: "cancel",
+          preserveScroll: true,
+        });
+      }
+    );
+
+    it("resolves the back action normally when the dialog is hidden", () => {
+      const { manager, props } = createManager();
+
+      manager.onBackPress(createBackEvent());
+
+      expect(props.backToTopAction).toHaveBeenCalled();
+      expect(props.navigator.canGoBack).toHaveBeenCalled();
+    });
+  });
+
+  describe("handleWebOsBack", () => {
+    it("uses the webOS platformBack API", () => {
+      const platformBack = jest.fn();
+      globalAny.webOS = { platformBack };
+
+      const { manager } = createManager();
+      manager.handleWebOsBack();
+
+      expect(platformBack).toHaveBeenCalledTimes(1);
+      expect(showConfirmationDialog).not.toHaveBeenCalled();
+    });
+
+    it("falls back to the custom exit dialog when platformBack is unavailable", () => {
+      globalAny.webOS = {};
+
+      const { manager } = createManager();
+      manager.handleWebOsBack();
+
+      expect(showConfirmationDialog).toHaveBeenCalledWith(
+        expect.objectContaining({ title: "" })
+      );
+    });
+  });
+});

package/App/InteractionManager/index.tsx

@@ -89,7 +89,7 @@ type KeyCode = { code: string; keyCode: number | string };
 const VIDEO_PLAYER_CONTROLS_NAVIGATION_MESSAGE =
   "Video player controls - use left/right to navigate";
 
-class InteractionManagerClass extends React.Component<Props, State> {
+export class InteractionManagerClass extends React.Component<Props, State> {
   onKeyDownListener: (keyCode: KeyCode) => void;
   onMouseDownListener: (event: MouseEvent) => void;
   onMouseMoveListener: (event: MouseEvent) => void;
@@ -204,7 +204,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
   }
 
   componentWillUnmount() {
-    window.removeEventListener("keydown", this.onKeyDownListener);
+    window.removeEventListener("keydown", this.onKeyDownListener, true);
     window.removeEventListener("keyup", this.onKeyUp);
     document.removeEventListener("wheel", this.onScrollListener);
 
@@ -253,7 +253,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
   }
 
   handleWebOsBack() {
-    const systemBack = globalAny?.webOS?.platformToBackground;
+    const systemBack = globalAny?.webOS?.platformBack;
 
     if (systemBack) {
       systemBack();
@@ -420,9 +420,29 @@ class InteractionManagerClass extends React.Component<Props, State> {
       return;
     }
 
+    // Focus is inside the dialog, so backToTopAction() can't resolve a
+    // meaningful action — Back must dismiss the dialog in every display state.
+    if (isDialogVisible) {
+      this.onConfirmDialogClose();
+      event.preventDefault();
+      event.stopPropagation();
+
+      return;
+    }
+
     const action = backToTopAction();
 
-    switch (displayState) {
+    const effectiveDisplayState = this.getEffectiveDisplayState();
+
+    // TEMP(native-controls): remove after device verification
+    if (effectiveDisplayState !== displayState) {
+      log_debug("[NativeControls] Back handled as PLAYER", {
+        displayState,
+        action,
+      });
+    }
+
+    switch (effectiveDisplayState) {
       case DISPLAY_STATES.DEFAULT:
         if (action === "PLATFORM_TO_BACKGROUND") {
           log_info(action);
@@ -471,9 +491,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
 
         break;
       case DISPLAY_STATES.PLAYER:
-        if (isDialogVisible) {
-          this.onConfirmDialogClose();
-        } else if (navigator.canGoBack()) {
+        if (navigator.canGoBack()) {
           navigator.goBack();
         } else if (this.isHomeScreen()) {
           this.platformToBackground();
@@ -522,8 +540,42 @@ class InteractionManagerClass extends React.Component<Props, State> {
     this.onBackPress(event);
   }
 
+  // True only while the active (primary) player renders its own controls.
+  isNativePlayerControlsEnabled = () =>
+    !!playerManager.getInstanceController?.()?.supportsNativeControls?.();
+
+  // PLAYER/HUD are set by QuickBrick's TV transport controls, which are not
+  // mounted when the player renders native controls — the state would stay
+  // DEFAULT and keys would reach the screen behind the player (Enter re-opens it).
+  // The play-next overlay is the exception: it is QuickBrick UI, so the real
+  // state applies and Enter presses the focused overlay button.
+  getEffectiveDisplayState = () =>
+    this.isNativePlayerControlsEnabled() && !this.isPlayNextOverlayVisible()
+      ? DISPLAY_STATES.PLAYER
+      : this.props.displayState;
+
+  // True when the player closed something of its own instead.
+  playerConsumesBack = () =>
+    !!playerManager.getInstanceController?.()?.handlesBackKey?.();
+
+  // While the play-next overlay is up it owns the remote: its buttons are
+  // QuickBrick focusables, so the keys must not go to the player's own controls.
+  isPlayNextOverlayVisible = () =>
+    !!this.props.navigator?.getPlayNextOverlay?.();
+
+  shouldDeferPlaybackNavigationToNativeControls = (event: KeyboardEvent) => {
+    return (
+      this.isNativePlayerControlsEnabled() &&
+      !this.isPlayNextOverlayVisible() &&
+      (keyCode(event).matchesAny(...ARROW_KEYS) ||
+        keyCode(event).matches(KEYS.Enter) ||
+        (__DEV__ && keyCode(event).matches(KEYS.X)))
+    );
+  };
+
   onKeyDown(event) {
-    const { displayState, setDisplayState, navigator, xray } = this.props;
+    const { setDisplayState, navigator, xray } = this.props;
+    const displayState = this.getEffectiveDisplayState();
     const { isDialogVisible } = confirmationDialogStore.getState();
     const { isKeyboardVisible } = this.state;
 
@@ -541,6 +593,12 @@ class InteractionManagerClass extends React.Component<Props, State> {
     }
 
     if (keyCode(event).matchesAny(KEYS.Back, KEYS.Escape, KEYS.EscapeDevice)) {
+      // A player with native controls can have something of its own open that
+      // Back should close first (e.g. an ad click-through overlay).
+      if (this.isNativePlayerControlsEnabled() && this.playerConsumesBack()) {
+        return;
+      }
+
       this.onBackPress(event);
 
       return;
@@ -553,6 +611,21 @@ class InteractionManagerClass extends React.Component<Props, State> {
     // Only handle repeat events for arrow keys
     if (event.repeat && !keyCode(event).matchesAny(...ARROW_KEYS)) return;
 
+    if (
+      !isDialogVisible &&
+      this.shouldDeferPlaybackNavigationToNativeControls(event)
+    ) {
+      // The player's own spatial navigation handles these keys.
+      // TEMP(native-controls): remove after device verification
+      log_debug("[NativeControls] key deferred to player", {
+        key: event.key,
+        displayState,
+        activeElement: document.activeElement?.className,
+      });
+
+      return;
+    }
+
     /**
      When the player is displayed, we listen to Native Play / Pause / Stop
      buttons. Any other key press will display the transport controls

package/App/Loader/utils/const.js

@@ -65,6 +65,9 @@ export const PLATFORMS = {
   mobile: "Mobile",
   vizio: "VIZIO",
   vidaa: "VIDAA",
+  // VIDAA U3 and earlier (2019 and earlier) carry no "VIDAA" token at all —
+  // "Hisense" is the only signal on those models. See isVidaaPlatform().
+  hisense: "Hisense",
   smartcast: "SmartCast",
   conjure: "Conjure",
 };
@@ -75,14 +78,42 @@ export const PLATFORMS = {
 
 /**
  * Simple way of identifying if we have access to the tizen APIs
+ *
+ * NOTE: evaluated once, when this module is first imported. The native API
+ * scripts are injected asynchronously by loader.js, so this can be `false`
+ * simply because the bundle executed first. Prefer `hasTizenAPIs()` for
+ * runtime checks; this constant is retained for the DEFAULT values below,
+ * which are themselves import-time fallbacks.
  */
 export const hasTizen = typeof window?.tizen !== "undefined";
 
 /**
  * Simple way of identifying if we have access to the webOS
+ *
+ * NOTE: same import-time caveat as `hasTizen` — prefer `hasWebOSAPIs()`.
  */
 export const hasWebOS = typeof window?.webOS !== "undefined";
 
+/**
+ * Checks, at call time, whether the Tizen APIs are available.
+ *
+ * loader.js injects `$WEBAPIS/webapis/webapis.js` via a dynamically-created
+ * <script>, which is async by default, so `window.tizen` may not exist yet when
+ * this module is imported. Checking on each call avoids latching a stale
+ * `false` for the lifetime of the app.
+ *
+ * @returns {boolean} True if the Tizen APIs are available.
+ */
+export const hasTizenAPIs = () => typeof window?.tizen !== "undefined";
+
+/**
+ * Checks, at call time, whether the webOS APIs are available.
+ * See `hasTizenAPIs()` for why this is a function rather than a constant.
+ *
+ * @returns {boolean} True if the webOS APIs are available.
+ */
+export const hasWebOSAPIs = () => typeof window?.webOS !== "undefined";
+
 /**
  * Simple way of identifying if we are on a web based platform
  */

package/App/Loader/utils/platform.js

@@ -3,13 +3,7 @@
 /* eslint-disable no-console */
 
 import { Platform } from "react-native";
-import {
-  DEFAULT,
-  desiredKeysMap,
-  hasTizen,
-  hasWebOS,
-  PLATFORMS,
-} from "./const";
+import { desiredKeysMap, hasTizenAPIs, hasWebOSAPIs, PLATFORMS } from "./const";
 
 /**
  * @typedef {"tv" | "web" | "other"} DeviceType
@@ -27,7 +21,7 @@ export const getUserAgent = () =>
  * Checks if the device is HD (1280 width).
  * @returns {boolean} True if the device is HD, false otherwise.
  */
-export const isHD = () => window.innerWidth === 1280;
+export const isHD = () => window?.innerWidth === 1280;
 
 /**
  * Checks if the platform is LG.
@@ -40,7 +34,7 @@ export const isLgPlatform = () => {
     return false;
   }
 
-  return hasWebOS || userAgent.includes(PLATFORMS.webos);
+  return hasWebOSAPIs() || userAgent.includes(PLATFORMS.webos);
 };
 
 /**
@@ -55,7 +49,7 @@ export const isSamsungPlatform = () => {
   }
 
   return (
-    hasTizen ||
+    hasTizenAPIs() ||
     userAgent.includes(PLATFORMS.samsung) ||
     userAgent.includes(PLATFORMS.tizen)
   );
@@ -68,6 +62,10 @@ export const isSamsungPlatform = () => {
 export const isVizioPlatform = () => {
   const userAgent = getUserAgent();
 
+  if (!userAgent) {
+    return false;
+  }
+
   return (
     userAgent.includes(PLATFORMS.vizio) ||
     userAgent.includes(PLATFORMS.smartcast) ||
@@ -76,13 +74,37 @@ export const isVizioPlatform = () => {
 };
 
 /**
- * Checks if the platform is Vida.
- * @returns {boolean} True if the platform is Vida, false otherwise.
+ * Checks if the platform is VIDAA.
+ *
+ * Two tokens are needed because the userAgent format changed with VIDAA U4:
+ * - 2020 and later (U4/U5/U6/U7): always carries a "VIDAA" token, e.g.
+ *   `Model/Hisense-MT9602 VIDAA/5.0(Hisense;SmartTV;50A53FSV;...)`
+ * - 2019 and earlier (U3 and prior): carries NO "VIDAA" token at all — the only
+ *   signal is "Hisense", e.g. `Model/Hisense-MSD6586 (Hisense;HE50N3050UWTS;...)`
+ *
+ * Matching "VIDAA" alone silently misses every U3-and-earlier device, which the
+ * VIDAA JS SDK still supports (getDeviceID/getBrand/config are all U3U4U5+).
+ *
+ * Caveat: "Hisense" also appears in the userAgent of Hisense-branded Android TV
+ * models, which are not VIDAA. That is tolerable here because this is only
+ * consulted on a VIDAA-targeted build (see getDeviceType), but it is why the
+ * vendor docs warn against using "Hisense" as a general-purpose signal. A
+ * stricter check would test for the native `Hisense_GetDeviceID` global, which
+ * VIDAA exposes from U3 onwards and Android TV does not.
+ *
+ * @see https://partner-doc.vidaa.com/vdocs/development/open-capacity.html
+ * @returns {boolean} True if the platform is VIDAA, false otherwise.
  */
 export const isVidaaPlatform = () => {
   const userAgent = getUserAgent();
 
-  return userAgent.includes(PLATFORMS.vidaa);
+  if (!userAgent) {
+    return false;
+  }
+
+  return (
+    userAgent.includes(PLATFORMS.vidaa) || userAgent.includes(PLATFORMS.hisense)
+  );
 };
 
 /**
@@ -91,11 +113,201 @@ export const isVidaaPlatform = () => {
  */
 export const hasVizioAPIs = () => {
   return (
-    typeof window.VIZIO !== "undefined" &&
+    typeof window?.VIZIO !== "undefined" &&
     window?.applicaster?.vizioLibraryDidLoad
   );
 };
 
+/**
+ * Checks if the VIDAA JS SDK has finished loading.
+ * @returns {boolean} True if the `vidaatv` object is available.
+ */
+export const hasVidaaAPIs = () => typeof window?.vidaatv !== "undefined";
+
+/** How long to wait for a native device API callback before giving up, in ms. */
+const NATIVE_API_TIMEOUT_MS = 3000;
+
+/**
+ * Wraps a promise so that it *always* settles, and always resolves.
+ *
+ * The native device APIs are callback-based and wrapped in promises that can
+ * fail in two ways this guards against:
+ *
+ * 1. **Rejection.** Device info and connection info are requested together with
+ *    `Promise.all`, which rejects as a whole on the first failure — so a routine
+ *    "no network" error from the connection lookup would discard the model and
+ *    OS version that were retrieved successfully.
+ * 2. **Never settling.** `webOS.deviceInfo(cb)`, `tizen.systeminfo(cb)` and
+ *    `VIZIO.getFirmwareVersion(cb)` resolve only from their callbacks. If a
+ *    callback never fires the promise hangs forever, and because `getDeviceData`
+ *    is awaited during startup, app boot hangs with it.
+ *
+ * @param {Promise} promise The promise to guard.
+ * @param {object} options
+ * @param {string} options.label Name used in warnings.
+ * @param {number} [options.timeout=NATIVE_API_TIMEOUT_MS] Milliseconds to wait.
+ * @param {*} [options.fallback=null] Value to resolve with on failure/timeout.
+ * @returns {Promise<*>} Resolves with the value, or `fallback`.
+ */
+const settleWithin = (
+  promise,
+  { label, timeout = NATIVE_API_TIMEOUT_MS, fallback = null } = {}
+) => {
+  return new Promise((resolve) => {
+    let settled = false;
+
+    const finish = (value) => {
+      if (settled) {
+        return;
+      }
+
+      settled = true;
+      clearTimeout(timeoutId);
+      resolve(value);
+    };
+
+    const timeoutId = setTimeout(() => {
+      console.warn(`${label}: timed out after ${timeout}ms`);
+      finish(fallback);
+    }, timeout);
+
+    Promise.resolve(promise)
+      .then(finish)
+      .catch((error) => {
+        console.warn(`${label}: failed`, error);
+        finish(fallback);
+      });
+  });
+};
+
+/** How long to wait for the VIDAA SDK before giving up, in ms. */
+const VIDAA_SDK_TIMEOUT_MS = 3000;
+
+/** How often to re-check for the VIDAA SDK while waiting, in ms. */
+const VIDAA_SDK_POLL_MS = 50;
+
+/**
+ * The value the VIDAA SDK returns for APIs the current platform version does
+ * not implement, per the vendor docs ("For features Not Supported by the
+ * platform, the interface returns `Not Supported`"). Treated as absent.
+ */
+const VIDAA_NOT_SUPPORTED = "Not Supported";
+
+/**
+ * Waits for the VIDAA JS SDK to become available on `window`.
+ *
+ * The SDK is injected by loader.js as a dynamically-created <script>, which is
+ * async by default and fetched from the VIDAA CDN. The app bundle is served
+ * locally and can therefore boot before that request completes, so reading
+ * `window.vidaatv` directly at startup is a race. This resolves as soon as the
+ * SDK appears, or with `null` once the timeout elapses.
+ *
+ * Resolves rather than rejects on timeout so a missing SDK degrades to partial
+ * device data instead of failing the whole `getDeviceData` call.
+ *
+ * @param {number} [timeout=VIDAA_SDK_TIMEOUT_MS] Milliseconds to wait.
+ * @returns {Promise<object|null>} The `vidaatv` object, or null if it never arrived.
+ */
+export const waitForVidaaAPIs = (timeout = VIDAA_SDK_TIMEOUT_MS) => {
+  return new Promise((resolve) => {
+    if (hasVidaaAPIs()) {
+      resolve(window.vidaatv);
+
+      return;
+    }
+
+    const startedAt = Date.now();
+
+    const intervalId = setInterval(() => {
+      if (hasVidaaAPIs()) {
+        clearInterval(intervalId);
+        resolve(window.vidaatv);
+
+        return;
+      }
+
+      if (Date.now() - startedAt >= timeout) {
+        clearInterval(intervalId);
+
+        console.warn(
+          `waitForVidaaAPIs: VIDAA SDK did not load within ${timeout}ms`
+        );
+
+        resolve(null);
+      }
+    }, VIDAA_SDK_POLL_MS);
+  });
+};
+
+/**
+ * Reads a single value from the VIDAA SDK, tolerating APIs that the current
+ * platform version does not implement.
+ *
+ * Every accessor is optional: older platforms omit the method entirely, and
+ * supported-but-unavailable values come back as the string "Not Supported".
+ *
+ * @param {object} sdk The `vidaatv` object.
+ * @param {string} method The accessor name, e.g. "getModelName".
+ * @returns {string|null} The value, or null when unavailable.
+ */
+const readVidaaValue = (sdk, method) => {
+  try {
+    if (typeof sdk?.[method] !== "function") {
+      return null;
+    }
+
+    const value = sdk[method]();
+
+    return value && value !== VIDAA_NOT_SUPPORTED ? value : null;
+  } catch (error) {
+    console.warn(`readVidaaValue: ${method} threw`, error);
+
+    return null;
+  }
+};
+
+/**
+ * Gets device info from the VIDAA JS SDK.
+ *
+ * Field availability varies by VIDAA version, so each value is read
+ * defensively and omitted when unavailable:
+ * - getBrand / getModelName / getFirmWareVersion / getCountryCode are U3+
+ * - getOSVersion / getNetType are U4+, hence the firmware fallback for
+ *   osVersion so pre-2020 models still report something
+ *
+ * @returns {Promise<object|null>} Device info, or null if the SDK never loaded.
+ */
+export const getVidaaInfo = async () => {
+  const sdk = await waitForVidaaAPIs();
+
+  if (!sdk) {
+    return null;
+  }
+
+  const modelName = readVidaaValue(sdk, "getModelName");
+  const brand = readVidaaValue(sdk, "getBrand");
+  const networkType = readVidaaValue(sdk, "getNetType");
+  const countryCode = readVidaaValue(sdk, "getCountryCode");
+
+  // getOSVersion is U4+; fall back to the firmware version, which is U3+.
+  const osVersion =
+    readVidaaValue(sdk, "getOSVersion") ||
+    readVidaaValue(sdk, "getFirmWareVersion");
+
+  // Human-readable name for the `deviceName` context key, e.g.
+  // "Hisense 50A53FSV". Falls back to whichever half is available.
+  const deviceName = [brand, modelName].filter(Boolean).join(" ");
+
+  return {
+    ...(modelName ? { modelName } : {}),
+    ...(brand ? { deviceMake: brand } : {}),
+    ...(deviceName ? { deviceName } : {}),
+    ...(osVersion ? { osVersion } : {}),
+    ...(networkType ? { networkType } : {}),
+    ...(countryCode ? { countryCode } : {}),
+  };
+};
+
 /**
  * Determines the device type based on the platform.
  * @returns {DeviceType} The device type ("tv", "web", or "other").
@@ -165,7 +377,7 @@ export const getWebOSConnectionInfo = () => {
  */
 export const getTizenConnectionInfo = () => {
   return new Promise((resolve, reject) => {
-    if (!isSamsungPlatform) {
+    if (!isSamsungPlatform()) {
       resolve(null);
 
       return;
@@ -189,6 +401,36 @@ export const getTizenConnectionInfo = () => {
   });
 };
 
+/**
+ * Retrieves the firmware version from the Vizio companion library.
+ *
+ * `VIZIO.getFirmwareVersion` is callback-based. It was previously called
+ * without being awaited, assigning onto `deviceData` after `getDeviceData` had
+ * already returned — by which point the caller had spread the object into
+ * session storage, so the value was silently dropped whenever the callback did
+ * not fire synchronously. Wrapping it in a promise lets it be awaited like
+ * every other platform's device info.
+ *
+ * @returns {Promise<string|null>} The firmware version, or null if unavailable.
+ */
+export const getVizioFirmwareVersion = () => {
+  return new Promise((resolve, reject) => {
+    if (!hasVizioAPIs()) {
+      resolve(null);
+
+      return;
+    }
+
+    try {
+      window.VIZIO.getFirmwareVersion((firmwareVersion) => {
+        resolve(firmwareVersion);
+      });
+    } catch (error) {
+      reject(error);
+    }
+  });
+};
+
 /**
  * Gets all of the webOS device info available to us via webOS.deviceInfo
  */
@@ -204,7 +446,12 @@ export const getWebOSInfo = () => {
       if (info) {
         resolve({
           ...info,
-          name: `${info.modelName} - ${info.version}`,
+          // `deviceName` is a persisted context key; the previous `name` was
+          // absent from desiredKeysMap, so it was computed and dropped. Format
+          // is "<make> <model>", matching Samsung/Vizio/VIDAA. The old string
+          // was `${info.modelName} - ${info.version}`, which omitted the make
+          // and embedded a version already reported as osVersion.
+          deviceName: `LG ${info.modelName}`,
           osVersion: info.sdkVersion, // info.sdkVersion is the OS version, info.version is software version
         });
       } else {
@@ -231,16 +478,22 @@ export const getTizenInfo = () => {
         "http://tizen.org/system/model_name"
       );
 
-      const name = `${DEFAULT.make} ${modelName}`;
+      // Previously `${DEFAULT.make} ${modelName}` — DEFAULT has no `make` key
+      // (it is `deviceMake`), so this interpolated the literal string
+      // "undefined". It went unnoticed because the value was named `name`,
+      // which is absent from desiredKeysMap and therefore never persisted.
+      const deviceName = `Samsung ${modelName}`;
 
       const osVersion = tizen.systeminfo.getCapability(
         "http://tizen.org/feature/platform.version"
       );
 
-      if (modelName && name && osVersion) {
+      // `deviceName` is derived from modelName, so checking it here would be
+      // redundant — it is truthy whenever modelName is.
+      if (modelName && osVersion) {
         resolve({
           modelName,
-          name,
+          deviceName,
           osVersion,
         });
       } else {
@@ -279,9 +532,13 @@ export const getDeviceData = async () => {
     };
 
     if (isLgPlatform()) {
+      // Guarded individually so a failure in one lookup does not discard the
+      // other — see settleWithin.
       const [webOSInfo, webOSConnectionInfo] = await Promise.all([
-        getWebOSInfo(),
-        getWebOSConnectionInfo(),
+        settleWithin(getWebOSInfo(), { label: "getWebOSInfo" }),
+        settleWithin(getWebOSConnectionInfo(), {
+          label: "getWebOSConnectionInfo",
+        }),
       ]);
 
       deviceData = {
@@ -294,8 +551,10 @@ export const getDeviceData = async () => {
       };
     } else if (isSamsungPlatform()) {
       const [tizenInfo, tizenConnectionInfo] = await Promise.all([
-        getTizenInfo(),
-        getTizenConnectionInfo(),
+        settleWithin(getTizenInfo(), { label: "getTizenInfo" }),
+        settleWithin(getTizenConnectionInfo(), {
+          label: "getTizenConnectionInfo",
+        }),
       ]);
 
       deviceData = {
@@ -311,17 +570,39 @@ export const getDeviceData = async () => {
         ...deviceData,
         platform: "vizio",
         deviceMake: "Vizio",
-        deviceType: "tv",
+        deviceType: getDeviceType(),
         ...deviceDimensions,
       };
 
       if (hasVizioAPIs()) {
-        window.VIZIO.getFirmwareVersion(function (firmwareVersion) {
-          deviceData.osVersion = firmwareVersion;
+        const firmwareVersion = await settleWithin(getVizioFirmwareVersion(), {
+          label: "getVizioFirmwareVersion",
         });
 
+        if (firmwareVersion) {
+          deviceData.osVersion = firmwareVersion;
+        }
+
         deviceData.deviceModel = window.VIZIO.deviceModel;
+
+        if (deviceData.deviceModel) {
+          deviceData.deviceName = `Vizio ${deviceData.deviceModel}`;
+        }
       }
+    } else if (isVidaaPlatform()) {
+      // Waits for the VIDAA SDK, which loader.js loads asynchronously from the
+      // VIDAA CDN. Resolves to null on timeout, leaving the static fields below.
+      const vidaaInfo = await getVidaaInfo();
+
+      deviceData = {
+        ...vidaaInfo,
+        platform: "vidaa",
+        // Brand is read from the SDK rather than hardcoded: VIDAA ships on
+        // OEM sets beyond Hisense, so getBrand() is the accurate source.
+        deviceMake: vidaaInfo?.deviceMake || "Hisense",
+        deviceType: getDeviceType(),
+        ...deviceDimensions,
+      };
     }
 
     return deviceData;
@@ -332,6 +613,10 @@ export const getDeviceData = async () => {
       error
     );
 
-    return null;
+    // Returns an empty object rather than null: the caller
+    // (loadSessionStorageData) does `delete deviceData.sdkVersion` on the
+    // result, which throws a TypeError on null and turns a handled error into
+    // an unhandled one during startup.
+    return {};
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-dom-app",
-  "version": "16.0.0-alpha.9225550512",
+  "version": "16.0.0-alpha.9235607812",
   "description": "Zapp App Component for Applicaster's Quick Brick React Native App",
   "main": "index.js",
   "scripts": {
@@ -22,11 +22,11 @@
   },
   "homepage": "https://github.com/applicaster/zapp-react-dom-app#readme",
   "dependencies": {
-    "@applicaster/zapp-react-dom-ui-components": "16.0.0-alpha.9225550512",
-    "@applicaster/zapp-react-native-bridge": "16.0.0-alpha.9225550512",
-    "@applicaster/zapp-react-native-redux": "16.0.0-alpha.9225550512",
-    "@applicaster/zapp-react-native-ui-components": "16.0.0-alpha.9225550512",
-    "@applicaster/zapp-react-native-utils": "16.0.0-alpha.9225550512",
+    "@applicaster/zapp-react-dom-ui-components": "16.0.0-alpha.9235607812",
+    "@applicaster/zapp-react-native-bridge": "16.0.0-alpha.9235607812",
+    "@applicaster/zapp-react-native-redux": "16.0.0-alpha.9235607812",
+    "@applicaster/zapp-react-native-ui-components": "16.0.0-alpha.9235607812",
+    "@applicaster/zapp-react-native-utils": "16.0.0-alpha.9235607812",
     "abortcontroller-polyfill": "^1.7.5",
     "typeface-montserrat": "^0.0.54",
     "video.js": "7.14.3",