title: How to test subscription code after pipe(takeWhile(...)) in Angular 7
body: <p>I'm surprised I haven't been able to find an answer to this despite a lot of searching...</p>
  
  <p>I'm trying to test that my subscription code is doing the right thing.  I've done this countless times before in Angular 2, but we just started a new project so we're using the latest Angular which has picked up a re-write of rxjs that changed the chaining to piping and now I have no idea what to mock or how to do it.</p>
  
  <p>Given:</p>
  
  <pre><code>  constructor(private media: MediaObserver) { }
  
    ngOnInit() {
      this.active = true;
  
      this.media.media$.pipe(takeWhile((ev) =&gt; this.active)).subscribe((change: MediaChange) =&gt; {
        if (change.mqAlias === "xs" || change.mqAlias === "sm") {
          this.stackFooter = true;
        } else {
          this.stackFooter = false;
        }
      });
    }
  </code></pre>
  
  <p>How do I write a karma/jasmine test to make sure that this.stackFooter is being set correctly when the media service fires an event?
  I tried to spy on various things (media$, "pipe"), for example, but it appears the takeWhile() returns a new Observable which I don't seem to have any access to?  How can I test this?  Or, is this not a recommended pattern anymore and I should just be doing something else completely?</p>