feat(apollo-cache-inmemory): support custom directives

Before this change, using a custom directive corrupted the cache.

It is now possible to safely use a custom directive without breaking it.

Example of custom directives: https://github.com/smooth-code/graphql-directive

Author: gregberge

packages/apollo-cache-inmemory/src/__tests__/readFromStore.ts

@@ -165,6 +165,38 @@ describe('reading from the store', () => {
     });
   });
 
+  it('runs a basic query with custom directives', () => {
+    const query = gql`
+      query {
+        id
+        firstName @include(if: true)
+        lastName @upperCase
+        birthDate @dateFormat(format: "DD-MM-YYYY")
+      }
+    `;
+
+    const store = defaultNormalizedCacheFactory({
+      ROOT_QUERY: {
+        id: 'abcd',
+        firstName: 'James',
+        'lastName@upperCase': 'BOND',
+        'birthDate@dateFormat({"format":"DD-MM-YYYY"})': '20-05-1940',
+      },
+    });
+
+    const result = readQueryFromStore({
+      store,
+      query,
+    });
+
+    expect(result).toEqual({
+      id: 'abcd',
+      firstName: 'James',
+      lastName: 'BOND',
+      birthDate: '20-05-1940',
+    });
+  });
+
   it('runs a basic query with default values for arguments', () => {
     const query = gql`
       query someBigQuery(

packages/apollo-cache-inmemory/src/__tests__/writeToStore.ts

@@ -221,6 +221,38 @@ describe('writing to the store', () => {
     });
   });
 
+  it('properly normalizes a query with custom directives', () => {
+    const query = gql`
+      query {
+        id
+        firstName @include(if: true)
+        lastName @upperCase
+        birthDate @dateFormat(format: "DD-MM-YYYY")
+      }
+    `;
+
+    const result: any = {
+      id: 'abcd',
+      firstName: 'James',
+      lastName: 'BOND',
+      birthDate: '20-05-1940',
+    };
+
+    const normalized = writeQueryToStore({
+      result,
+      query,
+    });
+
+    expect(normalized.toObject()).toEqual({
+      ROOT_QUERY: {
+        id: 'abcd',
+        firstName: 'James',
+        'lastName@upperCase': 'BOND',
+        'birthDate@dateFormat({"format":"DD-MM-YYYY"})': '20-05-1940',
+      },
+    });
+  });
+
   it('properly normalizes a nested object with an ID', () => {
     const query = gql`
       {

packages/apollo-utilities/src/storeUtils.ts

@@ -164,6 +164,8 @@ export type Directives = {
   };
 };
 
+const KNOWN_DIRECTIVES: string[] = ['connection', 'include', 'skip'];
+
 export function getStoreKeyName(
   fieldName: string,
   args?: Object,
@@ -197,13 +199,25 @@ export function getStoreKeyName(
     }
   }
 
+  let completeFieldName: string = fieldName;
+
   if (args) {
     const stringifiedArgs: string = JSON.stringify(args);
+    completeFieldName += `(${stringifiedArgs})`;
+  }
 
-    return `${fieldName}(${stringifiedArgs})`;
+  if (directives && Object.keys(directives).length) {
+    Object.keys(directives).forEach(key => {
+      if (KNOWN_DIRECTIVES.indexOf(key) !== -1) return;
+      if (directives[key] && Object.keys(directives[key]).length) {
+        completeFieldName += `@${key}(${JSON.stringify(directives[key])})`;
+      } else {
+        completeFieldName += `@${key}`;
+      }
+    });
   }
 
-  return fieldName;
+  return completeFieldName;
 }
 
 export function argumentsObjectFromField(