title: Stubbing out Angular services in Cypress
body: <p>I have this Angular web application I want to run e2e tests on a mocked out REST API. I can stub out my network requests to my REST API easy enough, but the authentication is using a third-party provider (Cognito using Amplify).</p>
  <p>Now I want to stub out the Angular service that wraps the authentication.</p>
  <p>In Angular I have</p>
  <pre><code>@Injectable({
    providedIn: 'root'
  })
  export class AuthenticationService {
    some methods
  
    isSignedIn(): Observable&lt;boolean&gt; {
      ...
    }
  }
  </code></pre>
  <p>I want to stub the <code>isSignedIn()</code>-method. My first attempt looks something like this:</p>
  <pre><code>import {AuthenticationService} from &quot;../../src/app/authentication.service&quot;;
  import {BehaviorSubject} from &quot;rxjs&quot;;
  
  context('albums', () =&gt; {
  
    it('get albums', () =&gt; {
      cy.stub(AuthenticationService,'isSignedIn').returns(new BehaviorSubject(true));
    }
  }
  </code></pre>
  <p>Cypress/Chrome then complains it cannot find AuthenticationService on that location. How do I solve this?</p>