diff --git a/assets/app/hooks/trace_body_search_highlight.js b/assets/app/hooks/trace_body_search_highlight.js index e672a909d..8740dba58 100644 --- a/assets/app/hooks/trace_body_search_highlight.js +++ b/assets/app/hooks/trace_body_search_highlight.js @@ -1,21 +1,36 @@ -import { highlightSearchRanges } from '../utils/dom'; +import { highlightSearchRanges, findRanges } from '../utils/dom'; -import { findRanges } from '../utils/dom'; +const rangesByElementId = new Map(); + +function updateGlobalHighlight() { + const allRanges = Array.from(rangesByElementId.values()).flat(); + highlightSearchRanges('traces-search-highlight', allRanges, true); +} const TraceBodySearchHighlight = { mounted() { - const phrase = this.el.dataset.search_phrase; - if (phrase === undefined || phrase === '') return; - - const ranges = findRanges(this.el, phrase); - highlightSearchRanges('traces-search-highlight', ranges); + this.handleHighlight(); }, + updated() { + this.handleHighlight(); + }, + + destroyed() { + rangesByElementId.delete(this.el.id); + updateGlobalHighlight(); + }, + + handleHighlight() { const phrase = this.el.dataset.search_phrase; - if (phrase === undefined || phrase === '') return; - const ranges = findRanges(this.el, phrase); - highlightSearchRanges('traces-search-highlight', ranges); + if (!phrase) { + rangesByElementId.delete(this.el.id); + } else { + rangesByElementId.set(this.el.id, findRanges(this.el, phrase)); + } + + updateGlobalHighlight(); }, }; diff --git a/lib/live_debugger/app/debugger/callback_tracing/web/components/trace.ex b/lib/live_debugger/app/debugger/callback_tracing/web/components/trace.ex index f266e8e4a..69935e5bd 100644 --- a/lib/live_debugger/app/debugger/callback_tracing/web/components/trace.ex +++ b/lib/live_debugger/app/debugger/callback_tracing/web/components/trace.ex @@ -336,7 +336,7 @@ defmodule LiveDebugger.App.Debugger.CallbackTracing.Web.Components.Trace do />
div>div>div>button]:hidden", + "max-h-[70vh] overflow-y-auto overflow-x-auto flex flex-col gap-4 items-start justify-start hover:[&>div>div>div>button]:hidden", if(is_nil(@displayed_trace.error), do: "p-4", else: "[&>div>div>div>div>button]:hidden") ]}> <.trace_body_navbar_wrapper