Вынос селекторов в общий конфиг (Issue #18)

[Ibochkarev]

Описание

Вынос селекторов в общий конфиг (Issue #18). Все захардкоженные селекторы в JS перенесены в единый модуль Selectors.js с возможностью переопределения через ms3Config.selectors. Сохранена обратная совместимость: дефолтные селекторы включают и data-ms3-* атрибуты, и CSS-классы.

Основные изменения:

• Новый файл assets/components/minishop3/js/web/core/Selectors.js — объект дефолтных селекторов и функция getSelectors() (слияние с ms3Config.selectors)
• UI-классы (CartUI, OrderUI, QuantityUI, CustomerUI, ProductCardUI) и ms3.js используют селекторы из config.selectors вместо хардкода
• Подключение Selectors.js в ms3_frontend_assets (перед ApiClient.js) + миграция для существующих установок
• В MiniShop3.php в js_setting добавлено поле selectors: [] для переопределения на стороне шаблона

Тип изменений

• Исправление бага (non-breaking change)
• Новая функциональность (non-breaking change)
• Breaking change (изменение, ломающее обратную совместимость)
• Рефакторинг (без изменения функциональности)
• Документация
• Другое (опишите):

Связанные Issues

Closes #18

Как это было протестировано?

• Ручное тестирование
• Автоматические тесты (PHPStan, ESLint)
• Тестирование на разных версиях PHP/MODX

Конфигурация тестирования:

• MiniShop3: текущая ветка
• MODX: —
• PHP: —

Скриншоты (если применимо)

Не применимо — визуальное поведение не меняется.

Чеклист

• Код соответствует стилю проекта
• Добавлены/обновлены комментарии в сложных местах
• Изменения не ломают существующую функциональность
• Лексиконы добавлены на двух языках (ru/en) — не требуется
• PHPStan проходит без новых ошибок
• ESLint проходит без ошибок (для JS/Vue изменений)
• Обновлён CHANGELOG.md (для значимых изменений)

Дополнительные заметки

• Fallback: при отсутствии getSelectors используется window.Ms3DefaultSelectors; в UI-классах сохранены строковые fallback-селекторы
• Для старых браузеров (IE11): в initFormHandler используется form.matches || form.msMatchesSelector || form.webkitMatchesSelector
• Переопределение в шаблоне: ms3Config.selectors = { formOrder: '.my-order-form' } — частичное слияние с дефолтами

[biz87]

Ревью PR #97

Подход правильный — централизация селекторов с возможностью переопределения. Есть несколько проблем.

1. Определение направления кнопок +/- не использует селекторы (значимо)

В QuantityUI.handleButtonClick() направление определяется хардкодом:

const isInc = e.target.getAttribute('data-ms3-qty') === 'inc' || e.target.classList.contains('inc-qty')
const isDec = e.target.getAttribute('data-ms3-qty') === 'dec' || e.target.classList.contains('dec-qty')

Если пользователь переопределит qtyInc: '.my-plus-btn', кнопка получит listener (через initButtons), но isInc/isDec её не распознают — направление не определится. Нужно чтобы handleButtonClick использовал e.target.matches(qtyIncSel) / e.target.matches(qtyDecSel) вместо хардкода.

2. IE11 polyfill — мёртвый код

const matches = form.matches || form.msMatchesSelector || form.webkitMatchesSelector

Весь код использует ?. (optional chaining), async/await, ...spread — ничего из этого не работает в IE11. Fallback на msMatchesSelector/webkitMatchesSelector никогда не выполнится. Достаточно просто form.matches(formSel).

3. .eslintrc.json — косметическое переформатирование

Не относится к issue #18. Единственное значимое изменение — добавление getSelectors в globals, остальное — шум в diff.

4. Повторяющийся паттерн (this.config?.selectors || {})

Эта конструкция встречается ~15 раз. Можно вынести в геттер или закешировать в конструкторе каждого UI-класса:

get sel () {
  return this.config?.selectors || {}
}

5. console.warn ссылается на внутренний конфиг

console.warn('ms3_link must be inside a form matching sel.form')

sel.form ничего не скажет разработчику при отладке. Лучше вывести реальный селектор:

console.warn(`ms3_link must be inside a form matching: ${formSel}`)

[Ibochkarev]

@biz87 можно смотреть