angular material dialog with tabs - content of tab is not visible if switching tab when the dialog loads

I am trying to achieve opening a dialog that has tab group with 2 tabs, and immediately switching to the second tab when the dialog loads.

The issue is that the tab switches, but the content of the tab is not visible. It exists, but it is out of view, to the right. I think the animation that moves it into view doesn't happen when i immediately switch tab.

If I switch back to Tab1, and again to Tab2, i can see it's content.

I am using akita, and i bind the activeTabIndex to the state.

Here is a stackblitz for that: https://stackblitz.com/edit/angular-w8svt3

I don't know whats your intention to switch the tab only from outside.

The easiest way would be to update the tab on ngOnInit

  ngOnInit() {
    this.appService.updateTabIndex(1);
  }

As a additional workaround you can try to add a setTimeout call. E.g.:

   this.dialog.open(DialogComponent, config).afterOpened().subscribe(_ => {
      setTimeout(() => this.appService.updateTabIndex(1), 0);
      console.log('updateTabIndex');
    });