Skip to content

feat(vue): Salvage PrimeVue barrel, cache-bust, and i18n - #702

Merged
biz87 merged 5 commits into
betafrom
feat/issue-701-primevue-barrel
Sep 17, 2026
Merged

biz87 merged 5 commits into
betafrom
feat/issue-701-primevue-barrel

Conversation

@Ibochkarev

@Ibochkarev Ibochkarev commented Sep 11, 2026

Copy link
Copy Markdown
Member

Описание

Из закрытого PR #640 в менеджер переносятся куски, которые не зависят от Modx-темы: named-импорты import { X } from 'primevue' вместо primevue/*, Vite-плагин rejectPrimeVueSubpaths, cache-bust vue-модулей по filemtime (vue_module_cache_bust.inc.php), лексиконы ru/en для help, истории заказа, VendorCombo и Uppy Image Editor.

Тема остаётся Aura (preset: Aura, darkModeSelector: none) на VueTools 1.2.0-pl. Плотность контролов, severity="success" на Save и CSS с токенами modx.* сюда не входят. Без централизованной темы из vueTools#22 они ломают дефолтную Aura.

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

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

Связанные Issues

Closes #701

Связано: #640, vueTools#22

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

cd vueManager
npm run lint:ci
# exit 0

npm test
# 46 tests, exit 0

npm run build
# exit 0, rejectPrimeVueSubpaths не сработал

php -l core/components/minishop3/controllers/vue_module_cache_bust.inc.php
php -l core/components/minishop3/controllers/manager.class.php
php -l _build/resolvers/resolver_01_setup.php
# exit 0

composer ci:php и PHPStan по этому diff не гонялись: PHP-слой это include и три вызова в addVueModule. Менеджер в браузере не проверялся.

  • Ручное тестирование
  • Автоматические тесты (composer ci:php / composer test, npm run lint:ci, composer stan / GitHub Actions CI)
  • Тестирование на разных версиях PHP/MODX

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

  • MiniShop3: ветка feat/issue-701-primevue-barrel
  • MODX: n/a (lint/Vitest/Vite)
  • PHP: 8.4.23

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

Не применимо. Критерий #701: менеджер визуально как текущая Aura.

Чеклист

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

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

@biz87

biz87 commented Sep 13, 2026

Copy link
Copy Markdown
Member

Проверил — большая часть переноса аккуратная, но в нынешнем виде PR ломает страницу редактирования товара, хотя сборка и CI зелёные.

Блокер: InputChips нет в бандле VueTools 1.1.2

vueManager/src/components/product/ProductOptionField.vue теперь импортирует import { Checkbox, DatePicker, InputChips, … } from 'primevue'.

До PR там был import InputChips from 'primevue/inputchips'. В vite.config.js внешним помечен только ровно primevue, поэтому подпути собирались в бандл MiniShop3 из node_modules — и всё работало. После перевода импорт уходит во внешний модуль, который в браузере резолвится через import map VueTools: в VueCore.php единственный ключ 'primevue' => $vendorUrl . 'primevue.min.js'.

В primevue.min.js релизной VueTools 1.1.2-pl 105 экспортов, InputChips среди них нет — ни одного вхождения строки во всём файле. Остальные имена, которые импортирует vueManager/src, в бандле есть.

Собранный product-tabs.min.js импортирует InputChips из primevue. В браузере это SyntaxError: The requested module 'primevue' does not provide an export named 'InputChips' на этапе линковки модуля. Не выполнится весь entry — отвалятся все вкладки товара, а не только опции.

Сборка и rejectPrimeVueSubpaths этого не ловят: Rollup не проверяет экспорты внешних модулей, а guard проверяет только путь импорта. Vitest тоже не ловит: в тестах primevue резолвится в npm-пакет, где InputChips есть.

Почему VueTools его не включила: в PrimeVue 4 компонент устаревший — InputChips.vue при монтировании пишет «Deprecated since v4. Use AutoComplete component instead with its typeahead property». AutoComplete в бандле VueTools есть. Предлагаю заменить на него (multiple и :typeahead="false"), а не делать исключение из guard.

