passing devtool options to the ReduxDevToolExtension add new spec tes…

…ts to verify its really ending options to redux dev tool extension #517

modules/store-devtools/spec/extension.spec.ts

@@ -0,0 +1,79 @@
+import {
+  StoreDevtools,
+  StoreDevtoolsModule,
+  LiftedState,
+  StoreDevtoolsConfig,
+  StoreDevtoolsOptions,
+} from '../';
+import {
+  StoreModule,
+  Store,
+  StateObservable,
+  ActionReducer,
+  Action,
+  ReducerManager,
+} from '@ngrx/store';
+import { of } from 'rxjs/observable/of';
+import { createConfig, noMonitor } from '../src/instrument';
+import { DevtoolsExtension, ReduxDevtoolsExtension } from '../src/extension';
+
+describe('DevtoolsExtension', () => {
+  let reduxDevtoolsExtension: ReduxDevtoolsExtension;
+  let devtoolsExtension: DevtoolsExtension;
+
+  beforeEach(() => {
+    reduxDevtoolsExtension = jasmine.createSpyObj('reduxDevtoolsExtension', [
+      'send',
+      'connect',
+    ]);
+    (reduxDevtoolsExtension.connect as jasmine.Spy).and.returnValue(of({}));
+    spyOn(Date, 'now').and.returnValue('1509655064369');
+  });
+
+  describe('notify', () => {
+    it('should send notification with default options', () => {
+      devtoolsExtension = new DevtoolsExtension(
+        reduxDevtoolsExtension,
+        createConfig({})
+      );
+      const defaultOptions = {
+        maxAge: false,
+        monitor: noMonitor,
+        name: 'ngrx-store-devtool-instance',
+        serialize: false,
+      };
+      const action = {} as Action;
+      const state = {} as LiftedState;
+      devtoolsExtension.notify(action, state);
+      expect(reduxDevtoolsExtension.send).toHaveBeenCalledWith(
+        null,
+        {},
+        defaultOptions,
+        'ngrx-store-1509655064369'
+      );
+    });
+    it('should send notification with given options', () => {
+      devtoolsExtension = new DevtoolsExtension(
+        reduxDevtoolsExtension,
+        createConfig({
+          name: 'ngrx-store-devtool-todolist',
+        })
+      );
+      const defaultOptions = {
+        maxAge: false,
+        monitor: noMonitor,
+        name: 'ngrx-store-devtool-todolist',
+        serialize: false,
+      };
+      const action = {} as Action;
+      const state = {} as LiftedState;
+      devtoolsExtension.notify(action, state);
+      expect(reduxDevtoolsExtension.send).toHaveBeenCalledWith(
+        null,
+        {},
+        defaultOptions,
+        'ngrx-store-1509655064369'
+      );
+    });
+  });
+});

modules/store-devtools/src/config.ts

@@ -2,9 +2,10 @@ import { ActionReducer, Action } from '@ngrx/store';
 import { InjectionToken, Type } from '@angular/core';
 
 export class StoreDevtoolsConfig {
-  maxAge: number | false;
-  monitor: ActionReducer<any, any>;
-  name: string;
+  maxAge?: number | false;
+  monitor?: ActionReducer<any, any>;
+  name?: string;
+  serialize?: boolean;
 }
 
 export const STORE_DEVTOOLS_CONFIG = new InjectionToken<StoreDevtoolsConfig>(

modules/store-devtools/src/devtools.ts

@@ -52,6 +52,7 @@ export class StoreDevtools implements Observer<any> {
       {
         maxAge: config.maxAge as number,
         name: config.name,
+        serialize: config.serialize,
       }
     );
 

modules/store-devtools/src/extension.ts

@@ -1,12 +1,14 @@
-import { InjectionToken, Inject, Injectable } from '@angular/core';
+import { Inject, Injectable, InjectionToken } from '@angular/core';
+import { Action } from '@ngrx/store';
 import { Observable } from 'rxjs/Observable';
 import { empty } from 'rxjs/observable/empty';
 import { filter } from 'rxjs/operator/filter';
 import { map } from 'rxjs/operator/map';
 import { share } from 'rxjs/operator/share';
 import { switchMap } from 'rxjs/operator/switchMap';
 import { takeUntil } from 'rxjs/operator/takeUntil';
-import { Action } from '@ngrx/store';
+
+import { STORE_DEVTOOLS_CONFIG, StoreDevtoolsConfig } from './config';
 import { LiftedState } from './reducer';
 import { applyOperators } from './utils';
 
@@ -35,7 +37,7 @@ export interface ReduxDevtoolsExtension {
   send(
     action: any,
     state: any,
-    options?: boolean | { serialize: boolean | object },
+    options: StoreDevtoolsConfig,
     instanceId?: string
   ): void;
 }
@@ -49,7 +51,8 @@ export class DevtoolsExtension {
   actions$: Observable<any>;
 
   constructor(
-    @Inject(REDUX_DEVTOOLS_EXTENSION) devtoolsExtension: ReduxDevtoolsExtension
+    @Inject(REDUX_DEVTOOLS_EXTENSION) devtoolsExtension: ReduxDevtoolsExtension,
+    @Inject(STORE_DEVTOOLS_CONFIG) private config: StoreDevtoolsConfig
   ) {
     this.devtoolsExtension = devtoolsExtension;
     this.createActionStreams();
@@ -60,12 +63,7 @@ export class DevtoolsExtension {
       return;
     }
 
-    this.devtoolsExtension.send(
-      null,
-      state,
-      { serialize: false },
-      this.instanceId
-    );
+    this.devtoolsExtension.send(null, state, this.config, this.instanceId);
   }
 
   private createChangesObservable(): Observable<any> {

modules/store-devtools/src/instrument.ts

@@ -64,15 +64,16 @@ export function noMonitor(): null {
   return null;
 }
 
-export const DEFAULT_NAME = 'store-devtool-instance';
+export const DEFAULT_NAME = 'ngrx-store-devtool-instance';
 
 export function createConfig(
   _options: StoreDevtoolsOptions
 ): StoreDevtoolsConfig {
-  const DEFAULT_OPTIONS: StoreDevtoolsConfig = {
+  const DEFAULT_OPTIONS: Partial<StoreDevtoolsConfig> = {
     maxAge: false,
     monitor: noMonitor,
     name: DEFAULT_NAME,
+    serialize: false,
   };
 
   let options = typeof _options === 'function' ? _options() : _options;

modules/store-devtools/src/reducer.ts

@@ -9,6 +9,7 @@ import {
 
 import { difference, liftAction } from './utils';
 import * as Actions from './actions';
+import { StoreDevtoolsConfig } from './config';
 
 export type InitAction = {
   readonly type: typeof INIT;
@@ -129,7 +130,7 @@ export function liftReducerWith(
   initialCommittedState: any,
   initialLiftedState: LiftedState,
   monitorReducer?: any,
-  options: { maxAge?: number; name?: string } = {}
+  options: Partial<StoreDevtoolsConfig> = {}
 ) {
   /**
   * Manages how the history actions modify the history state.