title: How to mock AWS amplify methods in Angular unit testing
body: <p>I am using <a href="https://aws.amazon.com/cognito/" rel="nofollow noreferrer">AWS cognito</a>, <a href="https://aws.amazon.com/amplify/" rel="nofollow noreferrer">Amplify</a> and <a href="https://angular.io/" rel="nofollow noreferrer">Angular 10</a>.</p>
  <p>I want a navbar not to be rendered if a user is not logged in:</p>
  <p>app.html:</p>
  <pre><code>&lt;ng-container *ngIf=&quot;isLoggedIn&quot;&gt;
    &lt;navbar&gt;&lt;/navbar&gt;
  &lt;/ng-container&gt;
  </code></pre>
  <p>app.ts:</p>
  <pre><code>constructor() {
    this.checkIfLoggedIn();
  }
  
  checkIfLoggedIn() {
    Auth.currentUserInfo().then((userData) =&gt; {
      if (userData) {
        this.isLoggedIn = true;
      }
    });
  }
  </code></pre>
  <p>This works. However, my unit tests (<a href="https://karma-runner.github.io/latest/index.html" rel="nofollow noreferrer">Karma</a>/<a href="https://jasmine.github.io/" rel="nofollow noreferrer">Jasmine</a>) throw an error:</p>
  <pre><code>Error: Amplify has not been configured correctly.
          The configuration object is missing required auth properties.
  </code></pre>
  <p>This is because I don't know hot to mock <code>Auth.currentUserInfo.then</code> correctly (despite reading various posts about it like <a href="https://stackoverflow.com/questions/59215244/how-to-mock-aws-amplify-library-in-angular">this</a> or <a href="https://stackoverflow.com/questions/60454057/how-do-i-properly-mock-amplify-for-unit-testing-in-jasmine">that</a>).</p>
  <p>Attempts:</p>
  <p><strong>1) SpyOn</strong></p>
  <p>I thought it would be something like <code>spyOn(Auth, 'currentUserInfo').and.returnValue(Promise.resolve(true));</code></p>
  <p><strong>2) Mocking <code>Auth</code> in providers</strong></p>
  <p>like suggested in the <a href="https://stackoverflow.com/questions/65250583/how-to-mock-aws-amplify-methods-in-angular-unit-testing?noredirect=1#comment115356708_65250583">comments</a>.</p>
  <pre><code>import { Auth } from 'aws-amplify';
  
  beforeEach(async () =&gt; {
    await TestBed.configureTestingModule({
      declarations: [AppComponent],
      providers: [
        {
          provide: Auth,
          useValue: { currentUserInfo: () =&gt; Promise.resolve('hello') },
        },
      ],
    }).compileComponents();
  }
  </code></pre>
  <p>Unfortunately they don't make the error message go away.</p>