Merge pull request #1535 from boxwise/ignore-expected-graphql-errors-…

…in-tests

Stop logging expected GraphQL errors in test output

front/src/components/BoxReconciliationOverlay/BoxReconciliationOverlay.test.tsx

@@ -6,7 +6,6 @@ import { mockAuthenticatedUser } from "mocks/hooks";
 import { generateMockShipment } from "mocks/shipments";
 import { ShipmentState } from "types/generated/graphql";
 import { organisation1 } from "mocks/organisations";
-import { GraphQLError } from "graphql";
 import { cache, boxReconciliationOverlayVar, IBoxReconciliationOverlayVar } from "queries/cache";
 import { generateMockLocationWithBase } from "mocks/locations";
 import { products } from "mocks/products";
@@ -15,6 +14,7 @@ import { userEvent } from "@testing-library/user-event";
 import { SHIPMENT_BY_ID_WITH_PRODUCTS_AND_LOCATIONS_QUERY } from "queries/queries";
 import { UPDATE_SHIPMENT_WHEN_RECEIVING } from "queries/mutations";
 import { mockedCreateToast, mockedTriggerError } from "tests/setupTests";
+import { FakeGraphQLError, FakeGraphQLNetworkError } from "mocks/functions";
 
 vi.mock("@auth0/auth0-react");
 // @ts-ignore
@@ -57,7 +57,7 @@ const failedQueryShipmentDetailForBoxReconciliation = {
     },
   },
   result: {
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 };
 
@@ -115,9 +115,9 @@ const mockUpdateShipmentWhenReceivingMutation = ({
           : {
               updateShipmentWhenReceiving: generateMockShipment({ state: ShipmentState.Receiving }),
             },
-        errors: graphQlError ? [new GraphQLError("Error!")] : undefined,
+        errors: graphQlError ? [new FakeGraphQLError()] : undefined,
       },
-  error: networkError ? new Error() : undefined,
+  error: networkError ? new FakeGraphQLNetworkError() : undefined,
 });
 
 const noDeliveryTests = [

front/src/components/QrReaderOverlay/QrReaderOverlay.test.tsx

@@ -1,5 +1,4 @@
 import { vi, beforeEach, it, expect } from "vitest";
-import { GraphQLError } from "graphql";
 import { userEvent } from "@testing-library/user-event";
 import { screen, render, waitFor } from "tests/test-utils";
 import HeaderMenuContainer from "components/HeaderMenu/HeaderMenuContainer";
@@ -13,6 +12,7 @@ import {
 } from "queries/queries";
 import { generateMockBox } from "mocks/boxes";
 import { mockedTriggerError } from "tests/setupTests";
+import { FakeGraphQLError } from "mocks/functions";
 
 vi.mock("@auth0/auth0-react");
 vi.mock("components/QrReader/components/QrReaderScanner");
@@ -34,7 +34,7 @@ const queryFindNoBoxAssociated = {
     data: {
       box: null,
     },
-    errors: [new GraphQLError("Error!", { extensions: { code: "BAD_USER_INPUT" } })],
+    errors: [new FakeGraphQLError("BAD_USER_INPUT")],
   },
 };
 
@@ -119,7 +119,7 @@ const queryFindBoxFromOtherOrg = {
     data: {
       box: null,
     },
-    errors: [new GraphQLError("Error!", { extensions: { code: "FORBIDDEN" } })],
+    errors: [new FakeGraphQLError("FORBIDDEN")],
   },
 };
 
@@ -246,7 +246,7 @@ const queryBoxFromOtherOrganisation = {
         box: null,
       },
     },
-    errors: [new GraphQLError("Error!", { extensions: { code: "FORBIDDEN" } })],
+    errors: [new FakeGraphQLError("FORBIDDEN")],
   },
 };
 
@@ -317,7 +317,7 @@ const queryHashNotInDb = {
   },
   result: {
     data: null,
-    errors: [new GraphQLError("Error!", { extensions: { code: "BAD_USER_INPUT" } })],
+    errors: [new FakeGraphQLError("BAD_USER_INPUT")],
   },
 };
 
@@ -360,7 +360,7 @@ const queryInternalServerError = {
   },
   result: {
     data: null,
-    errors: [new GraphQLError("Error!", { extensions: { code: "INTERNAL_SERVER_ERROR" } })],
+    errors: [new FakeGraphQLError("INTERNAL_SERVER_ERROR")],
   },
 };
 

front/src/mocks/functions.ts

@@ -20,14 +20,28 @@ export function mockMatchMediaQuery(returnBool: Boolean) {
   });
 }
 
-// mock an Apollo GraphQLError
+export class FakeGraphQLError extends GraphQLError {
+  constructor(errorCode?: string, errorDescription?: string) {
+    super(
+      "Fake GraphQL Error",
+      errorCode ? { extensions: { code: errorCode, description: errorDescription } } : undefined,
+    );
+  }
+}
+
+export class FakeGraphQLNetworkError extends Error {
+  constructor() {
+    super("Fake GraphQL Network Error");
+  }
+}
+
 export const mockGraphQLError = (query, variables = {}) => ({
   request: {
     query,
     variables,
   },
   result: {
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 });
 
@@ -37,5 +51,5 @@ export const mockNetworkError = (query, variables = {}) => ({
     query,
     variables,
   },
-  error: new Error(),
+  error: new FakeGraphQLNetworkError(),
 });

