Установка и подключение

Aria-query — это специализированная библиотека для работы с ARIA-атрибутами и ролями в DOM. Она позволяет проверять соответствие элементов стандартам доступности, получать список поддерживаемых ролей и атрибутов, а также проводить анализ HTML-кода на предмет корректного использования ARIA.

Установка через npm

Для работы с библиотекой необходимо наличие Node.js и пакетного менеджера npm. Установка выполняется одной командой:

npm install aria-query

Эта команда загружает последнюю стабильную версию библиотеки и добавляет её в зависимости проекта. После установки можно проверить версию для уверенности:

npm list aria-query

Подключение в проекте

В современных проектах на JavaScript (ES6+) рекомендуется использовать import:

import { roles, aria } from 'aria-query';

roles — объект, содержащий все стандартные роли ARIA с их свойствами и возможными контекстами.
aria — объект, включающий все ARIA-атрибуты и их допустимые значения.

В проектах с CommonJS-подходом используется require:

const { roles, aria } = require('aria-query');

Проверка наличия библиотеки

После подключения можно убедиться, что объекты доступны:

console.log(Object.keys(roles).length); // Количество ролей
console.log(Object.keys(aria).length);  // Количество атрибутов

Особенности интеграции

Совместимость с TypeScript Библиотека предоставляет собственные типы, что позволяет использовать её в TypeScript без необходимости установки дополнительных пакетов:
```
import { roles } from 'aria-query';

const buttonRole = roles.get('button');
console.log(buttonRole.name); // name — объект с описанием свойства роли
```
Работа с серверными и клиентскими проектами aria-query не зависит от DOM-окружения, поэтому её можно использовать как в Node.js для серверного анализа HTML, так и в браузере для динамических проверок компонентов.
Совместное использование с линтерами и тестовыми фреймворками Библиотека идеально интегрируется с инструментами типа eslint-plugin-jsx-a11y или тестами на jest, где требуется проверка ARIA-ролей и атрибутов на корректность.

Структура объектов

roles Представляет собой Map, где ключ — название роли, а значение — объект с описанием:

{
  name: { name: 'button', required: false },
  superclass: ['command'],
  props: {
    'aria-disabled': { value: [true, false], required: false }
  },
  requiredContextRole: []
}

aria Объект, где ключ — ARIA-атрибут, а значение — массив допустимых значений:
```
{
  'aria-hidden': [true, false],
  'aria-label': ['string'],
  'aria-expanded': [true, false, 'mixed']
}
```

Практическая проверка

Для проверки, поддерживает ли элемент определённую роль:

import { roles } from 'aria-query';

const roleName = 'checkbox';
if (roles.has(roleName)) {
  const role = roles.get(roleName);
  console.log(role.superclass); // ['input', 'selectable']
}

Для проверки допустимых значений ARIA-атрибута:

import { aria } from 'aria-query';

const attr = 'aria-expanded';
console.log(aria[attr]); // [true, false, 'mixed']