Problem/Motivation

Many forms in Views UI have long lists of options which can be filtered by keyword or category (e.g. Add sort criteria dialog). When using these filter controls, the contents of the list change dynamically. The changes are easily noted visually, but are not conveyed to users with screen readers.

Proposed resolution

Use Drupal.announce() to convey a short message about the number of options now present in the filtered list.

We already do this with the module filter on the admin/modules page - see system.modules.js.

Remaining tasks

  • Devise the announcement string(s): "6 options are available in the modified list."
  • Write a patch.
  • Tests - can we confirm the updated content of div#drupal-live-announce with JavascriptTestBase?

User interface changes

  • No visible changes intended.
  • Add a screen reader announcement to convey updates which are currently only apparent visually.
  • Introduces a new translatable string for Drupal.announce().

API changes

None expected.

Data model changes

None expected.

Comments

andrewmacpherson created an issue. See original summary.

andrewmacpherson’s picture

Title: Provide screen-reader feedback when Views filterable options are updated » Provide screen-reader feedback when Views UI filterable options are updated
andrewmacpherson’s picture

mgifford’s picture

This is the exact use case why Drupal.announce() was built. We just need to use it more consistently.

andrewmacpherson’s picture

Issue summary: View changes
Issue tags: +Dublin2016, +Novice

This would be a good novice task for a mentored sprint at Dublin DrupalCon 2016.

It basically involves a copy/paste, adding a JS behaviour to views module.

We have an accessibility table in the general sprints room but I can come to the mentored room if you need me.

Details of the Drupal.announce() are here:
New accessibility feature: Drupal.announce() (change record)
Accessibility tools for JavaScript in Drupal 8 (handbook page)

Ehud’s picture

Patch by Matthew Lambert (xiwar) and Ehud Ovadia (Ehud).

kiwimind’s picture

Re-rolling to fix indentation issue.

DuaelFr’s picture

I don't like the way the results are counted. The entire handleFilter function is DOM-agnostic so I think we should keep it this way so, if an admin theme wants to change the way that UI is done, this function will continue working. See the attached patch.

I think that we could test this feature but, as an accessibility improvement, I'd like it to be commited quickly and maybe add tests in a follow-up. @mgifford what would you think about that?

mgifford’s picture

I'd like to do that, but not sure that we'll get buy-in. The D8 cycle has had tests first for pretty much everything.

Version: 8.3.x-dev » 8.4.x-dev

Drupal 8.3.0-alpha1 will be released the week of January 30, 2017, which means new developments and disruptive changes should now be targeted against the 8.4.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

BarisW’s picture

Status: Needs review » Needs work
+++ b/core/modules/views_ui/js/views-admin.js
@@ -536,10 +537,18 @@
+      Drupal.announce(
+        Drupal.t(
+          '!views views are available in the modified list.',
+          {'!views': areActive}
+        )
+      );

I suggest using Drupal.plural to make sure that we don't end up with '1 views are available'.

starshaped’s picture

Working on this as part of #sprintweekend2017 #sprintweekendBOS.

starshaped’s picture

Added call to Drupal.formatPlural to display '1 view is' or 'n views are' depending on the search results. Patch attached.

starshaped’s picture

Re-uploading the patch and flipping the ticket to 'needs review' to kick off testing.

left’s picture

This patch is based on #9.

I think #14 is incomplete due to not having incorporated #9 and the use of both Drupal.t and formatPlural was not necessary.

I've used only formatPlural (without Drupal.t) and I've renamed the areActive variable to activeViews as I feel it is more descriptive.

BarisW’s picture

Status: Needs review » Needs work

Great work left and starshaped. The patch in #16 works, but can be improved just a little.

+++ b/core/modules/views_ui/js/views-admin.js
@@ -536,10 +537,18 @@
+      Drupal.announce(
+        Drupal.formatPlural(activeViews,
+          '1 view is available in the modified list.', '!views views are available in the modified list.',
+          {'!views': activeViews})

One thing to improve here: formatPlural already replaces the @count variable out-of-the-box. If you only want to replace the number of items, you don't need to add the extra parameters.

This would suffice:

<?php
Drupal.announce(
  Drupal.formatPlural(activeViews, '1 view is available in the modified list.', '@count views are available in the modified list.')
);
?>
left’s picture

Hi @BarisW

Thanks for the review and input. I've made a new patch to reflect and changed the status to 'needs review'.

BarisW’s picture

Status: Needs review » Needs work

Ah, but now the patch is missing the logic to count the results. Plus, the Drupal.announce is new. This seems more like a diff against your precious patch than against drupal core?

left’s picture

Oops, you're right. I think I might be missing some details about the patching procedure. It's starting to make more sense now.
Another patch attempt attached :) Thanks for taking the time @BarisW

BarisW’s picture

Perfect. When the test turns green this is rtbc according to me.

andrewmacpherson’s picture

Status: Needs review » Needs work

The message in patch #21 says "3 views are available in the modified list." (emph mine), but it isn't a list of views - it's a list of fields (or filters, or sort options, etc.).

The tasks in the issue summary says "6 options are available..." so that's minor change we still need.

Bonus idea: could we get the message to reflect which list we are looking at? Something like "6 fields are available..." vs "6 filter types are available...". If that turns out to be hard, we can leave it for a follow-up.

rachel_norfolk’s picture

Think I can see how to do this - taking a look now. Give me till the end of the day...

rachel_norfolk’s picture

Whilst it annoys me greatly that I can't seem to obtain the thing being added, as per #23, we do need to change the text slightly. The text

@count options are available in the modified list.

seems to make sense in all circumstances, at least.

andrewmacpherson’s picture

@rachel_norfolk - Thanks, patch #25 fixes the issue from #23.

The next step is adding functional javascript tests for the announcement message.

Some of the related Drupal.announce() issues already have some tests which are partly written. #2715663: Use Drupal.formatPlural for when announcing module-filter results for screenreader users is a good starting point. If anyone wants to have a crack at those, make sure you understand how to run FunctionalJavascript tests in D8. See Javascript Testing Comes to Drupal 8.

Munavijayalakshmi’s picture

Status: Needs review » Needs work