IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2025-02-25 18:55:31 -06:00
Code Issues Packages Projects Releases Wiki Activity

Ensure that toggle buttons are accessible by most screen readers. Fixes #6317

Browse Source
This commit is contained in:
Khushboo Vashi 2021-03-19 11:44:57 +05:30 committed by Akshay Joshi
parent ded65340fe
commit b973d6055d
2 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
docs/en_US/release_notes_5_1.rst
View File

@ -53,4 +53,5 @@ Bug fixes
| `Issue #6307 <https://redmine.postgresql.org/issues/6307>`_ - Fixed an issue where the incorrect values visible in the dependents tab for publication. | `Issue #6307 <https://redmine.postgresql.org/issues/6307>`_ - Fixed an issue where the incorrect values visible in the dependents tab for publication.
| `Issue #6312 <https://redmine.postgresql.org/issues/6312>`_ - Fixed an issue where copy/paste rows in view data paste the wrong value for boolean type. | `Issue #6312 <https://redmine.postgresql.org/issues/6312>`_ - Fixed an issue where copy/paste rows in view data paste the wrong value for boolean type.
| `Issue #6316 <https://redmine.postgresql.org/issues/6316>`_ - Ensure that the primary key should be visible properly in the table dialog. | `Issue #6316 <https://redmine.postgresql.org/issues/6316>`_ - Ensure that the primary key should be visible properly in the table dialog.
| `Issue #6317 <https://redmine.postgresql.org/issues/6317>`_ - Ensure that toggle buttons are accessible by most screen readers.
| `Issue #6322 <https://redmine.postgresql.org/issues/6322>`_ - Fixed an issue where the top menu disappears when entering into the full screen for minimum screen resolution. | `Issue #6322 <https://redmine.postgresql.org/issues/6322>`_ - Fixed an issue where the top menu disappears when entering into the full screen for minimum screen resolution.

6
web/pgadmin/static/js/backform.pgadmin.js
View File

@ -587,7 +587,6 @@ define([
}, },
template: _.template([ template: _.template([
'<span class="<%=controlLabelClassName%>"><%=label%></span>', '<span class="<%=controlLabelClassName%>"><%=label%></span>',
'<label class="sr-value sr-only" for="<%=cId%>"></label>',
'<div class="<%=controlsClassName%> <%=extraClasses.join(\' \')%>">', '<div class="<%=controlsClassName%> <%=extraClasses.join(\' \')%>">',
' <input tabindex="-1" type="checkbox" aria-hidden="true" aria-label="' + gettext('Toggle button') + '" data-style="quick" data-toggle="toggle"', ' <input tabindex="-1" type="checkbox" aria-hidden="true" aria-label="' + gettext('Toggle button') + '" data-style="quick" data-toggle="toggle"',
' data-size="<%=options.size%>" data-height="<%=options.height%>" ', ' data-size="<%=options.size%>" data-height="<%=options.height%>" ',
@ -615,11 +614,11 @@ define([
if(this.$el.find('.toggle.btn').hasClass('off')) { if(this.$el.find('.toggle.btn').hasClass('off')) {
this.$el.find('.sr-value').text(` this.$el.find('.sr-value').text(`
${label}, ${offText}, ` + gettext('Toggle button') + ` ${label}, ${offText}, ` + gettext('Toggle') + `
`); `);
} else { } else {
this.$el.find('.sr-value').text(` this.$el.find('.sr-value').text(`
${label}, ${onText}, ` + gettext('Toggle button') + ` ${label}, ${onText}, ` + gettext('Toggle') + `
`); `);
} }
}, },
@ -693,6 +692,7 @@ define([
.attr('id', data.cId); .attr('id', data.cId);
this.$el.find('.toggle.btn .toggle-group .btn').attr('aria-hidden', true); this.$el.find('.toggle.btn .toggle-group .btn').attr('aria-hidden', true);
this.$el.find('div.toggle').append('<label class="sr-value sr-only" for="<%=cId%>"></label>');
this.setSrValue(); this.setSrValue();
this.updateInvalid(); this.updateInvalid();