title: Jasmine spy not getting called, even though the specified method executes properly
body: <p>Im currently implementing Jasmine in my Angular project. But somehow I stumbled across an odd behaviour with spies. I already read some other questions on here having similar problems, but I just have no idea how Im supposed to solve this problem in my specific case.</p>
  
  <p>Im defining my test like so:</p>
  
  <pre><code>describe('DialogComponent', () =&gt; {
      let component: DialogComponent;
      let fixture: ComponentFixture&lt;DialogComponent&gt;;
  
      it('should open dialog and click', () =&gt; {
          const button = overlayContainerElement.querySelector('button');
          spyOn(component, 'doSmth').and.callThrough();
          // component.doSmth();          &lt;-- this passes
          button.click();               // &lt;-- this does not pass
          expect(component.doSmth).toHaveBeenCalled();
      });
  });
  </code></pre>
  
  <p>My HTML is basically just a little form with a button that executes a method, like so:</p>
  
  <pre><code>&lt;button mat-flat-button (click)="doSmth()" class="mat-primary" type="button"&gt;Submit&lt;/button&gt;
  </code></pre>
  
  <p>The 'doSmth()' implementation is basically just a placeholder in the corresponding typescript file for now, printing something to the console.</p>
  
  <pre><code>doSmth() {
      console.log('In doSmth()');
  }
  </code></pre>
  
  <p>For some reason I get the 'In doSmth()' message when running my test, but the spy says that the method did not get called. I tried some other stuff, like executing the method not through the 'button.click()', but throught 'component.doSmth()', which works. Does anyone have an idea on how to solve this?</p>