Commit 847b2141 authored by lauriii's avatar lauriii

Issue #2805205 by andrewmacpherson, michielnugter, lauriekap, BarisW, pk188,...

Issue #2805205 by andrewmacpherson, michielnugter, lauriekap, BarisW, pk188, Ehud, arunkumark, SteffenR, Lendude, droplet, alexpott, xiwar: Provide screen-reader feedback when filtering by block name
parent fdfa59dd
......@@ -16,4 +16,6 @@ drupal.block.admin:
dependencies:
- core/jquery
- core/drupal
- core/drupal.announce
- core/drupal.debounce
- core/drupal.dialog.ajax
......@@ -3,7 +3,7 @@
* Block admin behaviors.
*/
(function ($, Drupal) {
(function ($, Drupal, debounce) {
/**
* Filters the block list by a text input search string.
*
......@@ -53,6 +53,13 @@
// Filter if the length of the query is at least 2 characters.
if (query.length >= 2) {
$filter_rows.each(toggleBlockEntry);
Drupal.announce(
Drupal.formatPlural(
$table.find('tr:visible').length - 1,
'1 block is available in the modified list.',
'@count blocks are available in the modified list.'
)
);
}
else {
$filter_rows.each(function (index) {
......@@ -63,7 +70,7 @@
if ($table.length) {
$filter_rows = $table.find('div.block-filter-text-source');
$input.on('keyup', filterBlockList);
$input.on('keyup', debounce(filterBlockList, 200));
}
},
};
......@@ -90,4 +97,4 @@
}
},
};
}(jQuery, Drupal));
}(jQuery, Drupal, Drupal.debounce));
......@@ -5,7 +5,7 @@
* @preserve
**/
(function ($, Drupal) {
(function ($, Drupal, debounce) {
Drupal.behaviors.blockFilterByText = {
attach: function attach(context, settings) {
var $input = $('input.block-filter-text').once('block-filter-text');
......@@ -24,6 +24,7 @@
if (query.length >= 2) {
$filter_rows.each(toggleBlockEntry);
Drupal.announce(Drupal.formatPlural($table.find('tr:visible').length - 1, '1 block is available in the modified list.', '@count blocks are available in the modified list.'));
} else {
$filter_rows.each(function (index) {
$(this).parent().parent().show();
......@@ -33,7 +34,7 @@
if ($table.length) {
$filter_rows = $table.find('div.block-filter-text-source');
$input.on('keyup', filterBlockList);
$input.on('keyup', debounce(filterBlockList, 200));
}
}
};
......@@ -51,4 +52,4 @@
}
}
};
})(jQuery, Drupal);
\ No newline at end of file
})(jQuery, Drupal, Drupal.debounce);
\ No newline at end of file
<?php
namespace Drupal\Tests\block\FunctionalJavascript;
use Behat\Mink\Element\NodeElement;
use Drupal\FunctionalJavascriptTests\JavascriptTestBase;
/**
* Tests the JavaScript functionality of the block add filter.
*
* @group block
*/
class BlockFilterTest extends JavascriptTestBase {
/**
* {@inheritdoc}
*/
public static $modules = ['user', 'block'];
/**
* {@inheritdoc}
*/
protected function setUp() {
parent::setUp();
$admin_user = $this->drupalCreateUser([
'administer blocks',
]);
$this->drupalLogin($admin_user);
}
/**
* Tests block filter.
*/
public function testBlockFilter() {
$this->drupalGet('admin/structure/block');
$assertSession = $this->assertSession();
$session = $this->getSession();
$page = $session->getPage();
// Find the block filter field on the add-block dialog.
$page->find('css', '#edit-blocks-region-header-title')->click();
$filter = $assertSession->waitForElement('css', '.block-filter-text');
// Get all block rows, for assertions later.
$block_rows = $page->findAll('css', '.block-add-table tbody tr');
// Test block filter reduces the number of visible rows.
$filter->setValue('ad');
$session->wait(10000, 'jQuery("#drupal-live-announce").html().indexOf("blocks are available") > -1');
$visible_rows = $this->filterVisibleElements($block_rows);
if (count($block_rows) > 0) {
$this->assertNotEquals(count($block_rows), count($visible_rows));
}
// Test Drupal.announce() message when multiple matches are expected.
$expected_message = count($visible_rows) . ' blocks are available in the modified list.';
$assertSession->elementTextContains('css', '#drupal-live-announce', $expected_message);
// Test Drupal.announce() message when only one match is expected.
$filter->setValue('Powered by');
$session->wait(10000, 'jQuery("#drupal-live-announce").html().indexOf("block is available") > -1');
$visible_rows = $this->filterVisibleElements($block_rows);
$this->assertEquals(1, count($visible_rows));
$expected_message = '1 block is available in the modified list.';
$assertSession->elementTextContains('css', '#drupal-live-announce', $expected_message);
// Test Drupal.announce() message when no matches are expected.
$filter->setValue('Pan-Galactic Gargle Blaster');
$session->wait(10000, 'jQuery("#drupal-live-announce").html().indexOf("0 blocks are available") > -1');
$visible_rows = $this->filterVisibleElements($block_rows);
$this->assertEquals(0, count($visible_rows));
$expected_message = '0 blocks are available in the modified list.';
$assertSession->elementTextContains('css', '#drupal-live-announce', $expected_message);
}
/**
* Removes any non-visible elements from the passed array.
*
* @param NodeElement[] $elements
* An array of node elements.
*
* @return NodeElement[]
*/
protected function filterVisibleElements(array $elements) {
$elements = array_filter($elements, function(NodeElement $element) {
return $element->isVisible();
});
return $elements;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment