title: Mocking a BehaviourSubject in a component test spec
body: <p>I am trying to mock out a service dependency inside a component test, this service has a behaviour subject property which I'm trying to mock.</p>
  
  <p>My service is as follows:</p>
  
  <pre><code>export class DatePickerService {
    public date: moment.Moment;
    public selectedDate: BehaviorSubject&lt;moment.Moment&gt; = new BehaviorSubject&lt;moment.Moment&gt;(moment());
  
    public changeDate = (date: moment.Moment) =&gt; {
      this.selectedDate.next(date);
    }
  }
  </code></pre>
  
  <p>The selectedDate is then subscribed to in my component:</p>
  
  <pre><code>ngOnInit() {
      this.datePickerService.selectedDate.subscribe((selectedDate) =&gt; {
          // do stuff here...
      }
  }
  </code></pre>
  
  <p>When it comes to testing my component, I am using the TestBed approach and supplying my own mock for the date picker service:</p>
  
  <pre><code>const mockDatePickerService = {
      selectedDate: jasmine.createSpy().and.returnValue(of(moment('01-01-2018', 'DD-MM-YYYY')))
  };
  
  beforeEach(async(() =&gt; {
      TestBed.configureTestingModule({
          declarations: [
              MyComponent
          ],
          providers: [
              HttpClient,
              HttpHandler,
              { provide: DatePickerService, useValue: mockDatePickerService }
          ],
          imports: [
              TranslateModule.forRoot(),
              RouterTestingModule
          ]
      })
      .compileComponents();
  }));
  </code></pre>
  
  <p>On trying to run my first test, I get an error from the </p>
  
  <pre><code>TypeError: undefined is not a constructor (evaluating 'this.datePickerService.selectedDate.subscribe')
  </code></pre>
  
  <p>If I log out the value of my service in the component's <code>onInit</code>, I do see my mock:</p>
  
  <pre><code>LOG: Object{selectedDate: function () { ... }}
  </code></pre>
  
  <p>So I'm unsure why i am seeing this undefined error, I am wondering if its my use of jasmine and the <code>returnValue</code> with the <code>of</code> invocation?</p>
  
  <p>Anyone got any ideas please?</p>
  
  <p>Thanks</p>