Support for @skip and @include

src/QueryManager.ts

@@ -401,6 +401,8 @@ export class QueryManager {
           let resultFromStore;
           try {
             // ensure result is combined with data already in store
+            // this will throw an error if there are missing fields that were
+            // included (e.g. @skip was false).
             resultFromStore = readSelectionSetFromStore({
               store: this.getApolloState().data,
               rootId: querySS.id,

src/data/diffAgainstStore.ts

@@ -32,6 +32,10 @@ import {
   FragmentMap,
 } from '../queries/getFromAST';
 
+import {
+  shouldInclude,
+} from '../queries/directives';
+
 export interface DiffResult {
   result: any;
   isMissing?: 'true';
@@ -120,6 +124,8 @@ export function diffSelectionSetAgainstStore({
   selectionSet.selections.forEach((selection) => {
     // Don't push more than one missing field per field in the query
     let missingFieldPushed = false;
+    const included = shouldInclude(selection, variables);
+
     function pushMissingField(missingField: Selection) {
       if (!missingFieldPushed) {
         missingFields.push(missingField);
@@ -128,25 +134,30 @@ export function diffSelectionSetAgainstStore({
     }
 
     if (isField(selection)) {
-      const {
-        result: fieldResult,
-        isMissing: fieldIsMissing,
-      } = diffFieldAgainstStore({
-        field: selection,
-        throwOnMissingField,
-        variables,
-        rootId,
-        store,
-        fragmentMap,
-      });
-
-      if (fieldIsMissing) {
-        pushMissingField(selection);
+      if (included) {
+        const {
+          result: fieldResult,
+          isMissing: fieldIsMissing,
+        } = diffFieldAgainstStore({
+          field: selection,
+          throwOnMissingField,
+          variables,
+          rootId,
+          store,
+          fragmentMap,
+        });
+
+        if (fieldIsMissing) {
+          pushMissingField(selection);
+        } else {
+          const resultFieldKey = resultKeyNameFromField(selection);
+
+          result[resultFieldKey] = fieldResult;
+        }
       } else {
-        const resultFieldKey = resultKeyNameFromField(selection);
-
-        result[resultFieldKey] = fieldResult;
+        pushMissingField(selection);
       }
+
     } else if (isInlineFragment(selection)) {
       const {
         result: fieldResult,

src/data/writeToStore.ts

@@ -33,6 +33,10 @@ import {
   IdGetter,
 } from './extensions';
 
+import {
+  shouldInclude,
+} from '../queries/directives';
+
 // import {
 //   printAST,
 // } from './debug';
@@ -130,24 +134,32 @@ export function writeSelectionSetToStore({
     //to us for the fragments.
     fragmentMap = {};
   }
+
   selectionSet.selections.forEach((selection) => {
     if (isField(selection)) {
       const resultFieldKey: string = resultKeyNameFromField(selection);
       const value: any = result[resultFieldKey];
+      const included = shouldInclude(selection, variables);
 
-      if (isUndefined(value)) {
+      if (isUndefined(value) && included) {
         throw new Error(`Can't find field ${resultFieldKey} on result object ${dataId}.`);
       }
 
-      writeFieldToStore({
-        dataId,
-        value,
-        variables,
-        store,
-        field: selection,
-        dataIdFromObject,
-        fragmentMap,
-      });
+      if (!isUndefined(value) && !included) {
+        throw new Error(`Found extra field ${resultFieldKey} on result object ${dataId}.`);
+      }
+
+      if (!isUndefined(value)) {
+        writeFieldToStore({
+          dataId,
+          value,
+          variables,
+          store,
+          field: selection,
+          dataIdFromObject,
+          fragmentMap,
+        });
+      }
     } else if (isInlineFragment(selection)) {
       // XXX what to do if this tries to write the same fields? Also, type conditions...
       writeSelectionSetToStore({

src/queries/directives.ts

@@ -0,0 +1,65 @@
+// Provides the methods that allow QueryManager to handle
+// the `skip` and `include` directives within GraphQL.
+import {
+  Selection,
+  Variable,
+  BooleanValue,
+  Directive,
+} from 'graphql';
+
+export function evaluateSkipInclude(directive: Directive, variables: { [name: string]: any }): Boolean {
+  //evaluate the "if" argument and skip (i.e. return undefined) if it evaluates to true.
+  const directiveArguments = directive.arguments;
+  if (directiveArguments.length !== 1) {
+    throw new Error(`Incorrect number of arguments for the @$(directiveName} directive.`);
+  }
+
+  const directiveName = directive.name.value;
+  const ifArgument = directive.arguments[0];
+  if (!ifArgument.name || ifArgument.name.value !== 'if') {
+    throw new Error(`Invalid argument for the @${directiveName} directive.`);
+  }
+
+  const ifValue = directive.arguments[0].value;
+  let evaledValue: Boolean = false;
+  if (!ifValue || ifValue.kind !== 'BooleanValue') {
+    // means it has to be a variable value if this is a valid @skip or @include directive
+    if (ifValue.kind !== 'Variable') {
+      throw new Error(`Invalid argument value for the @${directiveName} directive.`);
+    } else {
+      evaledValue = variables[(ifValue as Variable).name.value];
+      if (evaledValue === undefined) {
+        throw new Error(`Invalid variable referenced in @${directiveName} directive.`);
+      }
+    }
+  } else {
+    evaledValue = (ifValue as BooleanValue).value;
+  }
+
+  if (directiveName === 'skip') {
+    evaledValue = !evaledValue;
+  }
+
+  return evaledValue;
+}
+
+export function shouldInclude(selection: Selection, variables?: { [name: string]: any }): Boolean {
+  if (!variables) {
+    variables = {};
+  }
+
+  if (!selection.directives) {
+    return true;
+  }
+
+  let res: Boolean = true;
+  selection.directives.map((directive) => {
+    if (directive.name.value !== 'skip' && directive.name.value !== 'include') {
+      throw new Error(`Directive ${directive.name.value} not supported.`);
+    }
+    if (!evaluateSkipInclude(directive, variables)) {
+      res = false;
+    }
+  });
+  return res;
+}

src/store.ts

@@ -72,21 +72,29 @@ export function createApolloStore({
   reduxRootKey = 'apollo',
   initialState,
   config = {},
+  reportCrashes,
 }: {
   reduxRootKey?: string,
   initialState?: any,
   config?: ApolloReducerConfig,
+  reportCrashes?: boolean,
 } = {}): ApolloStore {
   const enhancers = [];
 
+  if (reportCrashes === undefined) {
+    reportCrashes = true;
+  }
+
   if (typeof window !== 'undefined') {
     const anyWindow = window as any;
     if (anyWindow.devToolsExtension) {
       enhancers.push(anyWindow.devToolsExtension());
     }
   }
 
-  enhancers.push(applyMiddleware(crashReporter));
+  if (reportCrashes) {
+    enhancers.push(applyMiddleware(crashReporter));
+  }
 
   return createStore(
     combineReducers({ [reduxRootKey]: createApolloReducer(config) }),

test/client.ts

@@ -26,6 +26,14 @@ import {
   applyMiddleware,
 } from 'redux';
 
+import {
+  createApolloStore,
+} from '../src/store';
+
+import {
+  QueryManager,
+} from '../src/QueryManager';
+
 import {
   createNetworkInterface,
   HTTPNetworkInterface,
@@ -707,6 +715,89 @@ describe('client', () => {
     });
   });
 
+  describe('directives', () => {
+    it('should be able to send a query with a skip directive true', (done) => {
+      const query = gql`
+        query {
+          fortuneCookie @skip(if: true)
+        }`;
+      const result = {};
+      const networkInterface = mockNetworkInterface(
+        {
+          request: { query },
+          result: { data: result },
+        }
+      );
+      const client = new ApolloClient({
+        networkInterface,
+      });
+      client.query({ query }).then((actualResult) => {
+        assert.deepEqual(actualResult.data, result);
+        done();
+      });
+    });
+
+    it('should be able to send a query with a skip directive false', (done) => {
+      const query = gql`
+        query {
+          fortuneCookie @skip(if: false)
+        }`;
+      const result = {
+        fortuneCookie: 'result',
+      };
+      const networkInterface = mockNetworkInterface(
+        {
+          request: { query },
+          result: { data: result },
+        }
+      );
+      const client = new ApolloClient({
+        networkInterface,
+      });
+      client.query({ query }).then((actualResult) => {
+        assert.deepEqual(actualResult.data, result);
+        done();
+      });
+    });
+
+    it('should reject the query promise if skipped data arrives in the result', (done) => {
+      const query = gql`
+        query {
+          fortuneCookie @skip(if: true)
+          otherThing
+        }`;
+      const result = {
+        fortuneCookie: 'you will go far',
+        otherThing: 'false',
+      };
+      const networkInterface = mockNetworkInterface(
+        {
+          request: { query },
+          result: { data: result },
+        }
+      );
+      const client = new ApolloClient({
+        networkInterface,
+      });
+      // we need this so it doesn't print out a bunch of stuff we don't need
+      // when we're trying to test an exception.
+      client.store = createApolloStore({ reportCrashes: false });
+      client.queryManager = new QueryManager({
+        networkInterface,
+        store: client.store,
+        reduxRootKey: 'apollo',
+      });
+
+      client.query({ query }).then(() => {
+        // do nothing
+      }).catch((error) => {
+        assert.include(error.message, 'Found extra field');
+        done();
+      });
+
+    });
+  });
+
   describe('accepts dataIdFromObject option', () => {
     const query = gql`
       query people {