diff --git a/docs/pages/resources/changelog.md b/docs/pages/resources/changelog.md index b1da29bd7..deb67d792 100644 --- a/docs/pages/resources/changelog.md +++ b/docs/pages/resources/changelog.md @@ -21,6 +21,7 @@ New versions of Web Awesome are released as-needed and generally occur when a cr ## Next +- Fixed a bug in the autoloader causing it to register non-Shoelace elements [#1563] - Fixed a bug in `` that resulted in improper spacing between the label and the required asterisk [#1540] - Updated `@ctrl/tinycolor` to 4.0.1 [#1542] - Updated Bootstrap Icons to 1.11.0 diff --git a/src/autoloader.ts b/src/autoloader.ts index acc766f1d..3795f4a58 100644 --- a/src/autoloader.ts +++ b/src/autoloader.ts @@ -15,13 +15,13 @@ const observer = new MutationObserver(mutations => { */ export async function discover(root: Element | ShadowRoot) { const rootTagName = root instanceof Element ? root.tagName.toLowerCase() : ''; - const rootIsCustomElement = rootTagName?.includes('-'); + const rootIsWebAwesomeComponent = rootTagName?.startsWith('wa-'); const tags = [...root.querySelectorAll(':not(:defined)')] .map(el => el.tagName.toLowerCase()) .filter(tag => tag.startsWith('wa-')); - // If the root element is an undefined custom element, add it to the list - if (rootIsCustomElement && !customElements.get(rootTagName)) { + // If the root element is an undefined Web Awesome component, add it to the list + if (rootIsWebAwesomeComponent && !customElements.get(rootTagName)) { tags.push(rootTagName); } @@ -35,14 +35,14 @@ export async function discover(root: Element | ShadowRoot) { * Registers an element by tag name. */ function register(tagName: string): Promise { - const tagWithoutPrefix = tagName.replace(/^wa-/i, ''); - const path = getBasePath(`components/${tagWithoutPrefix}/${tagWithoutPrefix}.js`); - // If the element is already defined, there's nothing more to do if (customElements.get(tagName)) { return Promise.resolve(); } + const tagWithoutPrefix = tagName.replace(/^wa-/i, ''); + const path = getBasePath(`components/${tagWithoutPrefix}/${tagWithoutPrefix}.js`); + // Register it return new Promise((resolve, reject) => { import(path).then(() => resolve()).catch(() => reject(new Error(`Unable to autoload <${tagName}> from ${path}`)));