fix(cdk-experimental/accordion): fix disabled trigger button can't be focused when skipDisabled=false

[ok7sai]

In short, in the demo page

<button cdkAccordionTrigger disabled>

Makes the button natively disabled and not focusable, so even with skipDisabled=false it can't be focused by the focus manager.

Change it to

<button cdkAccordionTrigger [disabled]="true">

Makes the cdkAccordionTrigger to be disabled without changing the button state.

Also added the inert attribute to the button when it's completely disabled(disabled and skip disabled), so it can't be focused by a pointer.

[github-actions]

Deployed dev-app for c8b2e73 to: https://ng-dev-previews-comp--pr-angular-components-31379-dev-wcgip6j4.web.app

Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt.

[mmalerba]

Shouldn't we fix this so they behave the same way? I find it very odd that disabled does not mean the same thing as [disabled]="true"

[ok7sai]

Hmm I am not sure if implicitly removing the disabled attribute from a button will surprise developers or not(e.g. expecting a css selector button.foo:disabled would work)

Is there a similar case in Angular components or CDKs that an input name shares the same name of a native attribute and what's the best practice of handling that?

In this case I can optionally bind the disabled attribute like

'[attr.aria-disabled]': 'pattern.disabled()', // soft disabled.
'[attr.disabled]': 'pattern.tabindex() < 0 ? true : null', // hard disabled for elements supports disabled attribute.
'[attr.inert]': 'pattern.tabindex() < 0 ? true : null', // hard disabled for other elements.

thoughts?

[wagnermaciel]

LGTM once mmalerba's comment is addressed

Side-note:
I noticed that event listeners are being attached per-accordion trigger instead of once on the accordion group. This is bad for initial load performance but isn't a major issue for this particular component since it is rare to have many accordions a page. It might be worth asking Jules to try refactoring this as a future PR.