Чтобы следующий такой случай ловился в CI, завёл #714.

Метки «yes / no» вместо «Да / Нет»

CategoryProductsController.php теперь отдаёт в фильтр ['label' => 'yes', …] и ['label' => 'no', …]. CategoryProductsGrid.vue кладёт response.filters как есть и выводит option-label="label" без перевода. В русском интерфейсе пользователь увидит буквальные «yes» и «no». Нужно либо отдавать уже переведённую строку с сервера через лексикон, либо переводить на фронте.

Cache-bust только для JS

addVueModule() в manager.class.php, resource_create.class.php и resource_update.class.php получил ?v=filemtime, а addCss() в тех же контроллерах по-прежнему ставит ?v= версии пакета. CSS в vue-dist без хеша в имени (product-tabs.min.css, help.min.css и другие), поэтому после пересборки под той же версией стили останутся из кэша браузера. Комментарий в vue_module_cache_bust.inc.php при этом описывает как раз CSS-симптомы. Стоит применить тот же helper в addCss() — или явно записать, что CSS в этот PR не входит.

Мелочь

Четыре добавленных ключа лексикона нигде не используются: ms3_help_nav_title, ms3_help_resources_title, ms3_gallery_actions, ms3_product_links_empty. Похоже на хвосты от переноса из #640 — либо удалить, либо доделать разметку.

Что подтвердилось

Ibochkarev added a commit that referenced this pull request Sep 14, 2026
Replace InputChips with AutoComplete for VueTools 1.1.2 barrel,
translate category published filter via lexicon, cache-bust CSS with
filemtime, and drop unused salvage lexicon keys.
@Ibochkarev
Ibochkarev force-pushed the feat/issue-701-primevue-barrel branch from 9e15b32 to 2aa46fe Compare September 14, 2026 02:54
@Ibochkarev

Copy link
Copy Markdown
Member Author

@biz87 Спасибо за ревью — правки в 2aa46fe.

Блокер InputChips: ProductOptionField переведён на AutoComplete (multiple, :typeahead="false") вместо исключения из guard. В собранном product-tabs.min.js именованного импорта InputChips больше нет. CI-гард по экспортам VueTools — в #714.

yes / no: в getDefaultFilters() labels через $this->modx->lexicon('ms3_yes'|'ms3_no') после lexicon->load('minishop3:vue').

Cache-bust CSS: тот же ms3_vue_module_cache_bust_url в addCss() у manager / resource_create / resource_update; комментарий в helper обновлён.

Мелочь: неиспользуемые ключи ms3_help_nav_title, ms3_help_resources_title, ms3_gallery_actions, ms3_product_links_empty удалены (ru+en).

Проверки: npm run lint:ci, npm test (77), npm run build, php -l на затронутых файлах — ok. Ветка перебазирована на актуальную beta.

