From 4789399170682b3337ac66a117e1563864ada663 Mon Sep 17 00:00:00 2001 From: Chris Haynes Date: Thu, 30 Jul 2020 22:27:43 +0100 Subject: [PATCH] Fixes #148 - prevents recursive calls to observer Uses a block list for the attributes that shouldn't trigger the observer. It may be better to use an allow list since the observer is still called unnecessarily for e.g. `style` attribute changes. --- src/components/tab-group/tab-group.tsx | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/components/tab-group/tab-group.tsx b/src/components/tab-group/tab-group.tsx index f6a65222..195fe4bf 100644 --- a/src/components/tab-group/tab-group.tsx +++ b/src/components/tab-group/tab-group.tsx @@ -59,7 +59,15 @@ export class TabGroup { focusVisible.observe(this.tabGroup); // Update aria labels if the DOM changes - this.mutationObserver = new MutationObserver(() => setTimeout(() => this.setAriaLabels())); + this.mutationObserver = new MutationObserver(mutations => { + if ( + mutations.some(mutation => { + return !['arial-labeledby', 'aria-controls'].includes(mutation.attributeName); + }) + ) { + setTimeout(() => this.setAriaLabels()); + } + }); this.mutationObserver.observe(this.host, { attributes: true, childList: true, subtree: true }); }