front/src/tests/test-utils.tsx

@@ -24,7 +24,7 @@ import {
 } from "providers/GlobalPreferencesProvider";
 import { organisation1 } from "mocks/organisations";
 import { base1 } from "mocks/bases";
-import { mockMatchMediaQuery } from "mocks/functions";
+import { FakeGraphQLError, FakeGraphQLNetworkError, mockMatchMediaQuery } from "mocks/functions";
 
 // Options for Apollo MockProvider
 const defaultOptions: DefaultOptions = {
@@ -75,22 +75,35 @@ function render(
     mediaQueryReturnValue?: boolean;
   },
 ) {
-  // Log if there is an error in the mock
-  const mockLink = new MockLink(mocks);
-  const errorLoggingLink = onError(({ graphQLErrors, networkError }) => {
+  // set showWarnings to false, as we'll log them via the onError callback instead
+  const mockLink = new MockLink(mocks, undefined, { showWarnings: false });
+  const errorLoggingLink = onError((error: any) => {
+    const { graphQLErrors, networkError } = error;
     if (graphQLErrors) {
-      graphQLErrors.map(({ message, locations, path }) =>
-        console.error(
-          `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`,
-        ),
-      );
+      for (const error of graphQLErrors) {
+        // log errors, but only if they aren't ones we set up in a mock
+        // TODO: figure out how to fail the outer test once these are fixed
+        if (!(error instanceof FakeGraphQLError)) {
+          console.error(`[GraphQL error]: ${error}`);
+        }
+      }
+      return;
     }
     if (networkError) {
-      console.error(`[Network error]: ${networkError}`);
+      // log errors, but only if they aren't ones we set up in a mock
+      // TODO: figure out how to fail the outer test once these are fixed
+      if (!(networkError instanceof FakeGraphQLNetworkError)) {
+        console.error(`[GraphQL network error]: ${networkError}`);
+      }
+      return;
     }
+    console.error(`[Unknown Error]: ${error}`);
+  });
+  mockLink.setOnError((error) => {
+    console.error(`[MockLink Error]: ${error}`);
   });
-  const link = ApolloLink.from([errorLoggingLink, mockLink]);
 
+  const link = ApolloLink.from([errorLoggingLink, mockLink]);
   const globalPreferencesMock: IGlobalPreferencesContext = {
     dispatch: vi.fn(),
     globalPreferences: {

front/src/views/Box/BoxView.test.tsx

@@ -1,5 +1,4 @@
 import { vi, beforeEach, it, expect } from "vitest";
-import { GraphQLError } from "graphql";
 import { screen, render, waitFor } from "tests/test-utils";
 import { userEvent } from "@testing-library/user-event";
 import { cache } from "queries/cache";
@@ -10,7 +9,7 @@ import { product1, product3, products } from "mocks/products";
 import { BOX_BY_LABEL_IDENTIFIER_AND_ALL_PRODUCTS_WITH_BASEID_QUERY } from "views/BoxEdit/BoxEditView";
 import { tags } from "mocks/tags";
 import { textContentMatcher } from "tests/helpers";
-import { mockMatchMediaQuery } from "mocks/functions";
+import { FakeGraphQLError, FakeGraphQLNetworkError, mockMatchMediaQuery } from "mocks/functions";
 import { BOX_BY_LABEL_IDENTIFIER_AND_ALL_SHIPMENTS_QUERY } from "queries/queries";
 import { organisation1 } from "mocks/organisations";
 import { mockedCreateToast, mockedTriggerError } from "tests/setupTests";
@@ -280,7 +279,7 @@ const initialFailedQuery = {
     },
   },
   result: {
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 };
 
@@ -323,7 +322,7 @@ const updateNumberOfItemsFailedMutation = {
     },
   },
   result: {
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 };
 
@@ -336,7 +335,7 @@ const moveLocationOfBoxFailedMutation = {
     },
   },
   result: {
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 };
 
@@ -348,7 +347,7 @@ const moveLocationOfBoxNetworkFailedMutation = {
       newLocationId: 10,
     },
   },
-  error: new Error(),
+  error: new FakeGraphQLNetworkError(),
 };
 
 beforeEach(() => {

front/src/views/BoxEdit/BoxEditView.test.tsx

@@ -1,5 +1,4 @@
 import { it, expect } from "vitest";
-import { GraphQLError } from "graphql";
 import { userEvent } from "@testing-library/user-event";
 import { screen, render, waitFor } from "tests/test-utils";
 import { assertOptionsInSelectField, selectOptionInSelectField } from "tests/helpers";
@@ -13,6 +12,7 @@ import BoxEditView, {
   BOX_BY_LABEL_IDENTIFIER_AND_ALL_PRODUCTS_WITH_BASEID_QUERY,
   UPDATE_CONTENT_OF_BOX_MUTATION,
 } from "./BoxEditView";
+import { FakeGraphQLError, FakeGraphQLNetworkError } from "mocks/functions";
 
 const initialQuery = {
   request: {
@@ -43,7 +43,7 @@ const initialQueryNetworkError = {
     },
   },
   result: {
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 };
 
@@ -55,7 +55,7 @@ const initialQueryGraphQLError = {
       labelIdentifier: "123",
     },
   },
-  error: new Error(),
+  error: new FakeGraphQLNetworkError(),
 };
 
 const successfulMutation = {
@@ -107,7 +107,7 @@ const mutationNetworkError = {
       comment: "Test",
     },
   },
-  error: new Error(),
+  error: new FakeGraphQLNetworkError(),
 };
 
 const mutationGraphQLError = {
@@ -124,7 +124,7 @@ const mutationGraphQLError = {
     },
   },
   result: {
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 };
 

