From 8d65841cb9197f72b3ebfe16af9dbae806b89859 Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Fri, 2 May 2025 16:50:29 +0100 Subject: [PATCH 1/3] fix: block highlight clear when searching + stepping results --- .../components/analysis-view/AnalysisView.ts | 17 +++++++++++++++-- .../components/calltree-view/CalltreeView.ts | 16 +++++++++++----- .../modules/components/database-view/DMLView.ts | 9 ++++----- .../components/database-view/SOQLView.ts | 10 ++++------ 4 files changed, 34 insertions(+), 18 deletions(-) diff --git a/log-viewer/modules/components/analysis-view/AnalysisView.ts b/log-viewer/modules/components/analysis-view/AnalysisView.ts index 1b02a1ac..2082d564 100644 --- a/log-viewer/modules/components/analysis-view/AnalysisView.ts +++ b/log-viewer/modules/components/analysis-view/AnalysisView.ts @@ -110,6 +110,7 @@ export class AnalysisView extends LitElement { options: { matchCase: false }, }; totalMatches = 0; + blockClearHighlights = false; constructor() { super(); @@ -224,8 +225,10 @@ export class AnalysisView extends LitElement { newFindArgs.text = ''; } if (newSearch || clearHighlights) { + this.blockClearHighlights = true; //@ts-expect-error This is a custom function added in by Find custom module const result = this.analysisTable.find(this.findArgs); + this.blockClearHighlights = false; this.totalMatches = result.totalMatches; this.findMap = result.matchIndexes; @@ -236,6 +239,12 @@ export class AnalysisView extends LitElement { } } + const hasHighlights = Object.keys(this.findMap).length !== 0; + if (!hasHighlights) { + return; + } + this.blockClearHighlights = true; + this.analysisTable?.blockRedraw(); const currentRow = this.findMap[this.findArgs.count]; const rows = [ currentRow, @@ -247,6 +256,8 @@ export class AnalysisView extends LitElement { }); //@ts-expect-error This is a custom function added in by RowNavigation custom module this.analysisTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false }); + this.analysisTable?.restoreRedraw(); + this.blockClearHighlights = false; } async _renderAnalysis(rootMethod: ApexLog) { @@ -411,8 +422,10 @@ export class AnalysisView extends LitElement { }); this.analysisTable.on('dataFiltering', () => { - this._resetFindWidget(); - this._clearSearchHighlights(); + if (!this.blockClearHighlights) { + this._resetFindWidget(); + this._clearSearchHighlights(); + } }); } diff --git a/log-viewer/modules/components/calltree-view/CalltreeView.ts b/log-viewer/modules/components/calltree-view/CalltreeView.ts index e552e062..b987ecaa 100644 --- a/log-viewer/modules/components/calltree-view/CalltreeView.ts +++ b/log-viewer/modules/components/calltree-view/CalltreeView.ts @@ -57,7 +57,7 @@ export class CalltreeView extends LitElement { findMap: { [key: number]: RowComponent } = {}; totalMatches = 0; - canClearSearchHighlights = false; + blockClearHighlights = false; searchString = ''; findArgs: { text: string; count: number; options: { matchCase: boolean } } = { text: '', @@ -350,7 +350,6 @@ export class CalltreeView extends LitElement { if (!isTableVisible && !this.totalMatches) { return; } - this.canClearSearchHighlights = false; const newFindArgs = JSON.parse(JSON.stringify(e.detail)); const newSearch = @@ -363,8 +362,10 @@ export class CalltreeView extends LitElement { newFindArgs.text = ''; } if (newSearch || clearHighlights) { + this.blockClearHighlights = true; //@ts-expect-error This is a custom function added in by Find custom module const result = this.calltreeTable.find(this.findArgs); + this.blockClearHighlights = false; this.totalMatches = result.totalMatches; this.findMap = result.matchIndexes; @@ -375,6 +376,12 @@ export class CalltreeView extends LitElement { } } + // Highlight the current row and reset the previous or next depending on whether we are stepping forward or back. + const hasHighlights = Object.keys(this.findMap).length !== 0; + if (!hasHighlights) { + return; + } + this.blockClearHighlights = true; this.calltreeTable?.blockRedraw(); const currentRow = this.findMap[this.findArgs.count]; const rows = [ @@ -391,7 +398,7 @@ export class CalltreeView extends LitElement { this.calltreeTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false }); } this.calltreeTable?.restoreRedraw(); - this.canClearSearchHighlights = true; + this.blockClearHighlights = false; } _highlight(inputString: string, substring: string) { @@ -775,8 +782,7 @@ export class CalltreeView extends LitElement { this.calltreeTable.on('dataFiltering', () => { // With a datatree the dataFiltering event occurs multi times and we only want to call this once. // We will reset the flag when the user next searches. - if (this.canClearSearchHighlights) { - this.canClearSearchHighlights = false; + if (!this.blockClearHighlights) { this._resetFindWidget(); this._clearSearchHighlights(); } diff --git a/log-viewer/modules/components/database-view/DMLView.ts b/log-viewer/modules/components/database-view/DMLView.ts index 7ea6d345..a79e1d7b 100644 --- a/log-viewer/modules/components/database-view/DMLView.ts +++ b/log-viewer/modules/components/database-view/DMLView.ts @@ -62,7 +62,7 @@ export class DMLView extends LitElement { }; findMap: { [key: number]: RowComponent } = {}; totalMatches = 0; - canClearHighlights = false; + blockClearHighlights = false; constructor() { super(); @@ -220,8 +220,6 @@ export class DMLView extends LitElement { return; } - this.canClearHighlights = true; - const newFindArgs = JSON.parse(JSON.stringify(e.detail)); if (!isTableVisible) { newFindArgs.text = ''; @@ -237,8 +235,10 @@ export class DMLView extends LitElement { newFindArgs.text = ''; } if (newSearch || clearHighlights) { + this.blockClearHighlights = true; //@ts-expect-error This is a custom function added in by Find custom module const result = this.dmlTable.find(this.findArgs); + this.blockClearHighlights = false; this.totalMatches = result.totalMatches; this.findMap = result.matchIndexes; @@ -250,7 +250,6 @@ export class DMLView extends LitElement { ); } } - this.canClearHighlights = false; } _renderDMLTable(dmlTableContainer: HTMLElement, dmlLines: DMLBeginLine[]) { @@ -381,7 +380,7 @@ export class DMLView extends LitElement { }); this.dmlTable.on('dataFiltering', () => { - if (this.canClearHighlights) { + if (!this.blockClearHighlights) { this._resetFindWidget(); this._clearSearchHighlights(); } diff --git a/log-viewer/modules/components/database-view/SOQLView.ts b/log-viewer/modules/components/database-view/SOQLView.ts index 2915fe9b..2be3b78e 100644 --- a/log-viewer/modules/components/database-view/SOQLView.ts +++ b/log-viewer/modules/components/database-view/SOQLView.ts @@ -73,7 +73,7 @@ export class SOQLView extends LitElement { }; findMap: { [key: number]: RowComponent } = {}; totalMatches = 0; - canClearHighlights = false; + blockClearHighlights = false; get _soqlTableWrapper(): HTMLDivElement | null { return this.renderRoot?.querySelector('#db-soql-table') ?? null; @@ -254,8 +254,6 @@ export class SOQLView extends LitElement { return; } - this.canClearHighlights = true; - const newFindArgs = JSON.parse(JSON.stringify(e.detail)); const newSearch = newFindArgs.text !== this.findArgs.text || @@ -267,8 +265,10 @@ export class SOQLView extends LitElement { newFindArgs.text = ''; } if (newSearch || clearHighlights) { + this.blockClearHighlights = true; //@ts-expect-error This is a custom function added in by Find custom module const result = this.soqlTable.find(this.findArgs); + this.blockClearHighlights = false; this.totalMatches = 0; this.findMap = result.matchIndexes; @@ -280,8 +280,6 @@ export class SOQLView extends LitElement { ); } } - - this.canClearHighlights = false; } _renderSOQLTable(soqlTableContainer: HTMLElement, soqlLines: SOQLExecuteBeginLine[]) { @@ -538,7 +536,7 @@ export class SOQLView extends LitElement { }); this.soqlTable.on('dataFiltering', () => { - if (this.canClearHighlights) { + if (!this.blockClearHighlights) { this._resetFindWidget(); this._clearSearchHighlights(); } From 9712613d4f9e2ffd231abeb3aa21847bfdc82b6a Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Fri, 2 May 2025 17:13:54 +0100 Subject: [PATCH 2/3] fix: clear search highlights on render instead of filter event --- .../components/analysis-view/AnalysisView.ts | 2 +- .../components/calltree-view/CalltreeView.ts | 16 +++++++--------- .../modules/components/database-view/DMLView.ts | 12 +++++------- .../modules/components/database-view/SOQLView.ts | 4 +--- 4 files changed, 14 insertions(+), 20 deletions(-) diff --git a/log-viewer/modules/components/analysis-view/AnalysisView.ts b/log-viewer/modules/components/analysis-view/AnalysisView.ts index 2082d564..fbe530e3 100644 --- a/log-viewer/modules/components/analysis-view/AnalysisView.ts +++ b/log-viewer/modules/components/analysis-view/AnalysisView.ts @@ -421,7 +421,7 @@ export class AnalysisView extends LitElement { ], }); - this.analysisTable.on('dataFiltering', () => { + this.analysisTable.on('renderStarted', () => { if (!this.blockClearHighlights) { this._resetFindWidget(); this._clearSearchHighlights(); diff --git a/log-viewer/modules/components/calltree-view/CalltreeView.ts b/log-viewer/modules/components/calltree-view/CalltreeView.ts index b987ecaa..73c323cf 100644 --- a/log-viewer/modules/components/calltree-view/CalltreeView.ts +++ b/log-viewer/modules/components/calltree-view/CalltreeView.ts @@ -779,15 +779,6 @@ export class CalltreeView extends LitElement { ], }); - this.calltreeTable.on('dataFiltering', () => { - // With a datatree the dataFiltering event occurs multi times and we only want to call this once. - // We will reset the flag when the user next searches. - if (!this.blockClearHighlights) { - this._resetFindWidget(); - this._clearSearchHighlights(); - } - }); - this.calltreeTable.on('dataFiltered', () => { totalTimeFilterCache.clear(); selfTimeFilterCache.clear(); @@ -797,6 +788,13 @@ export class CalltreeView extends LitElement { this.typeFilterCache.clear(); }); + this.calltreeTable.on('renderStarted', () => { + if (!this.blockClearHighlights) { + this._resetFindWidget(); + this._clearSearchHighlights(); + } + }); + this.calltreeTable.on('tableBuilt', () => { resolve(); }); diff --git a/log-viewer/modules/components/database-view/DMLView.ts b/log-viewer/modules/components/database-view/DMLView.ts index a79e1d7b..7728d894 100644 --- a/log-viewer/modules/components/database-view/DMLView.ts +++ b/log-viewer/modules/components/database-view/DMLView.ts @@ -379,13 +379,6 @@ export class DMLView extends LitElement { }, }); - this.dmlTable.on('dataFiltering', () => { - if (!this.blockClearHighlights) { - this._resetFindWidget(); - this._clearSearchHighlights(); - } - }); - this.dmlTable.on('groupClick', (e: UIEvent, group: GroupComponent) => { const { type } = window.getSelection() ?? {}; if (type === 'Range') { @@ -414,6 +407,11 @@ export class DMLView extends LitElement { }); this.dmlTable.on('renderStarted', () => { + if (!this.blockClearHighlights) { + this._resetFindWidget(); + this._clearSearchHighlights(); + } + const holder = this._getTableHolder(); holder.style.minHeight = holder.clientHeight + 'px'; holder.style.overflowAnchor = 'none'; diff --git a/log-viewer/modules/components/database-view/SOQLView.ts b/log-viewer/modules/components/database-view/SOQLView.ts index 2be3b78e..560693a3 100644 --- a/log-viewer/modules/components/database-view/SOQLView.ts +++ b/log-viewer/modules/components/database-view/SOQLView.ts @@ -535,14 +535,12 @@ export class SOQLView extends LitElement { row.getCell('soql').getElement().style.height = origRowHeight + 'px'; }); - this.soqlTable.on('dataFiltering', () => { + this.soqlTable.on('renderStarted', () => { if (!this.blockClearHighlights) { this._resetFindWidget(); this._clearSearchHighlights(); } - }); - this.soqlTable.on('renderStarted', () => { const holder = this._getTableHolder(); holder.style.minHeight = holder.clientHeight + 'px'; holder.style.overflowAnchor = 'none'; From bfa923f34973cc01c91edd5fa271d5b179ea1c48 Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Fri, 2 May 2025 17:40:32 +0100 Subject: [PATCH 3/3] refactor: block redraw when stepping results --- log-viewer/modules/components/database-view/DMLView.ts | 4 ++++ log-viewer/modules/components/database-view/SOQLView.ts | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/log-viewer/modules/components/database-view/DMLView.ts b/log-viewer/modules/components/database-view/DMLView.ts index 7728d894..a9e39a04 100644 --- a/log-viewer/modules/components/database-view/DMLView.ts +++ b/log-viewer/modules/components/database-view/DMLView.ts @@ -204,6 +204,8 @@ export class DMLView extends LitElement { this.findArgs.count = highlightIndex; const currentRow = this.findMap[highlightIndex]; const rows = [currentRow, this.findMap[this.oldIndex]]; + this.blockClearHighlights = true; + this.dmlTable.blockRedraw(); rows.forEach((row) => { row?.reformat(); }); @@ -211,6 +213,8 @@ export class DMLView extends LitElement { //@ts-expect-error This is a custom function added in by RowNavigation custom module this.dmlTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false }); } + this.dmlTable.restoreRedraw(); + this.blockClearHighlights = false; this.oldIndex = highlightIndex; } diff --git a/log-viewer/modules/components/database-view/SOQLView.ts b/log-viewer/modules/components/database-view/SOQLView.ts index 560693a3..7d9e7150 100644 --- a/log-viewer/modules/components/database-view/SOQLView.ts +++ b/log-viewer/modules/components/database-view/SOQLView.ts @@ -235,6 +235,8 @@ export class SOQLView extends LitElement { this.findArgs.count = highlightIndex; const currentRow = this.findMap[highlightIndex]; + this.blockClearHighlights = true; + this.soqlTable.blockRedraw(); const rows = [currentRow, this.findMap[this.oldIndex]]; rows.forEach((row) => { row?.reformat(); @@ -244,6 +246,8 @@ export class SOQLView extends LitElement { //@ts-expect-error This is a custom function added in by RowNavigation custom module this.soqlTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false }); } + this.soqlTable.restoreRedraw(); + this.blockClearHighlights = false; this.oldIndex = highlightIndex; }