bug(MatAnchor): aria-disabled not applied with disabledInteractive

[caleniuc]

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

No response

Description

MAT_ANCHOR_HOST applies aria-disabled differently than MAT_BUTTON_HOST. On the anchor, aria-disabled is applied the same as disabled, so disabledInteractive has no effect on it.

---

MAT_BUTTON_HOST

• disabled attribute

  components/src/material/button/button-base.ts

  Line 42 in bb7563a

  '[attr.disabled]': '_getDisabledAttribute()',

• aria-disabled attribute

  components/src/material/button/button-base.ts

  Line 43 in bb7563a

  '[attr.aria-disabled]': '_getAriaDisabled()',

MAT_ANCHOR_HOST

• disabled attribute

  components/src/material/button/button-base.ts

  Line 218 in bb7563a

  '[attr.disabled]': '_getDisabledAttribute()',

• aria-disabled attribute

  components/src/material/button/button-base.ts

  Line 227 in bb7563a

  '[attr.aria-disabled]': '_getDisabledAttribute()',

---

On MAT_ANCHOR_HOST both get set to _getDisabledAttribute

components/src/material/button/button-base.ts

Lines 204 to 206 in bb7563a

	protected _getDisabledAttribute() {
	return this.disabledInteractive || !this.disabled ? null : true;
	}

Was expecting thataria-disabled is set like on MAT_BUTTON_HOST to _getAriaDisabled

components/src/material/button/button-base.ts

Lines 196 to 202 in bb7563a

	protected _getAriaDisabled() {
	if (this.ariaDisabled != null) {
	return this.ariaDisabled;
	}
	return this.disabled && this.disabledInteractive ? true : null;
	}

Follow up of #29882.

Reproduction

StackBlitz link: https://stackblitz.com/edit/soecj6-6ca7ni?file=src%2Fexample%2Fbutton-overview-example.html
Steps to reproduce:

1. Have an anchor button with disabled and disabledInteractive set to true
2. Notice aria-disabled is not applied

Expected Behavior

<a> button has aria-disabled applied when disabledInteractive is true, like on <button>

Actual Behavior

<a> button does not have aria-disabled applied when disabledInteractive is true

Environment

• Angular: v18, v19.0.0-next.2
• CDK/Material: v18, v19.0.0-next.2
• Browser(s): Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): macOS

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}