XWIKI-22339: Icon picker is not keyboard operable #3800
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
* Updated the type of the icon buttons to be actual buttons and not disguised divs. * Added word break indicators in the icon names, for cleaner breaks on long iconNames. * Moved the DOM representation of the picker right after the input. * Added an escape listener on the picker content to easily get out of it. * Updated style to avoid having too big of a change with the new DOM. * Improved style for long iconNames, which were poorly supported before.
* Escaped changes
* Fixed typo
surli
reviewed
Jan 15, 2025
| @@ -243,14 +243,21 @@ require(['jquery', 'xwiki-icon-picker'], function($) { | |||
| for (var i=0; i < iconTheme.length; ++i) { | |||
| // Display the icon | |||
| if (selectedIconName === '' || iconTheme[i].name.includes(selectedIconName)) { | |||
| var displayer = $(document.createElement('div')); | |||
| var displayer = $(document.createElement('button')); | |||
There was a problem hiding this comment.
any reason to not use $('<button>') (see https://api.jquery.com/jQuery/#jQuery2)?
There was a problem hiding this comment.
Not really, just keeping the changes minimal. AFAICS all the elements created in this file use this pattern. I figured keeping this pattern is the safest choice (though I doubt it would change anything in any situation).
Should I replace all the instantiations with the pattern you proposed?
No changes applied yet.
There was a problem hiding this comment.
Should I replace all the instantiations with the pattern you proposed?
Probably not, leave it like this.
surli
approved these changes
Jan 15, 2025
surli
pushed a commit
that referenced
this pull request
Jan 16, 2025
* XWIKI-22339: Icon picker is not keyboard operable * Updated the type of the icon buttons to be actual buttons and not disguised divs. * Added word break indicators in the icon names, for cleaner breaks on long iconNames. * Moved the DOM representation of the picker right after the input. * Added an escape listener on the picker content to easily get out of it. * Updated style to avoid having too big of a change with the new DOM. * Improved style for long iconNames, which were poorly supported before. * Escaped changes * Fixed typo (cherry picked from commit 818bc25)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Jira URL
https://jira.xwiki.org/browse/XWIKI-22339
Changes
Description
Screenshots & Video
Video demo of the iconpicker with the changes proposed in this PR:
2025-01-14.18-03-08.mp4
Executed Tests
Successfully passed
mvn clean install -f xwiki-platform-core/xwiki-platform-icon/ -Pquality,integration-tests,docker. Ranmvn xar:formatto make sure every addition was XML escaped.Expected merging strategy