Fix/804 (#865)

* test for #804

* fix for #804

* changelog for #804

Changelog.md

@@ -1,6 +1,7 @@
 # Change log
 
 ### vNext
+- Fix: Fix issue where `withRef`-option of `graphql` did not work when the query was skipped [#865](https://github.com/apollographql/react-apollo/pull/865)
 
 ### 1.4.5
 - Fix: export all types from main type file

src/graphql.tsx

@@ -560,6 +560,12 @@ export default function graphql<
 
       render() {
         if (this.shouldSkip()) {
+          if (operationOptions.withRef) {
+            return createElement(
+              WrappedComponent,
+              assign({}, this.props, { ref: 'wrappedInstance' }),
+            );
+          }
           return createElement(WrappedComponent, this.props);
         }
 

test/react-web/client/graphql/shared-operations.test.tsx

@@ -67,6 +67,30 @@ describe('shared operations', () => {
       expect((decorated as any).refs.wrappedInstance.someMethod()).toEqual(
         testData,
       );
+
+      const DecoratedWithSkip = withApollo(Container, {
+        withRef: true,
+        skip: true,
+      });
+
+      const treeWithSkip = TestUtils.renderIntoDocument(
+        <ApolloProvider client={client}>
+          <DecoratedWithSkip />
+        </ApolloProvider>,
+      ) as any;
+
+      const decoratedWithSkip = TestUtils.findRenderedComponentWithType(
+        treeWithSkip,
+        DecoratedWithSkip,
+      );
+
+      expect(() => (decoratedWithSkip as any).someMethod()).toThrow();
+      expect(
+        (decoratedWithSkip as any).getWrappedInstance().someMethod(),
+      ).toEqual(testData);
+      expect(
+        (decoratedWithSkip as any).refs.wrappedInstance.someMethod(),
+      ).toEqual(testData);
     });
   });
 
@@ -280,6 +304,29 @@ describe('shared operations', () => {
     expect((decorated as any).refs.wrappedInstance.someMethod()).toEqual(
       testData,
     );
+
+    const DecoratedWithSkip = graphql(query, { withRef: true, skip: true })(
+      Container,
+    );
+
+    const treeWithSkip = TestUtils.renderIntoDocument(
+      <ApolloProvider client={client}>
+        <DecoratedWithSkip />
+      </ApolloProvider>,
+    ) as any;
+
+    const decoratedWithSkip = TestUtils.findRenderedComponentWithType(
+      treeWithSkip,
+      DecoratedWithSkip,
+    );
+
+    expect(() => (decoratedWithSkip as any).someMethod()).toThrow();
+    expect(
+      (decoratedWithSkip as any).getWrappedInstance().someMethod(),
+    ).toEqual(testData);
+    expect(
+      (decoratedWithSkip as any).refs.wrappedInstance.someMethod(),
+    ).toEqual(testData);
   });
 
   it('allows options to take an object', done => {