@applicaster/zapp-react-native-utils 13.0.0-alpha.6714678893 → 13.0.0-alpha.7120331332

package/appUtils/focusManager/__tests__/__snapshots__/focusManager.test.js.snap

@@ -1,14 +1,14 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`focusManager should be defined 1`] = `
-Object {
+{
   "blur": [Function],
   "disableFocus": [Function],
   "enableFocus": [Function],
   "focusableTree": Tree {
     "loadingCounter": 0,
-    "root": Object {
-      "children": Array [],
+    "root": {
+      "children": [],
       "component": null,
       "id": "root",
       "lastFocusedItem": null,
@@ -39,12 +39,12 @@ Object {
 `;
 
 exports[`focusManagerIOS should be defined 1`] = `
-Object {
+{
   "focus": [Function],
   "focusableTree": Tree {
     "loadingCounter": 0,
-    "root": Object {
-      "children": Array [],
+    "root": {
+      "children": [],
       "component": null,
       "id": "root",
       "lastFocusedItem": null,

package/appUtils/keyCodes/__tests__/__snapshots__/keyCodes.test.js.snap

@@ -1,11 +1,11 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`keyCodes keyCode returns an object for a given key event 1`] = `
-Object {
+{
   "direction": [Function],
   "matches": [Function],
   "matchesAny": [Function],
-  "value": Object {
+  "value": {
     "code": "Enter",
     "keyCode": 13,
   },

package/appUtils/keyCodes/__tests__/keyCodes.test.js

@@ -1,4 +1,4 @@
-const { Platform } = require("react-native");
+import { Platform } from "react-native";
 
 Platform.OS = "web";
 

package/appUtils/orientationHelper.ts

@@ -2,7 +2,7 @@
 import * as ReactNative from "react-native";
 import { isTV, platformSelect } from "../reactUtils";
 import { usePickFromState } from "@applicaster/zapp-react-native-redux/hooks";
-import { useIsTablet } from "@applicaster/zapp-react-native-utils/reactHooks";
+import { useIsTablet } from "@applicaster/zapp-react-native-utils/reactHooks/device/useIsTablet";
 
 import {
   QUICK_BRICK_EVENTS,

package/appUtils/playerManager/playerNative.ts

@@ -58,7 +58,7 @@ export class PlayerNative extends Player {
     return this.playerState.contentPosition;
   };
 
-  currentPlayerComponent = (): ReactComponent<PlayerProps> =>
+  currentPlayerComponent = (): ReactComponent<PlayerRefProps> =>
     this.playerComponent?.current;
 
   getState = () => this.playerState;

package/arrayUtils/__tests__/__snapshots__/arrayUtils.test.ts.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`shiftArray shifts the n first items from the head to the tail of the array with a positive offset 1`] = `
-Array [
+[
   "bar",
   "baz",
   42,
@@ -10,7 +10,7 @@ Array [
 `;
 
 exports[`shiftArray shifts the n first items from the head to the tail of the array with a positive offset 2`] = `
-Array [
+[
   "baz",
   42,
   "foo",
@@ -19,7 +19,7 @@ Array [
 `;
 
 exports[`shiftArray shifts the n last items from the tail to the head of the array with a negative offset 1`] = `
-Array [
+[
   42,
   "foo",
   "bar",
@@ -28,7 +28,7 @@ Array [
 `;
 
 exports[`shiftArray shifts the n last items from the tail to the head of the array with a negative offset 2`] = `
-Array [
+[
   "baz",
   42,
   "foo",

package/functionUtils/__tests__/__snapshots__/functionUtils.test.js.snap

@@ -1,8 +1,8 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`functionUtils subscriber can be invoked without args 1`] = `
-Object {
-  "handlers": Object {},
+{
+  "handlers": {},
   "invokeHandler": [Function],
   "on": [Function],
   "removeHandler": [Function],
@@ -10,9 +10,9 @@ Object {
 `;
 
 exports[`functionUtils subscriber returns the original object with additional methods 1`] = `
-Object {
+{
   "foo": "bar",
-  "handlers": Object {},
+  "handlers": {},
   "invokeHandler": [Function],
   "method": [Function],
   "on": [Function],

package/manifestUtils/__tests__/createConfig.test.js

@@ -1,11 +1,9 @@
-import { createConfig } from "../createConfig";
-
-const styles = {
+const mockStyles = {
   fields: [{ key: "field_1", initial_value: 1 }],
   label: "styles",
 };
 
-const stylesWithGroup = {
+const mockStylesWithGroup = {
   fields: [
     {
       group: true,
@@ -15,26 +13,28 @@ const stylesWithGroup = {
   ],
 };
 
-const generators = {
-  styles: jest.fn(() => ({ styles })),
+const mockGenerators = {
+  styles: jest.fn(() => ({ styles: mockStyles })),
   stylesGroup: jest.fn(() => ({
-    styles: stylesWithGroup,
+    styles: mockStylesWithGroup,
   })),
-  customConfiguration: jest.fn(() => ({ custom_configuration: [styles] })),
+  customConfiguration: jest.fn(() => ({ custom_configuration: [mockStyles] })),
   customConfigurationGroup: jest.fn(() => ({
-    custom_configuration: [stylesWithGroup],
+    custom_configuration: [mockStylesWithGroup],
   })),
 };
 
-jest.mock("../defaultManifestConfigurations", () => ({
+jest.doMock("../defaultManifestConfigurations", () => ({
   defaultConfigurations: {
-    styles: generators.styles,
-    stylesGroup: generators.stylesGroup,
-    customConfiguration: generators.customConfiguration,
-    customConfigurationGroup: generators.customConfigurationGroup,
+    styles: mockGenerators.styles,
+    stylesGroup: mockGenerators.stylesGroup,
+    customConfiguration: mockGenerators.customConfiguration,
+    customConfigurationGroup: mockGenerators.customConfigurationGroup,
   },
 }));
 
+const { createConfig } = require("../createConfig");
+
 describe("createConfig", () => {
   it("should return a function", () => {
     const currentResult = createConfig(jest.fn());
@@ -78,7 +78,9 @@ describe("createConfig", () => {
       extend: "styles",
     })(props);
 
-    expect(generators.styles).toBeCalledWith(props);
+    console.log(mockGenerators.styles.mock.calls);
+
+    expect(mockGenerators.styles).toBeCalledWith(props);
   });
 
   it("should return base configuration if manifest is not provided", () => {
@@ -88,7 +90,7 @@ describe("createConfig", () => {
       extend: "styles",
     })({});
 
-    expect(currentResult).toEqual({ styles });
+    expect(currentResult).toEqual({ styles: mockStyles });
   });
 
   describe("Data merging", () => {

package/navigationUtils/__tests__/__snapshots__/navigationUtils.test.js.snap

@@ -1,19 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`getNavigationProps returns the props otherwise 1`] = `
-Object {
-  "assets": Object {
+{
+  "assets": {
     "appLogo": "appLogo.png",
   },
   "home": false,
-  "nav_items": Array [
-    Object {
+  "nav_items": [
+    {
       "type": "label",
     },
   ],
-  "rules": Object {},
+  "rules": {},
   "selected": "A1234",
-  "styles": Object {
+  "styles": {
     "style": "foo",
   },
   "title": "testTitle",

package/navigationUtils/__tests__/itemTypes.test.js

@@ -61,8 +61,8 @@ describe("getTypeMatcher", () => {
 
 describe("isItemOfType", () => {
   it("is a curried function", () => {
-    expect(itemIsOfType(river, SCREEN_TYPES.RIVER)).toBeBoolean();
-    expect(itemIsOfType(river)).toBeFunction();
+    expect(itemIsOfType(river, SCREEN_TYPES.RIVER)).toBeTruthy();
+    expect(itemIsOfType(river)).toBeInstanceOf(Function);
   });
 
   it("returns true if the item is of the given type", () => {

package/navigationUtils/__tests__/navigationUtils.test.js

@@ -243,7 +243,7 @@ describe("getTargetRoute", () => {
     it("returns a valid path when initial pathname is /", () => {
       const targetRoute = getTargetRoute(river, "/", { layoutVersion });
       expect(targetRoute).toEqual(`/river/${river.id}`);
-      expect(targetRoute).not.toInclude("//");
+      expect(targetRoute).not.toContainEntry("//");
     });
   });
 
@@ -273,7 +273,7 @@ describe("getTargetRoute", () => {
     it("returns a valid path when initial pathname is /", () => {
       const targetRoute = getTargetRoute(river, "/", { layoutVersion });
       expect(targetRoute).toEqual(`/river/${river.id}`);
-      expect(targetRoute).not.toInclude("//");
+      expect(targetRoute).not.toContainEntry("//");
     });
   });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "13.0.0-alpha.6714678893",
+  "version": "13.0.0-alpha.7120331332",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,7 +28,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "13.0.0-alpha.6714678893",
+    "@applicaster/applicaster-types": "13.0.0-alpha.7120331332",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "create-react-context": "^0.2.3",

package/reactHooks/autoscrolling/__tests__/useTrackCurrentAutoScrollingElement.test.ts

@@ -14,7 +14,7 @@ jest.mock(
 
 jest.mock("@applicaster/zapp-react-native-utils/reactHooks/navigation");
 
-jest.useFakeTimers();
+jest.useFakeTimers({ legacyFakeTimers: true });
 
 const {
   useTrackCurrentAutoScrollingElement,

package/reactHooks/autoscrolling/__tests__/useTrackedView.test.tsx

@@ -19,7 +19,7 @@ jest.mock(
   })
 );
 
-jest.useFakeTimers();
+jest.useFakeTimers({ legacyFakeTimers: true });
 
 jest.mock("@applicaster/zapp-react-native-utils/reactHooks/navigation");
 

package/reactHooks/cell-click/__tests__/index.test.js

@@ -5,14 +5,14 @@ import { ActionExecutorContext } from "@applicaster/zapp-react-native-utils/acti
 
 import { waitFor } from "@testing-library/react-native";
 
-const navigator = {
+const mockNavigator = {
   getPathname: () => "pathnameMock",
   push: jest.fn(),
   data: {},
 };
 
 jest.mock("@applicaster/zapp-react-native-utils/reactHooks/navigation", () => ({
-  useNavigation: () => navigator,
+  useNavigation: () => mockNavigator,
   useRoute: () => ({ pathname: "pathnameMock" }),
   useProfilerLogging: () => {
     return jest.fn();
@@ -26,6 +26,9 @@ jest.mock("@applicaster/zapp-react-native-utils/analyticsUtils/", () => ({
 }));
 
 jest.mock("@applicaster/zapp-react-native-ui-components/Contexts", () => ({
+  ...jest.requireActual(
+    "@applicaster/zapp-react-native-ui-components/Contexts"
+  ),
   ZappPipesEntryContext: {
     useZappPipesContext: jest.fn(() => [undefined, jest.fn()]),
   },

package/reactHooks/feed/__tests__/useBuildPipesUrl.test.tsx

@@ -7,12 +7,12 @@ const appData = {
   sdk_version: "2.0.0",
 };
 
-let INFLATED_URL;
+const mockUseInflatedUrl = jest.fn();
 
 jest.mock(
   "@applicaster/zapp-react-native-utils/reactHooks/feed/useInflatedUrl",
   () => ({
-    useInflatedUrl: () => INFLATED_URL,
+    useInflatedUrl: mockUseInflatedUrl,
   })
 );
 
@@ -20,7 +20,7 @@ const { useBuildPipesUrl } = require("../useBuildPipesUrl");
 
 describe("useBuildPipesUrl", () => {
   it("returns the proper url", async () => {
-    INFLATED_URL = "http://foo.com/show/show-1";
+    mockUseInflatedUrl.mockReturnValue("http://foo.com/show/show-1");
     const url = "http://foo.com/show/{{showId}}";
 
     const mapping = {
@@ -65,7 +65,7 @@ describe("useBuildPipesUrl", () => {
   });
 
   it("returns empty object if url is not in endpoints", async () => {
-    INFLATED_URL = "http://foobar.com/show-1";
+    mockUseInflatedUrl.mockReturnValue("http://foobar.com/show-1");
     const url = "http://foobar.com/{{showId}}";
 
     const mapping = {

package/reactHooks/feed/__tests__/useFeedLoader.test.tsx

@@ -6,42 +6,41 @@ import { Provider } from "react-redux";
 import * as React from "react";
 import configureStore from "redux-mock-store";
 import thunk from "redux-thunk";
-import * as navigationHooks from "@applicaster/zapp-react-native-utils/reactHooks/navigation";
+import * as useRouteHook from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useRoute";
 import * as useNavigationHooks from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useNavigation";
+import { useFeedLoader } from "../useFeedLoader";
 
 const mockStore = configureStore([thunk]);
 
-jest.useFakeTimers();
+jest.useFakeTimers({ legacyFakeTimers: true });
 
-const logger = {
+const mockLogger = {
   warning: jest.fn(),
   log: jest.fn(),
   info: jest.fn(),
 };
 
-const navigator = {
+const mockNavigator: any = {
   currentRoute: "/river/A1234",
   getStack: jest.fn(() => []),
 };
 
-const routeData = {
+const mockRouteData: any = {
   screenData: {},
   pathname: "/river/A1234",
 };
 
-jest.mock("../../logger", () => ({
+jest.doMock("../../logger", () => ({
   reactHooksLogger: {
-    addSubsystem: jest.fn(() => logger),
+    addSubsystem: jest.fn(() => mockLogger),
   },
 }));
 
 jest
   .spyOn(useNavigationHooks, "useNavigation")
-  .mockImplementation(() => navigator);
+  .mockImplementation(() => mockNavigator);
 
-jest.spyOn(navigationHooks, "useRoute").mockImplementation(() => routeData);
-
-const { useFeedLoader } = require("../useFeedLoader");
+jest.spyOn(useRouteHook, "useRoute").mockImplementation(() => mockRouteData);
 
 const mockZappPipesData = {
   data: {

package/reactHooks/feed/usePipesCacheReset.ts

@@ -1,12 +1,12 @@
 import React from "react";
 import { useDispatch } from "react-redux";
-import { useRoute } from "@applicaster/zapp-react-native-utils/reactHooks/navigation";
-import {
-  getDatasourceUrl,
-  usePipesContexts,
-} from "@applicaster/zapp-react-native-ui-components/Decorators/RiverFeedLoader/utils";
+
+import { getDatasourceUrl } from "@applicaster/zapp-react-native-ui-components/Decorators/RiverFeedLoader/utils/getDatasourceUrl";
+import { usePipesContexts } from "@applicaster/zapp-react-native-ui-components/Decorators/RiverFeedLoader/utils/usePipesContexts";
 import { clearPipesData } from "@applicaster/zapp-react-native-redux/ZappPipes";
 
+import { useRoute } from "../navigation/useRoute";
+
 /**
  * reset river components cache when screen is unmounted
  * @param {string} riverId screen id

package/reactHooks/flatList/__tests__/index.test.tsx

@@ -1,6 +1,5 @@
 import * as React from "react";
-import { renderHook, act } from "@testing-library/react-hooks";
-import { render } from "@testing-library/react-native";
+import { renderHook, render, act } from "@testing-library/react-native";
 import { View } from "react-native";
 
 import { useSequentialLoader, useSequentialRenderItem } from "..";
@@ -66,26 +65,28 @@ describe("flatList hooks", () => {
 
         expect(result.current.allLoaded).toBe(false);
 
-        result.current.renderItem(
-          ({ onLoadFinished }) => {
-            onLoadFinished();
-          },
-          { index: 1 }
-        );
+        act(() => {
+          result.current.renderItem(
+            ({ onLoadFinished }) => {
+              onLoadFinished();
+            },
+            { index: 1 }
+          );
+        });
 
         expect(result.current.allLoaded).toBe(true);
       });
     });
 
     describe("Rendering wrapper", () => {
-      it("wraps the elements in the View with display: none style", () => {
+      it("wraps the elements in the View with display: none style", async () => {
         const element1 = { id: 1 };
         const element2 = { id: 2 };
         const mockData = [element1, element2];
 
         const { result } = renderHook(() => useSequentialRenderItem(mockData));
 
-        const { getByTestId } = render(
+        const res = render(
           result.current.renderItem(
             () => {
               return <View testID={"test"} />;
@@ -94,7 +95,9 @@ describe("flatList hooks", () => {
           )
         );
 
-        const element = getByTestId("sequential-river-wrapper-1");
+        const element = res.root.findByProps({
+          testID: "sequential-river-wrapper-1",
+        });
 
         expect(element.props.style.display).toEqual("none");
       });
@@ -106,14 +109,16 @@ describe("flatList hooks", () => {
 
         const { result } = renderHook(() => useSequentialRenderItem(mockData));
 
-        result.current.renderItem(
-          ({ onLoadFinished }) => {
-            onLoadFinished();
-          },
-          { item: element1, index: 0 }
-        );
+        act(() => {
+          result.current.renderItem(
+            ({ onLoadFinished }) => {
+              onLoadFinished();
+            },
+            { item: element1, index: 0 }
+          );
+        });
 
-        const { getByTestId } = render(
+        const { root } = render(
           result.current.renderItem(
             ({ onLoadFinished }) => {
               onLoadFinished();
@@ -124,7 +129,9 @@ describe("flatList hooks", () => {
           )
         );
 
-        const element = getByTestId("sequential-river-wrapper-1");
+        const element = root.findByProps({
+          testID: "sequential-river-wrapper-1",
+        });
 
         expect(element.props.style.display).toEqual("flex");
       });
@@ -136,7 +143,7 @@ describe("flatList hooks", () => {
 
         const { result } = renderHook(() => useSequentialRenderItem(mockData));
 
-        const { getByTestId } = render(
+        const { root } = render(
           result.current.renderItem(
             ({ onLoadFinished }) => {
               onLoadFinished();
@@ -147,7 +154,9 @@ describe("flatList hooks", () => {
           )
         );
 
-        const element = getByTestId("sequential-river-wrapper-1");
+        const element = root.findByProps({
+          testID: "sequential-river-wrapper-1",
+        });
 
         expect(element.props.style.display).toEqual("none");
       });

package/reactHooks/layout/__tests__/index.test.tsx

@@ -14,10 +14,10 @@ const mocked_return_value = (tv) => ({
 });
 
 const platform = "android";
-let tv_flag = false;
+let mock_tv_flag = false;
 
 ReactNative.Dimensions.get = jest.fn(
-  (context) => mocked_return_value(tv_flag)[context]
+  (context) => mocked_return_value(mock_tv_flag)[context]
 );
 
 const mockRemoveFn = jest.fn();
@@ -43,7 +43,7 @@ jest.mock("react-native-safe-area-context", () => ({
 
 jest.mock("../../../reactUtils", () => ({
   platformSelect: jest.fn((specs) => specs[platform] || specs.default),
-  isTV: jest.fn(() => tv_flag),
+  isTV: jest.fn(() => mock_tv_flag),
 }));
 
 jest.mock("../../navigation", () => ({
@@ -134,20 +134,20 @@ describe("useDimensions", () => {
 
   describe("it applies the scale to the width & height if needed", () => {
     it("applies the scale on TV, and screen context", () => {
-      tv_flag = true;
-      const { screen } = mocked_return_value(tv_flag);
+      mock_tv_flag = true;
+      const { screen } = mocked_return_value(mock_tv_flag);
       const { dimensions } = testHook("screen");
 
       expect(dimensions).toHaveProperty("height", screen.height * screen.scale);
       expect(dimensions).toHaveProperty("width", screen.width * screen.scale);
       expect(dimensions).toHaveProperty("scale", 1);
 
-      tv_flag = false;
+      mock_tv_flag = false;
     });
 
     it("doesn't apply the scale on mobile with screen context", () => {
-      tv_flag = false;
-      const { screen } = mocked_return_value(tv_flag);
+      mock_tv_flag = false;
+      const { screen } = mocked_return_value(mock_tv_flag);
       const { dimensions } = testHook("screen");
 
       expect(dimensions).toHaveProperty("height", screen.height);
@@ -156,8 +156,8 @@ describe("useDimensions", () => {
     });
 
     it("doesn't apply the scale on TV with window context", () => {
-      tv_flag = true;
-      const { window } = mocked_return_value(tv_flag);
+      mock_tv_flag = true;
+      const { window } = mocked_return_value(mock_tv_flag);
       const { dimensions } = testHook("window");
 
       expect(dimensions).toHaveProperty("height", window.height);