front/src/views/Boxes/BoxesView.test.tsx

@@ -1,5 +1,4 @@
 import { vi, it, describe, expect } from "vitest";
-import { GraphQLError } from "graphql";
 import { userEvent } from "@testing-library/user-event";
 import { base2 } from "mocks/bases";
 import { organisation1, organisation2 } from "mocks/organisations";
@@ -11,6 +10,7 @@ import { TableSkeleton } from "components/Skeletons";
 import { Suspense } from "react";
 import { cache } from "queries/cache";
 import Boxes, { ACTION_OPTIONS_FOR_BOXESVIEW_QUERY, BOXES_FOR_BOXESVIEW_QUERY } from "./BoxesView";
+import { FakeGraphQLError, FakeGraphQLNetworkError } from "mocks/functions";
 
 const boxesQuery = {
   request: {
@@ -400,7 +400,7 @@ const initialQueryNetworkError = {
     },
   },
 
-  error: new Error(),
+  error: new FakeGraphQLNetworkError(),
 };
 
 const initialQueryGraphQLError = {
@@ -417,7 +417,7 @@ const initialQueryGraphQLError = {
     data: {
       boxes: null,
     },
-    errors: [new GraphQLError("Error!")],
+    errors: [new FakeGraphQLError()],
   },
 };
 

front/src/views/Boxes/BoxesViewActions.test.tsx

@@ -10,14 +10,14 @@ import { cache, tableConfigsVar } from "queries/cache";
 import { render, screen, waitFor } from "tests/test-utils";
 import { userEvent } from "@testing-library/user-event";
 import { ASSIGN_BOXES_TO_SHIPMENT } from "hooks/useAssignBoxesToShipment";
-import { GraphQLError } from "graphql";
 import { gql } from "@apollo/client";
 import { AlertWithoutAction } from "components/Alerts";
 import { TableSkeleton } from "components/Skeletons";
 import { Suspense } from "react";
 import { ErrorBoundary } from "@sentry/react";
 import { mockedCreateToast } from "tests/setupTests";
 import Boxes, { ACTION_OPTIONS_FOR_BOXESVIEW_QUERY, BOXES_FOR_BOXESVIEW_QUERY } from "./BoxesView";
+import { FakeGraphQLError, FakeGraphQLNetworkError } from "mocks/functions";
 
 const boxesQuery = ({
   state = BoxState.InStock,
@@ -92,9 +92,9 @@ const mutation = ({
     ? undefined
     : {
         data: graphQlError ? null : resultData,
-        errors: graphQlError ? [new GraphQLError("Error!")] : undefined,
+        errors: graphQlError ? [new FakeGraphQLError()] : undefined,
       },
-  error: networkError ? new Error() : undefined,
+  error: networkError ? new FakeGraphQLNetworkError() : undefined,
 });
 
 vi.mock("@auth0/auth0-react");

front/src/views/QrReader/QrReaderMultiBox.test.tsx

@@ -1,5 +1,4 @@
 import { vi, beforeEach, it, expect } from "vitest";
-import { GraphQLError } from "graphql";
 import { userEvent } from "@testing-library/user-event";
 import { screen, render, waitFor } from "tests/test-utils";
 import { useAuth0 } from "@auth0/auth0-react";
@@ -16,6 +15,7 @@ import { cache } from "queries/cache";
 import { locations } from "mocks/locations";
 import { mockedCreateToast, mockedTriggerError } from "tests/setupTests";
 import QrReaderView from "./QrReaderView";
+import { FakeGraphQLError, FakeGraphQLNetworkError } from "mocks/functions";
 
 const mockSuccessfulQrQuery = ({
   query = GET_BOX_LABEL_IDENTIFIER_BY_QR_CODE,
@@ -186,9 +186,9 @@ const mockFailedQrQuery = ({
                 },
               }
             : null,
-        errors: [new GraphQLError("Error!", { extensions: { code: errorCode } })],
+        errors: [new FakeGraphQLError(errorCode)],
       },
-  error: networkError ? new Error() : undefined,
+  error: networkError ? new FakeGraphQLNetworkError() : undefined,
 });
 
 const qrScanningInMultiBoxTabTestsFailing = [