WEBUI-810: Vocabulary Actions [LTS-2025]#3188
Conversation
There was a problem hiding this comment.
Pull request overview
This PR adds read-only handling to the vocabulary management UI so that server-declared read-only directories cannot be modified from Web UI (disabling add/edit/delete actions and guarding the underlying methods), and introduces unit tests to validate the behavior.
Changes:
- Add
_isReadOnlycomputed state and wire it to disable action buttons and short-circuit entry mutation handlers. - Add CSS overrides to keep disabled action buttons at accessible contrast across themes.
- Add unit tests covering
_computeReadOnly,_isReadOnly, and read-only no-op guards.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| elements/directory/nuxeo-vocabulary-management.js | Adds read-only state, disables action buttons, guards mutation handlers, and adjusts disabled button styling for accessibility. |
| test/nuxeo-vocabulary-management.test.js | Adds coverage for read-only computation and ensures create/save/delete are no-ops when read-only. |
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
Comments suppressed due to low confidence (2)
elements/directory/nuxeo-vocabulary-management.js:169
- Inside a
dom-repeat,id="editButtonTooltip"will be duplicated for every row, butaria-labelledbyexpects a unique ID reference. Consider using an index-suffixed id (and matchingaria-labelledby), or switch toaria-labelfor the icon button to avoid invalid/ambiguous ARIA references.
disabled$="[[_isReadOnly]]"
aria-labelledby="editButtonTooltip"
></paper-icon-button>
<nuxeo-tooltip for="edit-button-[[index]]" id="editButtonTooltip"
>[[i18n('vocabularyManagement.editEntry')]]</nuxeo-tooltip
elements/directory/nuxeo-vocabulary-management.js:180
- Similarly,
id="deleteButtonTooltip"is stamped inside adom-repeat, creating duplicate IDs while the buttons reference it viaaria-labelledby. Make the tooltip id unique per row (or usearia-label) so the ARIA labeling remains valid.
disabled$="[[_isReadOnly]]"
aria-labelledby="deleteButtonTooltip"
></paper-icon-button>
<nuxeo-tooltip for="delete-button-[[index]]" id="deleteButtonTooltip"
>[[i18n('vocabularyManagement.deleteEntry')]]</nuxeo-tooltip
| test('addEntry button should be disabled (not hidden) for readOnly vocabulary', async () => { | ||
| await new Promise((resolve) => setTimeout(resolve, 50)); | ||
| const btn = element.shadowRoot.querySelector('#addEntry'); |
| test('addEntry button should not be disabled for writable vocabulary', async () => { | ||
| element.selectedVocabulary = 'coverage'; | ||
| await new Promise((resolve) => setTimeout(resolve, 50)); | ||
| const btn = element.shadowRoot.querySelector('#addEntry'); |
|



https://hyland.atlassian.net/browse/WEBUI-810