From 4600920f3aefe2f5b05d039b9bd44923b5454430 Mon Sep 17 00:00:00 2001
From: "Evan W. Patton" <ewpatton@mit.edu>
Date: Wed, 4 Jun 2025 14:37:29 -0700
Subject: [PATCH] fix: Implement alternative highlighting scheme for search

Change-Id: Ifcee0a5a30374b0d1e72a24c6c6d538dba16e58f
---
 plugins/workspace-search/src/css.ts                   | 11 +++++++----
 plugins/workspace-search/src/workspace_search.ts      | 10 ++++++----
 .../test/workspace_search_test.mocha.js               |  4 ++--
 3 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/plugins/workspace-search/src/css.ts b/plugins/workspace-search/src/css.ts
index 2adb2365b1..59c516781c 100644
--- a/plugins/workspace-search/src/css.ts
+++ b/plugins/workspace-search/src/css.ts
@@ -41,11 +41,14 @@ const arrowUpSvgDataUri =
 /**
  * CSS for workspace search.
  */
-const cssContent = `path.blocklyPath.blockly-ws-search-highlight {
-    fill: #000;
+const cssContent = `.blockly-ws-search-active g.blocklyDraggable>path {
+    filter: saturate(0);
   }
-  path.blocklyPath.blockly-ws-search-highlight.blockly-ws-search-current {
-    fill: grey;
+  .blockly-ws-search-active g.blockly-ws-search-highlight>path {
+    filter: saturate(50%);
+  }
+  .blockly-ws-search-active g.blockly-ws-search-current>path {
+    filter: saturate(150%);
   }
   .blockly-ws-search-close-btn {
     background: url(${closeSvgDataUri}) no-repeat top left;
diff --git a/plugins/workspace-search/src/workspace_search.ts b/plugins/workspace-search/src/workspace_search.ts
index e13a95ca00..ac55458ecb 100644
--- a/plugins/workspace-search/src/workspace_search.ts
+++ b/plugins/workspace-search/src/workspace_search.ts
@@ -487,6 +487,7 @@ export class WorkspaceSearch implements Blockly.IPositionable {
       this.searchText,
       this.caseSensitive,
     );
+    this.workspace.getSvgGroup().classList.add('blockly-ws-search-active');
     this.highlightSearchGroup(this.blocks);
     let currentIdx = 0;
     if (preserveCurrent) {
@@ -581,6 +582,7 @@ export class WorkspaceSearch implements Blockly.IPositionable {
     }
     this.currentBlockIndex = -1;
     this.blocks = [];
+    this.workspace.getSvgGroup().classList.remove('blockly-ws-search-active');
   }
 
   /**
@@ -590,7 +592,7 @@ export class WorkspaceSearch implements Blockly.IPositionable {
    * @param currentBlock The block to highlight.
    */
   protected highlightCurrentSelection(currentBlock: Blockly.BlockSvg) {
-    const path = currentBlock.pathObject.svgPath;
+    const path = currentBlock.getSvgRoot();
     Blockly.utils.dom.addClass(path, 'blockly-ws-search-current');
   }
 
@@ -600,7 +602,7 @@ export class WorkspaceSearch implements Blockly.IPositionable {
    * @param currentBlock The block to unhighlight.
    */
   protected unhighlightCurrentSelection(currentBlock: Blockly.BlockSvg) {
-    const path = currentBlock.pathObject.svgPath;
+    const path = currentBlock.getSvgRoot();
     Blockly.utils.dom.removeClass(path, 'blockly-ws-search-current');
   }
 
@@ -611,7 +613,7 @@ export class WorkspaceSearch implements Blockly.IPositionable {
    */
   protected highlightSearchGroup(blocks: Blockly.BlockSvg[]) {
     blocks.forEach((block) => {
-      const blockPath = block.pathObject.svgPath;
+      const blockPath = block.getSvgRoot();
       Blockly.utils.dom.addClass(blockPath, 'blockly-ws-search-highlight');
     });
   }
@@ -623,7 +625,7 @@ export class WorkspaceSearch implements Blockly.IPositionable {
    */
   protected unhighlightSearchGroup(blocks: Blockly.BlockSvg[]) {
     blocks.forEach((block) => {
-      const blockPath = block.pathObject.svgPath;
+      const blockPath = block.getSvgRoot();
       Blockly.utils.dom.removeClass(blockPath, 'blockly-ws-search-highlight');
     });
   }
diff --git a/plugins/workspace-search/test/workspace_search_test.mocha.js b/plugins/workspace-search/test/workspace_search_test.mocha.js
index fea76c17da..fa42f04ed5 100644
--- a/plugins/workspace-search/test/workspace_search_test.mocha.js
+++ b/plugins/workspace-search/test/workspace_search_test.mocha.js
@@ -22,7 +22,7 @@ suite('WorkspaceSearch', function () {
    * @returns {boolean} True if the block is currently highlighted.
    */
   function isBlockHighlighted(block) {
-    const path = block.pathObject.svgPath;
+    const path = block.getSvgRoot();
     const classes = path.getAttribute('class');
     return (
       (' ' + classes + ' ').indexOf(' blockly-ws-search-highlight ') !== -1
@@ -34,7 +34,7 @@ suite('WorkspaceSearch', function () {
    * @returns {boolean} True if the block is currently styled.
    */
   function isBlockCurrentStyled(block) {
-    const path = block.pathObject.svgPath;
+    const path = block.getSvgRoot();
     const classes = path.getAttribute('class');
     return (' ' + classes + ' ').indexOf(' blockly-ws-search-current ') !== -1;
   }