@khanacademy/wonder-blocks-testing 12.0.0 → 13.0.0

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @khanacademy/wonder-blocks-testing
 
+## 13.0.0
+
+### Major Changes
+
+-   eb807af8: When mocking GraphQL, consider explicit undefined values in a request to be equivalent to missing keys in a mock
+
+### Minor Changes
+
+-   16565a85: Add support for hard fails to the request mocking features
+
+### Patch Changes
+
+-   Updated dependencies [16565a85]
+    -   @khanacademy/wonder-blocks-testing-core@1.1.0
+
+## 12.0.1
+
+### Patch Changes
+
+-   02a1b298: Make sure we don't package tsconfig and tsbuildinfo files
+-   Updated dependencies [02a1b298]
+    -   @khanacademy/wonder-blocks-core@7.0.1
+    -   @khanacademy/wonder-blocks-data@13.0.12
+    -   @khanacademy/wonder-blocks-testing-core@1.0.2
+
 ## 12.0.0
 
 ### Major Changes

package/dist/es/index.js

@@ -6,8 +6,7 @@ import { InterceptRequests } from '@khanacademy/wonder-blocks-data';
 import { KindError, Errors } from '@khanacademy/wonder-stuff-core';
 import { RenderStateRoot } from '@khanacademy/wonder-blocks-core';
 
