@khanacademy/wonder-blocks-data 3.1.3 → 5.0.1

package/src/hooks/__tests__/use-request-interception.test.js

@@ -0,0 +1,255 @@
+// @flow
+import * as React from "react";
+import {renderHook} from "@testing-library/react-hooks";
+import InterceptRequests from "../../components/intercept-requests.js";
+import {useRequestInterception} from "../use-request-interception.js";
+
+describe("#useRequestInterception", () => {
+    it("should return a function", () => {
+        // Arrange
+
+        // Act
+        const {
+            result: {current: result},
+        } = renderHook(() => useRequestInterception("ID", jest.fn()));
+
+        // Assert
+        expect(result).toBeInstanceOf(Function);
+    });
+
+    it("should return the same function if the arguments and context don't change", () => {
+        // Arrange
+        const handler = jest.fn();
+
+        // Act
+        const wrapper = renderHook(() => useRequestInterception("ID", handler));
+        const result1 = wrapper.result.current;
+        wrapper.rerender();
+        const result2 = wrapper.result.current;
+
+        // Assert
+        expect(result1).toBe(result2);
+    });
+
+    it("should return a new function if the requestId changes", () => {
+        // Arrange
+        const handler = jest.fn();
+
+        // Act
+        const wrapper = renderHook(
+            ({requestId}) => useRequestInterception(requestId, handler),
+            {initialProps: {requestId: "ID"}},
+        );
+        const result1 = wrapper.result.current;
+        wrapper.rerender({requestId: "ID2"});
+        const result2 = wrapper.result.current;
+
+        // Assert
+        expect(result1).not.toBe(result2);
+    });
+
+    it("should return a new function if the handler changes", () => {
+        // Arrange
+
+        // Act
+        const wrapper = renderHook(
+            ({handler}) => useRequestInterception("ID", handler),
+            {initialProps: {handler: jest.fn()}},
+        );
+        const result1 = wrapper.result.current;
+        wrapper.rerender({handler: jest.fn()});
+        const result2 = wrapper.result.current;
+
+        // Assert
+        expect(result1).not.toBe(result2);
+    });
+
+    it("should return a new function if the context changes", () => {
+        // Arrange
+        const handler = jest.fn();
+        const interceptor1 = jest.fn();
+        const interceptor2 = jest.fn();
+        const Wrapper = ({children, interceptor}: any) => (
+            <InterceptRequests interceptor={interceptor}>
+                {children}
+            </InterceptRequests>
+        );
+
+        // Act
+        const wrapper = renderHook(
+            () => useRequestInterception("ID", handler),
+            {wrapper: Wrapper, initialProps: {interceptor: interceptor1}},
+        );
+        const result1 = wrapper.result.current;
+        wrapper.rerender({wrapper: Wrapper, interceptor: interceptor2});
+        const result2 = wrapper.result.current;
+
+        // Assert
+        expect(result1).not.toBe(result2);
+    });
+
+    describe("returned function", () => {
+        it("should invoke the original handler when there are no interceptors", () => {
+            // Arrange
+            const handler = jest.fn();
+            const requestId = "ID";
+            const {
+                result: {current: interceptedHandler},
+            } = renderHook(() => useRequestInterception(requestId, handler));
+
+            // Act
+            interceptedHandler();
+
+            // Assert
+            expect(handler).toHaveBeenCalledTimes(1);
+        });
+
+        it("should invoke interceptors nearest to furthest", () => {
+            // Arrange
+            const handler = jest.fn();
+            const interceptorFurthest = jest.fn(() => null);
+            const interceptorNearest = jest.fn(() => null);
+            const Wrapper = ({children}: any) => (
+                <InterceptRequests interceptor={interceptorFurthest}>
+                    <InterceptRequests interceptor={interceptorNearest}>
+                        {children}
+                    </InterceptRequests>
+                </InterceptRequests>
+            );
+            const {
+                result: {current: interceptedHandler},
+            } = renderHook(() => useRequestInterception("ID", handler), {
+                wrapper: Wrapper,
+            });
+
+            // Act
+            interceptedHandler();
+
+            // Assert
+            expect(interceptorNearest).toHaveBeenCalledBefore(
+                interceptorFurthest,
+            );
+        });
+
+        it("should invoke the handler last", () => {
+            // Arrange
+            const handler = jest.fn();
+            const interceptorFurthest = jest.fn(() => null);
+            const interceptorNearest = jest.fn(() => null);
+            const Wrapper = ({children}: any) => (
+                <InterceptRequests interceptor={interceptorFurthest}>
+                    <InterceptRequests interceptor={interceptorNearest}>
+                        {children}
+                    </InterceptRequests>
+                </InterceptRequests>
+            );
+            const {
+                result: {current: interceptedHandler},
+            } = renderHook(() => useRequestInterception("ID", handler), {
+                wrapper: Wrapper,
+            });
+
+            // Act
+            interceptedHandler();
+
+            // Assert
+            expect(interceptorFurthest).toHaveBeenCalledBefore(handler);
+        });
+
+        it("should invoke the original handler when there all interceptors return null", () => {
+            // Arrange
+            const handler = jest.fn();
+            const interceptor1 = jest.fn(() => null);
+            const interceptor2 = jest.fn(() => null);
+            const Wrapper = ({children}: any) => (
+                <InterceptRequests interceptor={interceptor1}>
+                    <InterceptRequests interceptor={interceptor2}>
+                        {children}
+                    </InterceptRequests>
+                </InterceptRequests>
+            );
+            const {
+                result: {current: interceptedHandler},
+            } = renderHook(() => useRequestInterception("ID", handler), {
+                wrapper: Wrapper,
+            });
+
+            // Act
+            interceptedHandler();
+
+            // Assert
+            expect(handler).toHaveBeenCalledTimes(1);
+        });
+
+        it("should return the result of the nearest interceptor that returns a non-null result", async () => {
+            // Arrange
+            const handler = jest
+                .fn()
+                .mockRejectedValue(
+                    new Error("This handler should have been intercepted"),
+                );
+            const interceptorFurthest = jest
+                .fn()
+                .mockRejectedValue(
+                    new Error("This interceptor should not get called"),
+                );
+            const interceptorNearest = jest
+                .fn()
+                .mockResolvedValue("INTERCEPTED_DATA");
+            const Wrapper = ({children}: any) => (
+                <InterceptRequests interceptor={interceptorFurthest}>
+                    <InterceptRequests interceptor={interceptorNearest}>
+                        {children}
+                    </InterceptRequests>
+                </InterceptRequests>
+            );
+            const {
+                result: {current: interceptedHandler},
+            } = renderHook(() => useRequestInterception("ID", handler), {
+                wrapper: Wrapper,
+            });
+
+            // Act
+            const result = await interceptedHandler();
+
+            // Assert
+            expect(result).toBe("INTERCEPTED_DATA");
+        });
+
+        it("should not invoke interceptors or handlers beyond a non-null interception", () => {
+            // Arrange
+            const handler = jest
+                .fn()
+                .mockRejectedValue(
+                    new Error("This handler should have been intercepted"),
+                );
+            const interceptorFurthest = jest
+                .fn()
+                .mockRejectedValue(
+                    new Error("This interceptor should not get called"),
+                );
+            const interceptorNearest = jest
+                .fn()
+                .mockResolvedValue("INTERCEPTED_DATA");
+            const Wrapper = ({children}: any) => (
+                <InterceptRequests interceptor={interceptorFurthest}>
+                    <InterceptRequests interceptor={interceptorNearest}>
+                        {children}
+                    </InterceptRequests>
+                </InterceptRequests>
+            );
+            const {
+                result: {current: interceptedHandler},
+            } = renderHook(() => useRequestInterception("ID", handler), {
+                wrapper: Wrapper,
+            });
+
+            // Act
+            interceptedHandler();
+
+            // Assert
+            expect(handler).not.toHaveBeenCalled();
+            expect(interceptorFurthest).not.toHaveBeenCalled();
+        });
+    });
+});

