bug(mat-slide-toggle): Incorrect dark theme text-colors

[melroy89]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

14? 15? (it used to work for sure)

Description

Inverted text color of the mat-slide-toggle within the mat-toolbar component. I except the same behavior as my mat-buttons (white text in light mode, dark text in dark mode).

See also: #18701 (from 2020). This old ticket is describing exactly the same issue! But marked as solved.. which is not the case.

Reproduction

Steps to reproduce:

1. Use @angular/material/theming with dark theme.
2. <mat-slide-toggle [checked]="isDarkTheme | async" labelPosition="before" (change)="toggleDarkTheme($event.checked)">Dark theme</mat-slide-toggle> inside the <mat-toolbar color="primary"><mat-toolbar-row>...</mat-toolbar-row></mat-toolbar> components.

Expected Behavior

Within the mat-toolbar-row, I would expect similar to the mat-button component to have black text using light theme and white text using dark theme. But it seems the other way around.

Actual Behavior

I get inverted text colors on the mat-slide-toggle

Environment

• Angular: 16.0.3
• CDK/Material: 16.0.2
• Browser(s): Firefox
• Operating System (e.g. Windows, macOS, Ubuntu): Linux Mint