Import PrimeVue from the VueTools barrel so manager screens share one
Theme instance. Reject primevue/* subpaths at Vite build time, bust
vue-dist cache with filemtime, and keep Aura as the default preset.

ModxManagerTheme and getActiveTheme stay out until vueTools#22.

Fixes #701
Replace InputChips with AutoComplete for VueTools 1.1.2 barrel,
translate category published filter via lexicon, cache-bust CSS with
filemtime, and drop unused salvage lexicon keys.
Shipment tab landed from #605 with primevue/* imports and would trip
rejectPrimeVueSubpaths / dual Theme instance after Part A of #701.
@biz87

biz87 commented Sep 16, 2026

Copy link
Copy Markdown
Member

Спасибо за правки. yes/no через лексикон и cache-bust для CSS на месте.

Слил ветку с актуальной beta (eb77392), конфликтов нет. Гейт зелёный: smoke 112/112, PHPUnit 554, PHPStan 0 ошибок, ESLint, Vitest 78, npm run build — guard не сработал.

Проверил на dev (VueTools 1.2.0-pl), сравнивал со сборкой beta на тех же страницах: заказы, заказ, товар (вкладки «Свойства товара», «Опции товара», «Галерея»), товары категории, клиенты, настройки, утилиты, уведомления, помощь.

  • Все именованные импорты из primevue (47) есть в барреле VueTools, ошибок линковки нет, консоль чистая на всех страницах. На beta при этом падает Cannot read properties of undefined (reading 'style') из встроенной копии PrimeVue (index-*.min.js) — с этим PR таких чанков нет, product-tabs.min.js уменьшился с 361 до 289 кБ.
  • Вид практически совпадает: цвета, отступы, скругления те же. Отличие одно — мелкие кнопки в таблицах выше на 2–3 px (PrimeVue 4.5.5 из VueTools вместо встроенной 4.3.1), строки гридов из-за этого чуть выше. Не блокер.
  • Cache-bust работает и для JS, и для CSS: ?v=1.13.0-beta1.<filemtime>.
  • История заказа: данные те же, действия и записи локализованы.

Возвращаю из-за поля combooptions, и здесь ошибка моя: замену InputChips на AutoComplete с multiple и :typeahead="false" предложил я в прошлом ревью, не проверив, как она ведёт себя с вводом.

ProductOptionField.vue: значения теряются, подсказки отключены

Проверил на поле «Тестовый список с автодополнением» в обеих сборках:

Действие beta (InputChips) PR (AutoComplete)
ввести значение и нажать Enter добавлено добавлено
ввести значение и запятую добавлено не добавлено, запятая остаётся в поле
ввести значение и уйти из поля добавлено не добавлено, значения нет в скрытом input — при сохранении товара оно потеряется

Placeholder при этом по-прежнему обещает «Enter, запятая или клик вне поля добавят его».

Подсказки: у AutoComplete при typeahead=false onInput() не вызывает search() (ветка if (this.typeahead) в primevue/autocomplete), поэтому @complete не срабатывает и onComboOptionsComplete() не вызывается никогда. На beta запрос /api/mgr/options/suggestions уходит при вводе, в PR — нет. Сейчас пользователь этого не заметит только потому, что сам эндпоинт на beta всегда отдаёт пустой список — это отдельная ошибка, #745.

Как исправить — на выбор:

  1. Вернуть InputChips с separator=",", add-on-blur и подсказками под полем, как на beta. Причины замены больше нет: в VueTools 1.2.0-pl InputChips в барреле есть (src/vendor/primevue.js, коммит 4594c33), а резолвер в этом PR уже требует 1.2.0-pl. Минус — компонент устаревший и при монтировании пишет в консоль предупреждение PrimeVue.
  2. Оставить AutoComplete, но с typeahead (чтобы работал @complete) и своими обработчиками: Enter без выбранной подсказки, запятая и blur добавляют введённый текст. Кода больше, зато без устаревшего компонента.

В обоих случаях нужен тест на эти три сценария — сейчас ProductOptionField.vue тестами не покрыт, поэтому гейт зелёный.

Версия VueTools в резолвере не совпадает с описанием

_build/resolvers/resolver_01_setup.php в c1209efd требует 1.2.0-pl, а в описании — 1.1.2-pl. Если остаётся InputChips из VueTools — требование 1.2.0 оправдано, стоит поправить описание. Если нет — коду этого PR хватает 1.1.2, и поднимать версию логичнее в #738.

AutoComplete with typeahead=false dropped comma/blur commits and never
fired suggestions. VueTools 1.2.0 barrels InputChips again; cover the
three commit paths and suggestion load in unit tests.
@Ibochkarev

Copy link
Copy Markdown
Member Author

@biz87 Спасибо — по comboOptions взяли первый вариант.

InputChips: возвращён (separator=",", add-on-blur, подсказки под полем), именованный импорт из барреля. В product-tabs.min.js снова InputChips из primevue. VueTools 1.2.0-pl в резолвере остаётся (InputChips в барреле с 4594c33); описание PR обновлено.

Тесты: ProductOptionField.test.js — Enter, запятая, blur → chip в hidden JSON; keyup грузит /api/mgr/options/suggestions.

Коммит: fc8a581a.

@biz87
biz87 merged commit ce28b84 into beta Sep 17, 2026
6 checks passed
@Ibochkarev
Ibochkarev deleted the feat/issue-701-primevue-barrel branch September 23, 2026 02:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

2 participants