Some instructions, not that this feels more like second-good-bug: 1) The debugger is using CodeMirror to render JS source. The basic wrapper for CodeMirror is here: https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/utils/editor/source-editor.js#10 2) CodeMirror has built-in support for Highlighting all occurrences of a selected token called `highlightSelectionMatches`. Luckily it's in the source base already: https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/shared/sourceeditor/codemirror/addon/search/match-highlighter.js#51 You might also search online to understand how to switch on this feature, some random links: * https://discuss.codemirror.net/t/highlightselectionmatches-count/472 * https://codemirror.net/demo/matchhighlighter.html You need to figure out how to plugin and activate the feature. 3) The debugger is utilizing the basic wrapper in this React component `Editor` https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/components/Editor/index.js#99 You might be interested in * setupEditor() method https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/components/Editor/index.js#131 which is calling `getEditor` * getEditor() method https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/utils/editor/index.js#18 which is calling `createEditor` * createEditor() - which is instantiating the SourceEditor() component (the basic wrapper) https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/utils/editor/create-editor.js#15 4) The `Editor` component should handle doubleclick event to perform the highlighting You can look at how `onClick` is implemented https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/components/Editor/index.js#446 To see how to get source location from the mouse click event, etc. This will be needed to know what keyword to highlight. I am not expert on the code base, so you need to spend the time and do good analysis of the code base first :-) HTH Honza
Bug 1619312 Comment 19 Edit History
Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.
Some instructions, note that this feels more like second-good-bug: 1) The debugger is using CodeMirror to render JS source. The basic wrapper for CodeMirror is here: https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/utils/editor/source-editor.js#10 2) CodeMirror has built-in support for Highlighting all occurrences of a selected token called `highlightSelectionMatches`. Luckily it's in the source base already: https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/shared/sourceeditor/codemirror/addon/search/match-highlighter.js#51 You might also search online to understand how to switch on this feature, some random links: * https://discuss.codemirror.net/t/highlightselectionmatches-count/472 * https://codemirror.net/demo/matchhighlighter.html You need to figure out how to plugin and activate the feature. 3) The debugger is utilizing the basic wrapper in this React component `Editor` https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/components/Editor/index.js#99 You might be interested in * setupEditor() method https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/components/Editor/index.js#131 which is calling `getEditor` * getEditor() method https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/utils/editor/index.js#18 which is calling `createEditor` * createEditor() - which is instantiating the SourceEditor() component (the basic wrapper) https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/utils/editor/create-editor.js#15 4) The `Editor` component should handle doubleclick event to perform the highlighting You can look at how `onClick` is implemented https://searchfox.org/mozilla-central/rev/a8773ba2a8f015e0525f219a7e55087b04d30258/devtools/client/debugger/src/components/Editor/index.js#446 To see how to get source location from the mouse click event, etc. This will be needed to know what keyword to highlight. I am not expert on the code base, so you need to spend the time and do good analysis of the code base first :-) HTH Honza