From fcfdd9e9ba9969947d8b9dfefbea4522d08753ed Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 22 Feb 2023 16:05:31 -0500 Subject: [PATCH] fix(form): shadow components using aria-labelledby do not use modern syntax (#26836) resolves #26829 --- core/src/utils/forms/form-controller.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/core/src/utils/forms/form-controller.ts b/core/src/utils/forms/form-controller.ts index 59c6224b59..a43a2d2491 100644 --- a/core/src/utils/forms/form-controller.ts +++ b/core/src/utils/forms/form-controller.ts @@ -22,7 +22,10 @@ export const createLegacyFormController = (el: HTMLLegacyFormControlElement): Le * in the light DOM. */ const hasLabelProp = (controlEl as any).label !== undefined || hasLabelSlot(controlEl); - const hasAriaLabelAttribute = controlEl.hasAttribute('aria-label') || controlEl.hasAttribute('aria-labelledby'); + const hasAriaLabelAttribute = + controlEl.hasAttribute('aria-label') || + // Shadow DOM form controls cannot use aria-labelledby + (controlEl.hasAttribute('aria-labelledby') && controlEl.shadowRoot === null); /** * Developers can manually opt-out of the modern form markup