Angular Unit-Test attributes

im trying to test a component which I created. The component itself is a wrapper for the mat-icon component. The component :

<div class="icons">
 <ng-container>
   <mat-icon  [matTooltip]="tooltipText" [color]="color">{{iconName}}</mat-icon>
 </ng-container>
</div>


export class IconsComponent {
  readonly color$ = new BehaviorSubject<ThemePalette>('primary');

  @Input()
  iconName = '';

  @Input()
  tooltipText = '';

  @Input()
  set color(value: 'primary' | 'accent' | 'warn' | undefined) {
    this.color$.next(value as ThemePalette);
  }

  get color() {
    return this.color$.value;
  }

  constructor() {}
}

And my test :

describe('IconsComponent', () => {
  let component: IconsComponent;
  let fixture: ComponentFixture<IconsComponent>;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [IconsComponent],
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(IconsComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should correctly render the passed @Input value for toolTip', () => {
    component.tooltipText = 'its a tooltip';
    fixture.detectChanges();

    const compiled = fixture.debugElement.nativeElement.querySelector('mat-icon');

    let toolTipText = compiled.getAttribute('mattooltip');
    expect(toolTipText).toBe('its a tooltip');
  });
});

The weird thing is, when I use [matTooltip] in my component, the value inside my test 'getAttribute('mattooltip') is null, however when I use [attr.matToolTip] instead the test is working but the tooltip itself wont work anymore.

Am I missing something? Why I'm not getting the attribute-value or why wont the tooltip work, If i add the attr. prefix?

EDIT: I've also tried to write a test getting the '[color]'-value, sadly with the same result as my tooltip.