feat(StoreDevtools): Allow custom serializer options (#1121)

ngrx · Jun 13, 2018 · 55a0488 · 55a0488
1 parent fb9b172
commit 55a0488
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 4 deletions.
diff --git a/modules/store-devtools/spec/extension.spec.ts b/modules/store-devtools/spec/extension.spec.ts
@@ -15,7 +15,7 @@ import { unliftState } from '../src/utils';
 function createOptions(
   name: string = 'NgRx Store DevTools',
   features: any = false,
-  serialize: boolean = false,
+  serialize: boolean | undefined = false,
   maxAge: false | number = false
 ) {
   const options: ReduxDevtoolsExtensionConfig = {
@@ -116,6 +116,25 @@ describe('DevtoolsExtension', () => {
     expect(reduxDevtoolsExtension.connect).toHaveBeenCalledWith(options);
   });
 
+  it('should connect with custom serializer', () => {
+    const customSerializer = {
+      replacer: (key: {}, value: any) => value,
+    };
+
+    devtoolsExtension = new DevtoolsExtension(
+      reduxDevtoolsExtension,
+      createConfig({
+        name: 'ngrx-store-devtool-todolist',
+        serialize: customSerializer,
+      })
+    );
+    // Subscription needed or else extension connection will not be established.
+    devtoolsExtension.actions$.subscribe(() => null);
+    expect(reduxDevtoolsExtension.connect).toHaveBeenCalledWith(
+      jasmine.objectContaining({ serialize: customSerializer })
+    );
+  });
+
   describe('notify', () => {
     it('should send notification with default options', () => {
       devtoolsExtension = new DevtoolsExtension(

diff --git a/modules/store-devtools/src/config.ts b/modules/store-devtools/src/config.ts
@@ -3,14 +3,21 @@ import { InjectionToken, Type } from '@angular/core';
 
 export type ActionSanitizer = (action: Action, id: number) => Action;
 export type StateSanitizer = (state: any, index: number) => any;
+export type SerializationOptions = {
+  options?: boolean | any;
+  replacer?: (key: any, value: any) => {};
+  reviver?: (key: any, value: any) => {};
+  immutable?: any;
+  refs?: Array<any>;
+};
 
 export class StoreDevtoolsConfig {
   maxAge: number | false;
   monitor: ActionReducer<any, any>;
   actionSanitizer?: ActionSanitizer;
   stateSanitizer?: StateSanitizer;
   name?: string;
-  serialize?: boolean;
+  serialize?: boolean | SerializationOptions;
   logOnly?: boolean;
   features?: any;
 }

diff --git a/modules/store-devtools/src/extension.ts b/modules/store-devtools/src/extension.ts
@@ -4,7 +4,11 @@ import { empty, Observable } from 'rxjs';
 import { filter, map, share, switchMap, takeUntil } from 'rxjs/operators';
 
 import { PERFORM_ACTION } from './actions';
-import { STORE_DEVTOOLS_CONFIG, StoreDevtoolsConfig } from './config';
+import {
+  SerializationOptions,
+  STORE_DEVTOOLS_CONFIG,
+  StoreDevtoolsConfig,
+} from './config';
 import { LiftedAction, LiftedState } from './reducer';
 import {
   sanitizeAction,
@@ -37,7 +41,7 @@ export interface ReduxDevtoolsExtensionConfig {
   name: string | undefined;
   instanceId: string;
   maxAge?: number;
-  serialize?: boolean;
+  serialize?: boolean | SerializationOptions;
 }
 
 export interface ReduxDevtoolsExtension {