Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Issue #3223048 by smustgrave, Rishi Kulshreshtha, Theresa.Grannum, tim.plunkett, ranjith_kumar_k_u, larowlan, tedbow, oknate: Layout builder filter leaves blank space 

(cherry picked from commit a5291f0bdf)
merge-requests/3235/merge
Lauri Eskola 2023-03-12 14:31:37 +02:00
parent 9dd37aa3ee
commit 9594732e51
No known key found for this signature in database
GPG Key ID: 382FC0F5B0DF53F8
2 changed files with 33 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
core/modules/layout_builder/js/layout-builder.js
View File

@ -43,9 +43,16 @@
* The link to add the block.
*/
const toggleBlockEntry = (index, link) => {
const $link = $(link);
const textMatch =
link.textContent.toLowerCase().indexOf(query) !== -1;
$(link).toggle(textMatch);
// Checks if a category is currently hidden.
// Toggles the category on if so.
if ($link.closest('.js-layout-builder-category').is(':hidden')) {
$link.closest('.js-layout-builder-category').show();
}
// Toggle the li tag of the matching link.
$link.parent().toggle(textMatch);
};
// Filter if the length of the query is at least 2 characters.
@ -82,15 +89,17 @@
.find('.js-layout-builder-category[remember-closed]')
.removeAttr('open')
.removeAttr('remember-closed');
// Show all categories since filter is turned off.
$categories.find('.js-layout-builder-category').show();
$filterLinks.show();
// Show all li tags since filter is turned off.
$filterLinks.parent().show();
announce(Drupal.t('All available blocks are listed.'));
}
};
$(
once('block-filter-text', 'input.js-layout-builder-filter', context),
).on('keyup', debounce(filterBlockList, 200));
).on('input', debounce(filterBlockList, 200));
},
};

26
core/modules/layout_builder/tests/src/FunctionalJavascript/BlockFilterTest.php
View File

@ -61,7 +61,7 @@ class BlockFilterTest extends WebDriverTestBase {
$assert_session->assertWaitOnAjaxRequest();
// Get all blocks, for assertions later.
$blocks = $page->findAll('css', '.js-layout-builder-block-link');
$blocks = $page->findAll('css', '.js-layout-builder-categories li');
$categories = $page->findAll('css', '.js-layout-builder-category');
$filter = $assert_session->elementExists('css', '.js-layout-builder-filter');
@ -89,16 +89,32 @@ class BlockFilterTest extends WebDriverTestBase {
$fewer_blocks_message = ' blocks are available in the modified list';
$this->assertAnnounceContains($fewer_blocks_message);
$visible_rows = $this->filterVisibleElements($blocks);
$this->assertGreaterThan(0, count($blocks));
$this->assertLessThan(count($blocks), count($visible_rows));
$this->assertCount(4, $visible_rows);
$visible_categories = $this->filterVisibleElements($categories);
$this->assertGreaterThan(0, count($visible_categories));
$this->assertLessThan(count($categories), count($visible_categories));
$this->assertCount(4, $visible_categories);
// Test Drupal.announce() message when multiple matches are present.
$expected_message = count($visible_rows) . $fewer_blocks_message;
$this->assertAnnounceContains($expected_message);
// Test 3 letter search.
$filter->setValue('adm');
$visible_rows = $this->filterVisibleElements($blocks);
$this->assertCount(3, $visible_rows);
$visible_categories = $this->filterVisibleElements($categories);
$this->assertCount(3, $visible_categories);
// Retest that blocks appear when reducing letters.
$filter->setValue('ad');
$visible_rows = $this->filterVisibleElements($blocks);
$this->assertCount(4, $visible_rows);
$visible_categories = $this->filterVisibleElements($categories);
$this->assertCount(4, $visible_categories);
// Test blocks reappear after being filtered by repeating search for "a"
$filter->setValue('a');
$this->assertAnnounceContains('All available blocks are listed.');
// Test Drupal.announce() message when only one match is present.
$filter->setValue('Powered by');
$this->assertAnnounceContains(' block is available');