Triggering a child component event when testing parent

Question

I'm trying to trigger an event emitter from a child component within my parent component cypress test. This are the relevant bits from my child component:

@Component({
  selector: 'app-toolbar',
  templateUrl: './toolbar.component.html',
  styleUrls: ['./toolbar.component.scss']
})

export class ToolbarComponent {

  @Output() showSideNav = new EventEmitter();

  openSideNav() {
    this.showSideNav.emit();
  }

The relevant html:

  <button
      data-cy="menu-button"
      (click)="openSideNav()"
      mat-icon-button
      aria-label="Application menu button">
      <mat-icon>menu</mat-icon>
  </button>

This is the html from my parent component:

<app-toolbar data-cy="toolbar" [loggedOnUser$]="loggedOnUser$" (showSideNav)="drawer.toggle()"></app-toolbar>
<mat-sidenav-container class="sidenav-container">
    <mat-sidenav data-cy="sidenav-menu" #drawer mode="side">
      <p data-cy="first-menu-item" class="mx-5 mt-3 mb-4">Menu</p>
    </mat-sidenav>
    <mat-sidenav-content>
      <router-outlet></router-outlet>
    </mat-sidenav-content>
</mat-sidenav-container>

This is the test I currently have:

  describe('sidenav', () => {
        it('should open when drawer is toggled', () => {
            cy.get('[data-cy=toolbar]').trigger('showSideNav');
            cy.get('[data-cy=first-menu-item]').should('be.visible');
        });
    });

This is the output I'm getting from the failed cypress test:

Not really sure how to approach this as I'm fairly new to Cypress. Can anyone give any pointers?

Thanks