Allow MockedResponse results to be returned from a function (#2788)

* Allow `MockedResponse` results to be returned from a function

The `result` property of a `MockedResponse` is currently
restricted to being a pre-configured fixed value. Allowing
results to be calculated/returned from a function instead of
being pre-configured, opens up new test verification paths,
that can be useful when using `MockedProvider`.

This commit adjusts `MockedResponse`’s `result` such that if
a function is set for its value, that function will be fired and
its result will be passed to the Observable matching the
incoming mocked `request`.

Fixes apollographql/apollo-feature-requests#84.

* Update src/test-links.ts

Co-Authored-By: hwillson <hugh@octonary.com>

Changelog.md

@@ -6,6 +6,13 @@
 
 ### Improvements
 
+- A function can now be set as a `MockedResponse` `result` when using
+  `MockedProvider`, such that every time the mocked result is returned,
+  the function is run to calculate the result. This opens up new testing
+  possibilities, like being able to verify if a mocked result was actually
+  requested and received by a test.  <br/>
+  [@hwillson](https://github.com/hwillson) in [#2788](https://github.com/apollographql/react-apollo/pull/2788)
+
 ## 2.4.1
 
 ### Improvements

src/test-links.ts

@@ -11,12 +11,14 @@ import { print } from 'graphql/language/printer';
 import { addTypenameToDocument } from 'apollo-utilities';
 const isEqual = require('lodash.isequal');
 
+type ResultFunction<T> = () => T;
+
 export interface MockedResponse {
   request: GraphQLRequest;
-  result?: FetchResult;
+  result?: FetchResult | ResultFunction<FetchResult>;
   error?: Error;
   delay?: number;
-  newData?: () => FetchResult;
+  newData?: ResultFunction<FetchResult>;
 }
 
 export interface MockedSubscriptionResult {
@@ -86,12 +88,18 @@ export class MockLink extends ApolloLink {
       throw new Error(`Mocked response should contain either result or error: ${key}`);
     }
 
-    return new Observable<FetchResult>(observer => {
+    return new Observable(observer => {
       let timer = setTimeout(() => {
         if (error) {
           observer.error(error);
         } else {
-          if (result) observer.next(result);
+          if (result) {
+            observer.next(
+              typeof result === 'function'
+                ? (result as ResultFunction<FetchResult>)()
+                : result
+            );
+          }
           observer.complete();
         }
       }, delay ? delay : 0);

test/test-utils.test.tsx

@@ -349,3 +349,67 @@ it('doesnt crash on unmount if there is no query manager', () => {
     )
     .unmount();
 });
+
+it('should support returning mocked results from a function', done => {
+  let resultReturned = false;
+
+  const testUser = {
+    __typename: 'User',
+    id: 12345,
+  };
+
+  class Container extends React.Component<ChildProps<Variables, Data, Variables>> {
+    componentWillReceiveProps(nextProps: ChildProps<Variables, Data, Variables>) {
+      try {
+        expect(nextProps.data!.user).toEqual(testUser);
+        expect(resultReturned).toBe(true);
+        done();
+      } catch (e) {
+        done.fail(e);
+      }
+    }
+
+    render() {
+      return null;
+    }
+  }
+
+  const ContainerWithData = withUser(Container);
+
+  const testQuery: DocumentNode = gql`
+    query GetUser($username: String!) {
+      user(username: $username) {
+        id
+      }
+    }
+  `;
+
+  const testVariables = {
+    username: 'jsmith',
+  };
+  const testMocks = [
+    {
+      request: {
+        query: testQuery,
+        variables: testVariables,
+      },
+      result() {
+        resultReturned = true;
+        return {
+          data: {
+            user: {
+              __typename: 'User',
+              id: 12345,
+            },
+          },
+        };
+      },
+    },
+  ];
+
+  renderer.create(
+    <MockedProvider mocks={testMocks}>
+      <ContainerWithData {...testVariables} />
+    </MockedProvider>,
+  );
+});