From ea749cb2f941eb287591cf4e3e4e80232fbbd91a Mon Sep 17 00:00:00 2001 From: "julia.kirschenheuter" Date: Thu, 4 Aug 2022 08:45:57 +0200 Subject: [PATCH] Add ```aria-expanded``` value to select2-container om systemtag and file tags Add ```aria-expanded``` to color picker Add ```aria-expanded``` to UnifiedSearch.vue Add ```aria-expanded``` to new button on files Add ```aria-expanded``` to action menu Add ```aria-expanded``` to icon .federation-menu Add ```aria-expanded``` to app navigation collapse button Signed-off-by: julia.kirschenheuter --- apps/files/js/fileactions.js | 3 +++ apps/files/js/filelist.js | 3 ++- apps/files/js/navigation.js | 7 +++++++ apps/files/js/newfilemenu.js | 2 +- apps/files/templates/appnavigation.php | 2 +- apps/settings/js/federationsettingsview.js | 1 + apps/systemtags/js/admin.js | 7 +++++++ apps/systemtags/src/systemtagsfilelist.js | 7 +++++++ apps/theming/js/3rdparty/jscolor/jscolor.js | 2 ++ apps/theming/js/settings-admin.js | 1 + core/src/OC/menu.js | 3 +++ core/src/components/HeaderMenu.vue | 2 +- 12 files changed, 36 insertions(+), 4 deletions(-) diff --git a/apps/files/js/fileactions.js b/apps/files/js/fileactions.js index 8790eae9c98dd..9b86c6521ae3d 100644 --- a/apps/files/js/fileactions.js +++ b/apps/files/js/fileactions.js @@ -370,6 +370,7 @@ var menu; var $trigger = context.$file.closest('tr').find('.fileactions .action-menu'); $trigger.addClass('open'); + $trigger.attr('aria-expanded', 'true'); menu = new OCA.Files.FileActionsMenu(); @@ -378,6 +379,7 @@ menu.$el.on('afterHide', function() { context.$file.removeClass('mouseOver'); $trigger.removeClass('open'); + $trigger.attr('aria-expanded', 'false'); menu.remove(); }); @@ -404,6 +406,7 @@ }, false, context); $el.addClass('permanent'); + $el.attr('aria-expanded', 'false'); }, diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 4acefa6902bfc..8407cb79bb35d 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -3853,7 +3853,7 @@ $actionsContainer.prepend($newButton); $newButton.tooltip({'placement': 'bottom'}); - + $newButton.attr('aria-expanded', 'false'); $newButton.click(_.bind(this._onClickNewButton, this)); this._newButton = $newButton; }, @@ -3864,6 +3864,7 @@ $target = $target.closest('.button'); } this._newButton.tooltip('hide'); + $target.attr('aria-expanded', 'true'); event.preventDefault(); if ($target.hasClass('disabled')) { return false; diff --git a/apps/files/js/navigation.js b/apps/files/js/navigation.js index f8f15394ef08b..8a2cddb3f52a0 100644 --- a/apps/files/js/navigation.js +++ b/apps/files/js/navigation.js @@ -200,6 +200,13 @@ if ($menu.hasClass('collapsible') && $menu.data('expandedstate')) { $menu.toggleClass('open'); + var targetAriaExpanded = $target.attr('aria-expanded'); + if (targetAriaExpanded === 'false') { + $target.attr('aria-expanded', 'true'); + } else if (targetAriaExpanded === 'true') { + $target.attr('aria-expanded', 'false'); + } + $menu.toggleAttr('data-expanded', 'true', 'false'); var show = $menu.hasClass('open') ? 1 : 0; var key = $menu.data('expandedstate'); $.post(OC.generateUrl("/apps/files/api/v1/toggleShowFolder/" + key), {show: show}); diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js index faebc305c6db9..67ca8934549c2 100644 --- a/apps/files/js/newfilemenu.js +++ b/apps/files/js/newfilemenu.js @@ -245,7 +245,7 @@ */ showAt: function($target) { this.render(); - OC.showMenu(null, this.$el); + OC.showMenu($target, this.$el); } }); diff --git a/apps/files/templates/appnavigation.php b/apps/files/templates/appnavigation.php index 9ff680d6a8ddb..3c333d39fc064 100644 --- a/apps/files/templates/appnavigation.php +++ b/apps/files/templates/appnavigation.php @@ -90,7 +90,7 @@ class="nav-icon- - diff --git a/apps/settings/js/federationsettingsview.js b/apps/settings/js/federationsettingsview.js index e05cc9f20f4e8..eb5d70842066f 100644 --- a/apps/settings/js/federationsettingsview.js +++ b/apps/settings/js/federationsettingsview.js @@ -106,6 +106,7 @@ self._onScopeChanged(field, scope); }); $icon.append(scopeMenu.$el); + $icon.attr('aria-expanded', 'false'); $icon.on('click', _.bind(scopeMenu.show, scopeMenu)); $icon.on('keydown', function(e) { if (e.keyCode === 32) { diff --git a/apps/systemtags/js/admin.js b/apps/systemtags/js/admin.js index b8bcbb51e6f6e..0b9d9ec4a4145 100644 --- a/apps/systemtags/js/admin.js +++ b/apps/systemtags/js/admin.js @@ -38,6 +38,7 @@ this.collection.fetch({ success: function() { $('#systemtag').select2(_.extend(self.select2)); + $('#systemtag').parent().children('.select2-container').attr('aria-expanded', 'false') } }); @@ -50,6 +51,12 @@ $('#systemtag_submit').on('click', _.bind(this._onClickSubmit, this)); $('#systemtag_delete').on('click', _.bind(this._onClickDelete, this)); $('#systemtag_reset').on('click', _.bind(this._onClickReset, this)); + $('#systemtag').select2(_.extend(self.select2)).on('select2-open', () => { + $('.select2-container').attr('aria-expanded', 'true') + }); + $('#systemtag').select2(_.extend(self.select2)).on('select2-close', () => { + $('.select2-container').attr('aria-expanded', 'false') + }); }, /** diff --git a/apps/systemtags/src/systemtagsfilelist.js b/apps/systemtags/src/systemtagsfilelist.js index 404c85ea3f8be..69e637062641b 100644 --- a/apps/systemtags/src/systemtagsfilelist.js +++ b/apps/systemtags/src/systemtagsfilelist.js @@ -181,6 +181,13 @@ return t('systemtags', 'No tags found') }, }) + this.$filterField.parent().children('.select2-container').attr('aria-expanded', 'false') + this.$filterField.on('select2-open', () => { + this.$filterField.parent().children('.select2-container').attr('aria-expanded', 'true') + }) + this.$filterField.on('select2-close', () => { + this.$filterField.parent().children('.select2-container').attr('aria-expanded', 'false') + }) this.$filterField.on( 'change', _.bind(this._onTagsChanged, this) diff --git a/apps/theming/js/3rdparty/jscolor/jscolor.js b/apps/theming/js/3rdparty/jscolor/jscolor.js index cad36eab92ab7..9e6e8db88535a 100644 --- a/apps/theming/js/3rdparty/jscolor/jscolor.js +++ b/apps/theming/js/3rdparty/jscolor/jscolor.js @@ -1354,6 +1354,7 @@ var jsc = { function detachPicker () { + THIS.targetElement.setAttribute('aria-expanded', 'false'); jsc.unsetClass(THIS.targetElement, THIS.activeClass); jsc.picker.wrap.parentNode.removeChild(jsc.picker.wrap); delete jsc.picker.owner; @@ -1361,6 +1362,7 @@ var jsc = { function drawPicker () { + THIS.targetElement.setAttribute('aria-expanded', 'true'); // At this point, when drawing the picker, we know what the parent elements are // and we can do all related DOM operations, such as registering events on them diff --git a/apps/theming/js/settings-admin.js b/apps/theming/js/settings-admin.js index 7efdab6dda47c..b33beda43d8f4 100644 --- a/apps/theming/js/settings-admin.js +++ b/apps/theming/js/settings-admin.js @@ -98,6 +98,7 @@ window.addEventListener('DOMContentLoaded', function () { // manually instantiate jscolor to work around new Function call which violates strict CSP var colorElement = $('#theming-color')[0]; + colorElement.setAttribute('aria-expanded', 'false'); var jscolor = new window.jscolor(colorElement, {hash: true}); $('#theming .theme-undo').each(function() { diff --git a/core/src/OC/menu.js b/core/src/OC/menu.js index 93de943b37ef5..7d4d2f91a6cc4 100644 --- a/core/src/OC/menu.js +++ b/core/src/OC/menu.js @@ -111,6 +111,9 @@ export const hideMenus = function(complete) { // Set menu to closed $('.menutoggle').attr('aria-expanded', false) + if (currentMenuToggle) { + currentMenuToggle.attr('aria-expanded', false) + } $('.openedMenu').removeClass('openedMenu') currentMenu = null diff --git a/core/src/components/HeaderMenu.vue b/core/src/components/HeaderMenu.vue index 663054a74e977..fc8936ba07c72 100644 --- a/core/src/components/HeaderMenu.vue +++ b/core/src/components/HeaderMenu.vue @@ -28,7 +28,7 @@ href="#" :aria-label="ariaLabel" :aria-controls="`header-menu-${id}`" - :aria-expanded="opened" + :aria-expanded="opened.toString()" aria-haspopup="menu" @click.prevent="toggleMenu">