I have been using the Angular Material tooltip in my application, but when I recently upgraded to Angular 11, it has stopped working. I created a test component with the following code in the template, which I copied directly from https://material.angular.io/components/tooltip/overview
<button mat-raised-button
matTooltip="Info about the action"
aria-label="Button that displays a tooltip when focused or hovered over">
Action
</button>
I have Chrome dev tools open, and I can see changes to the template happening when I hover, but I still cannot see the tooltip on the screen.
I have Angular Material installed, and I have imported all necessary modules, so I am not sure what the issue is (possibly just a bug in Angular Material?)
I have a custom theme .scss file. I found that I needed some entries for tooltip in the theme, which I did not have before. Not sure why this is needed now but wasn't before. I added
to a couple spots in my scss file. See github.com/angular/components/issues/18139