javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(form): legacy deprecation is logged correctly (#26784)

Browse Source
This commit is contained in:
Liam DeBeasi
2023-02-13 14:53:06 -05:00
committed by GitHub
parent 32de88eca5
commit 180ee63ff7
1 changed files with 20 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
core/src/utils/forms/form-controller.ts
View File

@@ -8,27 +8,28 @@ type HTMLLegacyFormControlElement = HTMLElement & { label?: string; legacy?: boo
*/
export const createLegacyFormController = (el: HTMLLegacyFormControlElement): LegacyFormController => {
const controlEl: HTMLLegacyFormControlElement = el;
let legacyControl = true;
/**
* Detect if developers are using the legacy form control syntax
* so a deprecation warning is logged. This warning can be disabled
* by either using the new `label` property or setting `aria-label`
* on the control.
* Alternatively, components that use a slot for the label
* can check to see if the component has slotted text
* in the light DOM.
*/
const hasLabelProp = (controlEl as any).label !== undefined || hasLabelSlot(controlEl);
const hasAriaLabelAttribute = controlEl.hasAttribute('aria-label') || controlEl.hasAttribute('aria-labelledby');
/**
* Developers can manually opt-out of the modern form markup
* by setting `legacy="true"` on components.
*/
legacyControl = controlEl.legacy === true || (!hasLabelProp && !hasAriaLabelAttribute);
let legacyControl: boolean | undefined;
const hasLegacyControl = () => {
if (legacyControl === undefined) {
/**
* Detect if developers are using the legacy form control syntax
* so a deprecation warning is logged. This warning can be disabled
* by either using the new `label` property or setting `aria-label`
* on the control.
* Alternatively, components that use a slot for the label
* can check to see if the component has slotted text
* in the light DOM.
*/
const hasLabelProp = (controlEl as any).label !== undefined || hasLabelSlot(controlEl);
const hasAriaLabelAttribute = controlEl.hasAttribute('aria-label') || controlEl.hasAttribute('aria-labelledby');
/**
* Developers can manually opt-out of the modern form markup
* by setting `legacy="true"` on components.
*/
legacyControl = controlEl.legacy === true || (!hasLabelProp && !hasAriaLabelAttribute);
}
return legacyControl;
};