package/src/hooks/__tests__/use-server-effect.test.js

@@ -0,0 +1,217 @@
+// @flow
+import {renderHook as clientRenderHook} from "@testing-library/react-hooks";
+import {renderHook as serverRenderHook} from "@testing-library/react-hooks/server";
+
+import {Server} from "@khanacademy/wonder-blocks-core";
+
+import TrackData from "../../components/track-data.js";
+import {RequestFulfillment} from "../../util/request-fulfillment.js";
+import {SsrCache} from "../../util/ssr-cache.js";
+import {RequestTracker} from "../../util/request-tracking.js";
+
+import {useServerEffect} from "../use-server-effect.js";
+
+describe("#useServerEffect", () => {
+    beforeEach(() => {
+        const responseCache = new SsrCache();
+        jest.spyOn(SsrCache, "Default", "get").mockReturnValue(responseCache);
+        jest.spyOn(RequestFulfillment, "Default", "get").mockReturnValue(
+            new RequestFulfillment(responseCache),
+        );
+        jest.spyOn(RequestTracker, "Default", "get").mockReturnValue(
+            new RequestTracker(responseCache),
+        );
+    });
+
+    afterEach(() => {
+        jest.resetAllMocks();
+    });
+
+    describe("when server-side", () => {
+        beforeEach(() => {
+            jest.spyOn(Server, "isServerSide").mockReturnValue(true);
+        });
+
+        it("should return null if no cached result", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+
+            // Act
+            const {
+                result: {current: result},
+            } = serverRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(result).toBeNull();
+        });
+
+        it("should not directly request fulfillment", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+            const fulfillRequestSpy = jest.spyOn(
+                RequestFulfillment.Default,
+                "fulfill",
+            );
+
+            // Act
+            serverRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(fulfillRequestSpy).not.toHaveBeenCalled();
+        });
+
+        it("should track the request", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+            const trackDataRequestSpy = jest.spyOn(
+                RequestTracker.Default,
+                "trackDataRequest",
+            );
+
+            // Act
+            serverRenderHook(() => useServerEffect("ID", fakeHandler), {
+                wrapper: TrackData,
+            });
+
+            // Assert
+            expect(trackDataRequestSpy).toHaveBeenCalledWith(
+                "ID",
+                fakeHandler,
+                true,
+            );
+        });
+
+        it("should return data cached result", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+            jest.spyOn(SsrCache.Default, "getEntry").mockReturnValueOnce({
+                data: "DATA",
+                error: null,
+            });
+
+            // Act
+            const {
+                result: {current: result},
+            } = serverRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(result).toEqual({data: "DATA", error: null});
+        });
+
+        it("should return error cached result", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+            jest.spyOn(SsrCache.Default, "getEntry").mockReturnValueOnce({
+                data: null,
+                error: "ERROR",
+            });
+
+            // Act
+            const {
+                result: {current: result},
+            } = serverRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(result).toEqual({
+                data: null,
+                error: "ERROR",
+            });
+        });
+    });
+
+    describe("when client-side", () => {
+        beforeEach(() => {
+            jest.spyOn(Server, "isServerSide").mockReturnValue(false);
+        });
+
+        it("should return null if no cached result", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+
+            // Act
+            const {
+                result: {current: result},
+            } = clientRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(result).toBeNull();
+        });
+
+        it("should return data cached result", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+            jest.spyOn(SsrCache.Default, "getEntry").mockReturnValueOnce({
+                data: "DATA",
+                error: null,
+            });
+
+            // Act
+            const {
+                result: {current: result},
+            } = clientRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(result).toEqual({data: "DATA", error: null});
+        });
+
+        it("should return error cached result", () => {
+            // Arrange
+            const fakeHandler = jest.fn();
+            jest.spyOn(SsrCache.Default, "getEntry").mockReturnValueOnce({
+                data: null,
+                error: "ERROR",
+            });
+
+            // Act
+            const {
+                result: {current: result},
+            } = clientRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(result).toEqual({
+                data: null,
+                error: "ERROR",
+            });
+        });
+
+        it("should not track the request", () => {
+            // Arrange
+            const fakeHandler = jest.fn().mockReturnValue(
+                new Promise(() => {
+                    /*prevent act() warning*/
+                }),
+            );
+            const trackDataRequestSpy = jest.spyOn(
+                RequestTracker.Default,
+                "trackDataRequest",
+            );
+
+            // Act
+            clientRenderHook(() => useServerEffect("ID", fakeHandler), {
+                wrapper: TrackData,
+            });
+
+            // Assert
+            expect(trackDataRequestSpy).not.toHaveBeenCalled();
+        });
+
+        it("should not request fulfillment", () => {
+            // Arrange
+            const fakeHandler = jest.fn().mockReturnValue(
+                new Promise(() => {
+                    /*prevent act() warning*/
+                }),
+            );
+            const fulfillRequestSpy = jest.spyOn(
+                RequestFulfillment.Default,
+                "fulfill",
+            );
+
+            // Act
+            clientRenderHook(() => useServerEffect("ID", fakeHandler));
+
+            // Assert
+            expect(fulfillRequestSpy).not.toHaveBeenCalled();
+        });
+    });
+});