-const safeHasOwnProperty = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-const areObjectsEqual = (a, b) => {
+const areObjectsEquivalent = (a, b) => {
   if (a === b) {
     return true;
   }
@@ -19,12 +18,9 @@ const areObjectsEqual = (a, b) => {
   }
   const aKeys = Object.keys(a);
   const bKeys = Object.keys(b);
-  if (aKeys.length !== bKeys.length) {
-    return false;
-  }
-  for (let i = 0; i < aKeys.length; i++) {
-    const key = aKeys[i];
-    if (!safeHasOwnProperty(b, key) || !areObjectsEqual(a[key], b[key])) {
+  const allKeys = new Set([...aKeys, ...bKeys]);
+  for (const key of allKeys) {
+    if (!areObjectsEquivalent(a[key], b[key])) {
       return false;
     }
   }
@@ -35,12 +31,12 @@ const gqlRequestMatchesMock = (mock, operation, variables, context) => {
     return false;
   }
   if (mock.variables != null) {
-    if (!areObjectsEqual(mock.variables, variables)) {
+    if (!areObjectsEquivalent(mock.variables, variables)) {
       return false;
     }
   }
   if (mock.context != null) {
-    if (!areObjectsEqual(mock.context, context)) {
+    if (!areObjectsEquivalent(mock.context, context)) {
       return false;
     }
   }

package/dist/gql/types.d.ts

@@ -1,14 +1,74 @@
 import type { GqlOperation, GqlContext } from "@khanacademy/wonder-blocks-data";
-import type { GraphQLJson, MockResponse } from "@khanacademy/wonder-blocks-testing-core";
+import type { ConfigureFn, GraphQLJson, MockResponse } from "@khanacademy/wonder-blocks-testing-core";
+/**
+ * A GraphQL operation to be mocked.
+ *
+ * This is used to specify what a request must match in order for a mock to
+ * be used.
+ */
 export type GqlMockOperation<TData extends Record<any, any>, TVariables extends Record<any, any>, TContext extends GqlContext> = {
     operation: GqlOperation<TData, TVariables>;
     variables?: TVariables;
     context?: TContext;
 };
-type GqlMockOperationFn = <TData extends Record<any, any>, TVariables extends Record<any, any>, TContext extends GqlContext, TResponseData extends GraphQLJson<TData>>(operation: GqlMockOperation<TData, TVariables, TContext>, response: MockResponse<TResponseData>) => GqlFetchMockFn;
-export type GqlFetchMockFn = {
+interface GqlMockOperationFn {
+    <TData extends Record<any, any>, TVariables extends Record<any, any>, TContext extends GqlContext, TResponseData extends GraphQLJson<TData>>(
+    /**
+     * The operation to match.
+     */
+    operation: GqlMockOperation<TData, TVariables, TContext>, 
+    /**
+     * The response to return when the operation is matched.
+     */
+    response: MockResponse<TResponseData>): GqlFetchMockFn;
+}
+export interface GqlFetchMockFn {
+    /**
+     * The mock fetch function.
+     *
+     * This function is a drop-in replacement for the gqlFetch function used
+     * by Wonder Blocks Data. You should not need to call this function
+     * directly. Just pass this in places where you would pass a gqlFetch
+     * function, as provided by the GqlRouter.
+     */
     (operation: GqlOperation<any, any>, variables: Record<any, any> | null | undefined, context: GqlContext): Promise<Response>;
+    /**
+     * Mock a fetch operation.
+     *
+     * This adds a response for a given mocked operation. Operations are
+     * matched greedily, so if only the GraphQL operation is provided, then
+     * all requests for that operation will be matched, regardless of
+     * variables or context.
+     *
+     * Regardless of how many times this mock is matched, it will be used.
+     *
+     * @returns The mock fetch function for chaining.
+     */
     mockOperation: GqlMockOperationFn;
+    /**
+     * Mock a fetch operation once.
+     *
+     * This adds a response for a given mocked operation. Operations are
+     * matched greedily, so if only the GraphQL operation is provided, then
+     * all requests for that operation will be matched, regardless of
+     * variables or context.
+     *
+     * Once the added mock is used, it will be discarded and no longer match
+     * any requests.
+     *
+     * @returns The mock fetch function for chaining.
+     */
     mockOperationOnce: GqlMockOperationFn;
-};
+    /**
+     * Configure the mock fetch function with the given configuration.
+     *
+     * This function is provided as a convenience to allow for configuring the
+     * mock fetch function in a fluent manner. The configuration is applied
+     * to all mocks for a given fetch function; the last configuration applied
+     * will be the one that is used for all mocked operations.
+     *
+     * @returns The mock fetch function for chaining.
+     */
+    configure: ConfigureFn<GqlMockOperation<any, any, any>, GraphQLJson<any>>;
+}
 export {};

package/dist/index.js

@@ -32,8 +32,7 @@ function _interopNamespace(e) {
 var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-const safeHasOwnProperty = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-const areObjectsEqual = (a, b) => {
+const areObjectsEquivalent = (a, b) => {
   if (a === b) {
     return true;
   }
@@ -45,12 +44,9 @@ const areObjectsEqual = (a, b) => {
   }
   const aKeys = Object.keys(a);
   const bKeys = Object.keys(b);
-  if (aKeys.length !== bKeys.length) {
-    return false;
-  }
-  for (let i = 0; i < aKeys.length; i++) {
-    const key = aKeys[i];
-    if (!safeHasOwnProperty(b, key) || !areObjectsEqual(a[key], b[key])) {
+  const allKeys = new Set([...aKeys, ...bKeys]);
+  for (const key of allKeys) {
+    if (!areObjectsEquivalent(a[key], b[key])) {
       return false;
     }
   }
@@ -61,12 +57,12 @@ const gqlRequestMatchesMock = (mock, operation, variables, context) => {
     return false;
   }
   if (mock.variables != null) {
-    if (!areObjectsEqual(mock.variables, variables)) {
+    if (!areObjectsEquivalent(mock.variables, variables)) {
       return false;
     }
   }
   if (mock.context != null) {
-    if (!areObjectsEqual(mock.context, context)) {
+    if (!areObjectsEquivalent(mock.context, context)) {
       return false;
     }
   }

package/package.json

@@ -1,36 +1,36 @@
 {
-    "name": "@khanacademy/wonder-blocks-testing",
-    "version": "12.0.0",
-    "design": "v1",
-    "publishConfig": {
-        "access": "public"
-    },
-    "description": "",
-    "main": "dist/index.js",
-    "module": "dist/es/index.js",
-    "types": "dist/index.d.ts",
-    "scripts": {
-        "test": "echo \"Error: no test specified\" && exit 1"
-    },
-    "dependencies": {
-        "@babel/runtime": "^7.18.6",
-        "@khanacademy/wonder-blocks-core": "^7.0.0",
-        "@khanacademy/wonder-blocks-data": "^13.0.11",
-        "@khanacademy/wonder-blocks-testing-core": "^1.0.1"
-    },
-    "peerDependencies": {
-        "@khanacademy/wonder-stuff-core": "^1.2.2",
-        "@storybook/addon-actions": "^7.0.0",
-        "aphrodite": "^1.2.5",
-        "node-fetch": "^2.6.7",
-        "react": "16.14.0",
-        "react-dom": "16.14.0",
-        "react-router-dom": "5.3.0"
-    },
-    "devDependencies": {
-        "@khanacademy/wb-dev-build-settings": "^1.0.1",
-        "@khanacademy/wonder-stuff-testing": "^3.0.1"
-    },
-    "author": "",
-    "license": "MIT"
-}
+  "name": "@khanacademy/wonder-blocks-testing",
+  "version": "13.0.0",
+  "design": "v1",
+  "publishConfig": {
+    "access": "public"
+  },
+  "description": "",
+  "main": "dist/index.js",
+  "module": "dist/es/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.18.6",
+    "@khanacademy/wonder-blocks-core": "^7.0.1",
+    "@khanacademy/wonder-blocks-data": "^13.0.12",
+    "@khanacademy/wonder-blocks-testing-core": "^1.1.0"
+  },
+  "peerDependencies": {
+    "@khanacademy/wonder-stuff-core": "^1.2.2",
+    "@storybook/addon-actions": "^7.0.0",
+    "aphrodite": "^1.2.5",
+    "node-fetch": "^2.6.7",
+    "react": "16.14.0",
+    "react-dom": "16.14.0",
+    "react-router-dom": "5.3.0"
+  },
+  "devDependencies": {
+    "@khanacademy/wb-dev-build-settings": "^1.0.1",
+    "@khanacademy/wonder-stuff-testing": "^3.0.1"
+  },
+  "author": "",
+  "license": "MIT"
+}

package/src/gql/__tests__/gql-request-matches-mock.test.ts

@@ -1,234 +0,0 @@
-import {gqlRequestMatchesMock} from "../gql-request-matches-mock";
-
-describe("#gqlRequestMatchesMock", () => {
-    it("should return false if operation types don't match", () => {
-        // Arrange
-        const mock = {
-            operation: {
-                id: "foo",
-                type: "query",
-            },
-        } as const;
-        const operation = {
-            id: "foo",
-            type: "mutation",
-        } as const;
-
-        // Act
-        const result = gqlRequestMatchesMock(mock, operation, null, {});
-
-        // Assert
-        expect(result).toBe(false);
-    });
-
-    it("should return false if operation ids don't match", () => {
-        // Arrange
-        const mock = {
-            operation: {
-                id: "foo",
-                type: "query",
-            },
-        } as const;
-
-        // Act
-        const result = gqlRequestMatchesMock(
-            mock,
-            {
-                id: "bar",
-                type: "query",
-            },
-            null,
-            {},
-        );
-
-        // Assert
-        expect(result).toBe(false);
-    });
-
-    it.each([{foo: "bar"}, {foo: "baz", anExtra: "property"}, null])(
-        "should return false if variables don't match",
-        (variables: any) => {
-            // Arrange
-            const mock = {
-                operation: {
-                    id: "foo",
-                    type: "query",
-                },
-                variables: {
-                    foo: "baz",
-                },
-            } as const;
-            const operation = {
-                id: "foo",
-                type: "query",
-            } as const;
-
-            // Act
-            const result = gqlRequestMatchesMock(
-                mock,
-                operation,
-                variables,
-                {},
-            );
-
-            // Assert
-            expect(result).toBe(false);
-        },
-    );
-
-    it.each([{a: "context"}, null])(
-        "should return false if contexts don't match",
-        (context: any) => {
-            // Arrange
-            const mock = {
-                operation: {
-                    id: "foo",
-                    type: "query",
-                },
-                variables: {
-                    foo: "bar",
-                },
-                context: {
-                    mock: "context",
-                },
-            } as const;
-            const operation = {
-                id: "foo",
-                type: "query",
-            } as const;
-            const variables = {
-                foo: "bar",
-            } as const;
-
-            // Act
-            const result = gqlRequestMatchesMock(
-                mock,
-                operation,
-                variables,
-                context,
-            );
-
-            // Assert
-            expect(result).toBe(false);
-        },
-    );
-
-    it("should return true if operation matches and mock does not include context nor variables, regardless of comparison operation variables and context", () => {
-        // Arrange
-        const mock = {
-            operation: {
-                id: "foo",
-                type: "query",
-            },
-        } as const;
-
-        // Act
-        const result = gqlRequestMatchesMock(
-            mock,
-            {
-                id: "foo",
-                type: "query",
-            },
-            {a: "variable"},
-            {my: "context"},
-        );
-
-        // Assert
-        expect(result).toBe(true);
-    });
-
-    it("should return true if operation and variables match and there is no mock context", () => {
-        // Arrange
-        const mock = {
-            operation: {
-                id: "foo",
-                type: "query",
-            },
-            variables: {
-                foo: "bar",
-            },
-        } as const;
-
-        // Act
-        const result = gqlRequestMatchesMock(
-            mock,
-            {
-                id: "foo",
-                type: "query",
-            },
-            {
-                foo: "bar",
-            },
-            {my: "context"},
-        );
-
-        // Assert
-        expect(result).toBe(true);
-    });
-
-    it("should return true if operation and context match and there are no mock variables", () => {
-        // Arrange
-        const mock = {
-            operation: {
-                id: "foo",
-                type: "query",
-            },
-            context: {
-                foo: "bar",
-            },
-        } as const;
-
-        // Act
-        const result = gqlRequestMatchesMock(
-            mock,
-            {
-                id: "foo",
-                type: "query",
-            },
-            {a: "variable"},
-            {
-                foo: "bar",
-            },
-        );
-
-        // Assert
-        expect(result).toBe(true);
-    });
-
-    it("should return true if everything matches", () => {
-        // Arrange
-        const mock = {
-            operation: {
-                id: "foo",
-                type: "query",
-            },
-            variables: {
-                foo: "bar",
-            },
-            context: {
-                foo: "bar",
-            },
-        } as const;
-        const operation = {
-            id: "foo",
-            type: "query",
-        } as const;
-        const variables = {
-            foo: "bar",
-        } as const;
-        const context = {
-            foo: "bar",
-        } as const;
-
-        // Act
-        const result = gqlRequestMatchesMock(
-            mock,
-            operation,
-            {...variables},
-            {...context},
-        );
-
-        // Assert
-        expect(result).toBe(true);
-    });
-});