feat: allow adding keys from the context to the breadcrumb (#7)

README.md

@@ -90,7 +90,6 @@ const defaultOptions = {
     /**
      * Include context keys as extra data in the breadcrumb. Accepts dot notation.
      * The data is stringified and formatted. Can be used to include headers for instance.
-     * Note that this option is not yet implemented.
      */
     includeContextKeys: [],
   },

package.json

@@ -28,6 +28,7 @@
     "@sentry/types": "^5.12.4",
     "apollo-link": "^1.2.13",
     "deepmerge": "^4.2.2",
+    "dot-prop": "^5.2.0",
     "graphql": "^14.6.0"
   },
   "devDependencies": {

src/Operation.ts

@@ -1,4 +1,5 @@
 import { Operation as ApolloOperation } from 'apollo-link';
+import dotProp from 'dot-prop';
 
 import { ApolloLinkSentry } from './types';
 import { isEmpty } from './utils';
@@ -82,4 +83,21 @@ export class Operation {
       ? this.operation.query?.loc.source.body
       : undefined
   );
+
+  /**
+   * Get a set of keys from the context using dot notation
+   * @param {string[]} keys
+   * @returns {{[p: string]: any} | undefined}
+   */
+  public getContextKeys = (keys: string[]): { [s: string]: any } | undefined => {
+    const context = this.operation.getContext();
+
+    const find = keys
+      .map((key): object | undefined => ({ [key]: dotProp.get(context, key) }))
+      .reduce((a: object, b: any): object => ({ ...a, ...b }), {});
+
+    return !isEmpty(find)
+      ? find
+      : undefined;
+  };
 }

src/OperationsBreadcrumb.ts

@@ -107,6 +107,22 @@ export class OperationsBreadcrumb {
     return this;
   };
 
+  /**
+   * Set the breadcrumb's context
+   * @param {object | undefined} context
+   * @returns {OperationsBreadcrumb}
+   */
+  addContext = (context: object | undefined): OperationsBreadcrumb => {
+    if (isEmpty(context)) return this;
+
+    this.breadcrumb.data = {
+      ...this.breadcrumb.data,
+      context: stringifyObject(context),
+    };
+
+    return this;
+  };
+
   /**
    * Set the breadcrumb's response data
    * @param {object | undefined} response

src/SentryLink.ts

@@ -21,6 +21,7 @@ const defaultOptions: ApolloLinkSentry.Options = {
     includeVariables: false,
     includeResponse: false,
     includeError: false,
+    includeContextKeys: [],
   },
 };
 
@@ -98,6 +99,10 @@ export class SentryLink extends ApolloLink {
     if (this.options.breadcrumb?.includeVariables) {
       breadcrumb.addVariables(operation.variables);
     }
+
+    if (this.options?.breadcrumb?.includeContextKeys?.length) {
+      breadcrumb.addContext(operation.getContextKeys(this.options.breadcrumb.includeContextKeys));
+    }
   };
 
   /**

src/types.ts

@@ -15,6 +15,7 @@ export namespace ApolloLinkSentry {
         cache?: string,
         response?: string,
         error?: string,
+        context?: string,
       }
     }
   }
@@ -26,6 +27,7 @@ export namespace ApolloLinkSentry {
     includeVariables?: boolean;
     includeResponse?: boolean;
     includeError?: boolean;
+    includeContextKeys?: string[];
   }
 
   export interface Options {

tests/Operation.test.ts

@@ -38,4 +38,15 @@ describe('Operation', () => {
     const query = OperationStub.query.loc?.source.body;
     expect(operation['getQuery']()).toEqual(query);
   });
+
+  it('should be possible to get context keys', () => {
+    const operation = new Operation(OperationStub);
+    const { headers } = OperationStub.getContext();
+
+    const keys = ['headers', 'someOtherContext.lorem.ipsum'];
+    const context = operation['getContextKeys'](keys);
+
+    expect(context?.headers).toEqual(headers);
+    expect(context?.['someOtherContext.lorem.ipsum']).toBeTruthy();
+  });
 });

tests/OperationsBreadcrumb.test.ts

@@ -65,6 +65,15 @@ describe('OperationsBreadcrumb', () => {
     expect(data?.variables).toBe(stringifyObject(variables));
   });
 
+  it('should be possible to set the context', () => {
+    const context = { headers: { 'X-Debug': true } };
+
+    const breadcrumb = new OperationsBreadcrumb();
+    const { data } = breadcrumb.addContext(context)['breadcrumb'];
+
+    expect(data?.context).toBe(stringifyObject(context));
+  });
+
   it('should be possible to add a response', () => {
     const response = { status: 200, data: { success: true } };
 

tests/SentryLink.test.ts

@@ -261,5 +261,22 @@ describe('SentryLink', () => {
 
       expect(originalReport.fingerprint).toBeUndefined();
     });
+
+    test('should add context keys to the breadcrumb', () => {
+      const keys = ['headers', 'someOtherContext.lorem.ipsum'];
+      const link = new SentryLink({ breadcrumb: { includeContextKeys: keys } });
+      const breadcrumb = new OperationsBreadcrumb();
+      const operation = new Operation(OperationStub);
+      const context = operation['getContextKeys'](keys);
+
+      link.fillBreadcrumb(breadcrumb, operation);
+      link.attachBreadcrumbToSentry(breadcrumb);
+      Sentry.captureException(new Error('Error'));
+
+      const [report] = testkit.reports();
+      const [crumb] = report.breadcrumbs;
+
+      expect(crumb.data?.context).toBe(stringifyObject(context));
+    });
   });
 });

tests/stubs/Operation.ts

@@ -116,6 +116,16 @@ const operation: Operation = {
         freezeResults: false,
       },
     },
+    headers: {
+      'App-Impersonation-Key': 'a0cb2511-d7b1-47a2-ad59-da06bf2f1a10',
+    },
+    someOtherContext: {
+      lorem: {
+        ipsum: {
+          dorem: true,
+        },
+      },
+    },
   }),
 
   setContext: (): any => {},