title: Jasmine Unit test - Cannot read property pipe of undefined
body: <p>I am using Angular 6, NgRx 6, RxJS 6.</p>
  
  <p>I have a route guard that looked like this -</p>
  
  <pre><code>import { CanActivate, ActivatedRouteSnapshot } from '@angular/router';
  import { Injectable } from '@angular/core';
  import { Observable, of } from 'rxjs';
  import { IAppState } from '../../../app.state';
  import { Store } from '@ngrx/store';
  
  import { SetTenant } from './../../../store/config/config.actions';
  
  @Injectable()
  export default class TenantGuard implements CanActivate {
    constructor(private store: Store&lt;IAppState&gt;) {}
  
    canActivate(route: ActivatedRouteSnapshot): Observable&lt;boolean&gt; {
      const tenant = route.params['tenant'];
  
      if (!tenant) {
        return of(false);
      }
  
      this.store.dispatch(new SetTenant(tenant));
      return of(true);
    }
  }
  </code></pre>
  
  <p>As you can see, I was adding my <code>tenant</code> to the store via <code>this.store.dispatch(new SetTenant(tenant));</code></p>
  
  <p>This was however causing that action to fire every time a user visited the base route.</p>
  
  <p>In order to combat this, I have added a check to see if the <code>tenant</code> is populated and only fire the action if not -</p>
  
  <pre><code>import { CanActivate, ActivatedRouteSnapshot } from '@angular/router';
  import { Injectable } from '@angular/core';
  import { Observable, of, combineLatest } from 'rxjs';
  import { IAppState } from '../../../app.state';
  import { Store, select } from '@ngrx/store';
  
  import { SetTenant } from './../../../store/config/config.actions';
  import { getTenant } from '../../../store/config/config.selectors';
  import { map } from 'rxjs/operators';
  
  @Injectable()
  export default class TenantGuard implements CanActivate {
    constructor(private store: Store&lt;IAppState&gt;) {}
  
    canActivate(route: ActivatedRouteSnapshot): Observable&lt;boolean&gt; {
      const tenantFromRoute: string = route.params['tenant'];
  
      return this.store.pipe(select(getTenant)).pipe(
        map(tenantFromStore =&gt; {
          if (!tenantFromRoute) {
            return false;
          }
  
          if (!tenantFromStore) {
            this.store.dispatch(new SetTenant(tenantFromRoute));
          }
          return true;
        })
      );
    }
  }
  </code></pre>
  
  <p>This has however broken my unit tests as I have introduced additional logic and I am now getting the error <code>TypeError: Cannot read property 'pipe' of undefined</code></p>
  
  <p>My spec file looks like this -</p>
  
  <pre><code>import { TestBed, async } from '@angular/core/testing';
  import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
  import { Store } from '@ngrx/store';
  import { StoreModule } from '@ngrx/store';
  
  import { SetTenant } from './../../../store/config/config.actions';
  
  import TenantGuard from './tenant.guard';
  
  describe('TenantGuard', () =&gt; {
    it('should return false if a tenant is not present on the route', async(() =&gt; {
      const { tenantGuard, props } = setup({});
      let result: boolean;
      tenantGuard.canActivate(props).subscribe(canActivate =&gt; (result = canActivate));
      expect(result).toBeFalsy();
    }));
  
    it('should return true if a tenant is present on the route', async(() =&gt; {
      const { tenantGuard, props } = setup({ tenant: 'main' });
      let result: boolean;
      tenantGuard.canActivate(props).subscribe(canActivate =&gt; (result = canActivate));
      expect(result).toBeTruthy();
    }));
  
    it('should dispatch an action to set the tenant in the store', () =&gt; {
      const { store, tenantGuard, props } = setup({ tenant: 'foo' });
      const action = new SetTenant('foo');
      tenantGuard.canActivate(props);
  
      expect(store.dispatch).toHaveBeenCalledWith(action);
    });
  
    it('should not dispatch an action to set the tenant in the store if the tenant is missing', () =&gt; {
      const { store, tenantGuard, props } = setup({});
      tenantGuard.canActivate(props);
  
      expect(store.dispatch).not.toHaveBeenCalled();
    });
  
    const setup = propOverrides =&gt; {
      TestBed.configureTestingModule({
        imports: [StoreModule.forRoot({})],
        providers: [
          TenantGuard,
          {
            provide: Store,
            useValue: jasmine.createSpyObj('Store', ['dispatch', 'pipe']),
          },
        ],
        schemas: [CUSTOM_ELEMENTS_SCHEMA],
      }).compileComponents();
  
      const props = Object.assign({ params: { tenant: null } }, { params: { ...propOverrides } });
  
      const tenantGuard = TestBed.get(TenantGuard);
      const store = TestBed.get(Store);
  
      return { tenantGuard, props, store };
    };
  });
  </code></pre>
  
  <p>I have added <code>pipe</code> to my <code>jasmine.createSpyObj</code> however I am unsure how to progress.</p>
  
  <p>I would like to write additional tests around this, but am having trouble mocking out how <code>pipe</code> should / would be used in this case.</p>
  
  <p>Edit - If I do not pass <code>pipe</code> in to my <code>jasmine.createSpyObj</code> I instead get the error <code>​​TypeError: this.store.pipe is not a function​​
  </code></p>