diff --git a/.changeset/silent-phones-divide.md b/.changeset/silent-phones-divide.md new file mode 100644 index 000000000000..afd58853a83d --- /dev/null +++ b/.changeset/silent-phones-divide.md @@ -0,0 +1,7 @@ +--- +'astro': patch +--- + +Remove aria-query package + +This is another CJS-only package that breaks usage. diff --git a/packages/astro/package.json b/packages/astro/package.json index 9aa914aac02e..fd026e4b4027 100644 --- a/packages/astro/package.json +++ b/packages/astro/package.json @@ -124,7 +124,6 @@ "@babel/types": "^7.23.3", "@types/babel__core": "^7.20.4", "acorn": "^8.11.2", - "aria-query": "^5.3.0", "boxen": "^7.1.1", "chokidar": "^3.5.3", "ci-info": "^4.0.0", @@ -181,7 +180,6 @@ "devDependencies": { "@astrojs/check": "^0.3.1", "@playwright/test": "1.40.0", - "@types/aria-query": "^5.0.4", "@types/babel__generator": "^7.6.7", "@types/babel__traverse": "^7.20.4", "@types/chai": "^4.3.10", diff --git a/packages/astro/src/runtime/client/dev-overlay/plugins/audit/a11y.ts b/packages/astro/src/runtime/client/dev-overlay/plugins/audit/a11y.ts index 5527689e34d5..46c5f306d101 100644 --- a/packages/astro/src/runtime/client/dev-overlay/plugins/audit/a11y.ts +++ b/packages/astro/src/runtime/client/dev-overlay/plugins/audit/a11y.ts @@ -23,8 +23,6 @@ * SOFTWARE. */ -import type { ARIARoleDefinitionKey } from 'aria-query'; -import { aria, roles } from 'aria-query'; import type { AuditRuleWithSelector } from './index.js'; const a11y_required_attributes = { @@ -435,34 +433,6 @@ export const a11y: AuditRuleWithSelector[] = [ 'This will move elements out of the expected tab order, creating a confusing experience for keyboard users.', selector: '[tabindex]:not([tabindex="-1"]):not([tabindex="0"])', }, - { - code: 'a11y-role-supports-aria-props', - title: 'Unsupported ARIA attribute', - message: (element) => { - const { __astro_role: role, __astro_unsupported_attributes: unsupported } = element as any; - return `${ - element.localName - } element has ARIA attributes that are not supported by its role (${role}): ${unsupported.join( - ', ' - )}`; - }, - selector: '*', - match(element) { - const role = getRole(element); - if (!role) return false; - const { props } = roles.get(role)!; - const attributes = getAttributeObject(element); - const unsupportedAttributes = aria.keys().filter((attribute) => !(attribute in props)); - const invalidAttributes: string[] = Object.keys(attributes).filter( - (key) => key.startsWith('aria-') && unsupportedAttributes.includes(key as any) - ); - if (invalidAttributes.length > 0) { - (element as any).__astro_role = role; - (element as any).__astro_unsupported_attributes = invalidAttributes; - return true; - } - }, - }, { code: 'a11y-structure', title: 'Invalid DOM structure', @@ -496,16 +466,6 @@ export const a11y: AuditRuleWithSelector[] = [ }, ]; -const a11y_labelable = [ - 'button', - 'input', - 'keygen', - 'meter', - 'output', - 'progress', - 'select', - 'textarea', -]; /** * Exceptions to the rule which follows common A11y conventions @@ -520,50 +480,3 @@ const a11y_non_interactive_element_to_interactive_role_exceptions = { td: ['gridcell'], fieldset: ['radiogroup', 'presentation'], }; - -const combobox_if_list = ['email', 'search', 'tel', 'text', 'url']; -function input_implicit_role(attributes: Record) { - if (!('type' in attributes)) return; - const { type, list } = attributes; - if (!type) return; - if (list && combobox_if_list.includes(type)) { - return 'combobox'; - } - return input_type_to_implicit_role.get(type); -} - -/** @param {Map} attribute_map */ -function menuitem_implicit_role(attributes: Record) { - if (!('type' in attributes)) return; - const { type } = attributes; - if (!type) return; - return menuitem_type_to_implicit_role.get(type); -} - -function getRole(element: Element): ARIARoleDefinitionKey | undefined { - if (element.hasAttribute('role')) { - return element.getAttribute('role')! as ARIARoleDefinitionKey; - } - return getImplicitRole(element) as ARIARoleDefinitionKey; -} - -function getImplicitRole(element: Element) { - const name = element.localName; - const attrs = getAttributeObject(element); - if (name === 'menuitem') { - return menuitem_implicit_role(attrs); - } else if (name === 'input') { - return input_implicit_role(attrs); - } else { - return a11y_implicit_semantics.get(name); - } -} - -function getAttributeObject(element: Element): Record { - let obj: Record = {}; - for (let i = 0; i < element.attributes.length; i++) { - const attribute = element.attributes.item(i)!; - obj[attribute.name] = attribute.value; - } - return obj; -} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index aab43404f7a7..94be3019f371 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -508,9 +508,6 @@ importers: acorn: specifier: ^8.11.2 version: 8.11.2 - aria-query: - specifier: ^5.3.0 - version: 5.3.0 boxen: specifier: ^7.1.1 version: 7.1.1 @@ -669,9 +666,6 @@ importers: '@playwright/test': specifier: 1.40.0 version: 1.40.0 - '@types/aria-query': - specifier: ^5.0.4 - version: 5.0.4 '@types/babel__generator': specifier: ^7.6.7 version: 7.6.7 @@ -7247,10 +7241,6 @@ packages: resolution: {integrity: sha512-BSNTroRhmBkNiyd7ELK/5Boja92hnQMST6H4z1BqXKeMVzHjp9o1j5poqd5Tyhjd8oMFwxYC4I00eghfg2xrTA==} dev: false - /@types/aria-query@5.0.4: - resolution: {integrity: sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==} - dev: true - /@types/babel__core@7.20.4: resolution: {integrity: sha512-mLnSC22IC4vcWiuObSRjrLd9XcBTGf59vUSoq2jkQDJ/QQ8PMI9rSuzE+aEV8karUMbskw07bKYoUJCKTUaygg==} dependencies: