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
parent
9dd37aa3ee
commit
9594732e51
|
@ -43,9 +43,16 @@
|
||||||
* The link to add the block.
|
* The link to add the block.
|
||||||
*/
|
*/
|
||||||
const toggleBlockEntry = (index, link) => {
|
const toggleBlockEntry = (index, link) => {
|
||||||
|
const $link = $(link);
|
||||||
const textMatch =
|
const textMatch =
|
||||||
link.textContent.toLowerCase().indexOf(query) !== -1;
|
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.
|
// Filter if the length of the query is at least 2 characters.
|
||||||
|
@ -82,15 +89,17 @@
|
||||||
.find('.js-layout-builder-category[remember-closed]')
|
.find('.js-layout-builder-category[remember-closed]')
|
||||||
.removeAttr('open')
|
.removeAttr('open')
|
||||||
.removeAttr('remember-closed');
|
.removeAttr('remember-closed');
|
||||||
|
// Show all categories since filter is turned off.
|
||||||
$categories.find('.js-layout-builder-category').show();
|
$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.'));
|
announce(Drupal.t('All available blocks are listed.'));
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
$(
|
$(
|
||||||
once('block-filter-text', 'input.js-layout-builder-filter', context),
|
once('block-filter-text', 'input.js-layout-builder-filter', context),
|
||||||
).on('keyup', debounce(filterBlockList, 200));
|
).on('input', debounce(filterBlockList, 200));
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -61,7 +61,7 @@ class BlockFilterTest extends WebDriverTestBase {
|
||||||
$assert_session->assertWaitOnAjaxRequest();
|
$assert_session->assertWaitOnAjaxRequest();
|
||||||
|
|
||||||
// Get all blocks, for assertions later.
|
// 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');
|
$categories = $page->findAll('css', '.js-layout-builder-category');
|
||||||
|
|
||||||
$filter = $assert_session->elementExists('css', '.js-layout-builder-filter');
|
$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';
|
$fewer_blocks_message = ' blocks are available in the modified list';
|
||||||
$this->assertAnnounceContains($fewer_blocks_message);
|
$this->assertAnnounceContains($fewer_blocks_message);
|
||||||
$visible_rows = $this->filterVisibleElements($blocks);
|
$visible_rows = $this->filterVisibleElements($blocks);
|
||||||
$this->assertGreaterThan(0, count($blocks));
|
$this->assertCount(4, $visible_rows);
|
||||||
$this->assertLessThan(count($blocks), count($visible_rows));
|
|
||||||
$visible_categories = $this->filterVisibleElements($categories);
|
$visible_categories = $this->filterVisibleElements($categories);
|
||||||
$this->assertGreaterThan(0, count($visible_categories));
|
$this->assertCount(4, $visible_categories);
|
||||||
$this->assertLessThan(count($categories), count($visible_categories));
|
|
||||||
|
|
||||||
// Test Drupal.announce() message when multiple matches are present.
|
// Test Drupal.announce() message when multiple matches are present.
|
||||||
$expected_message = count($visible_rows) . $fewer_blocks_message;
|
$expected_message = count($visible_rows) . $fewer_blocks_message;
|
||||||
$this->assertAnnounceContains($expected_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.
|
// Test Drupal.announce() message when only one match is present.
|
||||||
$filter->setValue('Powered by');
|
$filter->setValue('Powered by');
|
||||||
$this->assertAnnounceContains(' block is available');
|
$this->assertAnnounceContains(' block is available');
|
||||||
|
|
Loading…
Reference in New Issue