add expand-collapse button

src/icon.ts

@@ -1,8 +1,14 @@
 import { LabIcon } from '@jupyterlab/ui-components';
 
 import wholeWord from '../style/icons/whole-word.svg';
+import expandAll from '../style/icons/expand-all.svg';
 
 export const wholeWordIcon = new LabIcon({
  name: 'search-replace:wholeWord',
  svgstr: wholeWord
 });
+
+export const expandAllIcon = new LabIcon({
+ name: 'search-replace:expandAll',
+ svgstr: expandAll
+});

src/searchReplace.tsx

@@ -3,7 +3,7 @@ import { Debouncer } from '@lumino/polling';
 import { CommandRegistry } from '@lumino/commands';
 import { requestAPI } from './handler';
 import { VDomModel, VDomRenderer } from '@jupyterlab/apputils';
-import { wholeWordIcon } from './icon';
+import { wholeWordIcon, expandAllIcon } from './icon';
 import {
  Search,
  TreeView,
@@ -294,6 +294,23 @@ const SearchReplaceElement = (props: IProps) => {
  >
  <refreshIcon.react></refreshIcon.react>
  </Button>
+ <Button
+ title="button to expand and collapse all results"
+ onClick={() => {
+ const elements =
+ document.getElementsByClassName('search-tree-files');
+ for (let i = 0; i < elements.length; i++) {
+ const treeItem = elements[i];
+ if (treeItem.hasAttribute('expanded')) {
+ treeItem.removeAttribute('expanded');
+ } else {
+ treeItem.setAttribute('expanded', '');
+ }
+ }
+ }}
+ >
+ <expandAllIcon.react></expandAllIcon.react>
+ </Button>
  </div>
  <div className="search-bar-with-options">
  <Search

ui-tests/tests/search.spec.ts

@@ -172,3 +172,26 @@ test('should make a new request on refresh', async ({ page }) => {
  page.locator('[title="button to refresh and reload results"]').click()
  ]);
 });
+
+
+test('should expand and collapse tree view on clicking expand-collapse button', async ({ page }) => {
+ // Click #tab-key-0 .lm-TabBar-tabIcon svg >> nth=0
+ await page.locator('[title="Search and replace"]').click();
+ // Fill input[type="search"]
+ await page.locator('input[type="search"]').fill('strange');
+
+ await Promise.all([
+ page.waitForResponse(
+ response =>
+ /.*search\/\?query=strange/.test(response.url()) &&
+ response.request().method() === 'GET'
+ ),
+ page.locator('input[type="search"]').press('Enter'),
+ page.locator('[title="button to expand and collapse all results"]').click()
+ ]);
+
+ expect(await page.locator('.search-tree-matches').count()).toEqual(0);
+
+ await page.locator('[title="button to expand and collapse all results"]').click();
+ expect(await page.locator('.search-tree-matches').count()).toEqual(5);
+});