MOBILE-3833 core: Fix button aria-label reactivity

main
Noel De Martin 2022-03-16 16:39:02 +01:00
parent 11cdb0fffe
commit b7fe9236f6
1 changed files with 8 additions and 9 deletions

View File

@ -33,15 +33,18 @@ export class CoreUpdateNonReactiveAttributesDirective implements OnInit, OnDestr
constructor(element: ElementRef<HTMLIonButtonElement>) {
this.element = element.nativeElement;
this.mutationObserver = new MutationObserver(() => {
const ariaLabel = this.element.getAttribute('aria-label');
if (!ariaLabel) {
// Aria label unset by ionButton component (when first created).
const button = this.element.shadowRoot?.querySelector('button');
if (!button) {
return;
}
// Propagate label to button.
const button = this.element.shadowRoot?.querySelector('button');
button?.setAttribute('aria-label', ariaLabel);
const ariaLabel = this.element.getAttribute('aria-label');
ariaLabel
? button.setAttribute('aria-label', ariaLabel)
: button.removeAttribute('aria-label');
});
}
@ -51,10 +54,6 @@ export class CoreUpdateNonReactiveAttributesDirective implements OnInit, OnDestr
async ngOnInit(): Promise<void> {
await this.element.componentOnReady();
if (!this.element.getAttribute('aria-label')) {
return;
}
this.mutationObserver.observe(this.element, { attributes: true, attributeFilter: ['aria-label'] });
}