Closed Bug 1619312 Opened 5 years ago Closed 3 years ago

Highlighting all occurrences of a selected token

Categories

(DevTools :: Debugger, enhancement, P3)

Product:
DevTools
Component:
Debugger
Type:
enhancement

Tracking

(firefox94 fixed)

Status:
RESOLVED FIXED
Milestone:
94 Branch
Tracking Flags:
Tracking Status
firefox94 --- fixed

People

(Reporter: stepan, Assigned: colin.cazabet)

Details

(Keywords: good-first-bug)

Attachments

(2 files, 1 obsolete file)

highlighted_occurrences.png
44.87 KB, image/png
Details
Bug 1619312 - Add match highlighting to codemirror in devtools. r=Honza
48 bytes, text/x-phabricator-request
Details | Review

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.122 Safari/537.36

Steps to reproduce:

VSCode and Chrome have a handy feature when the user selects or double-clicks on a token, it highlights all of its occurrences.

It's useful for a quick search through the file without the need to use the search bar.

Agreed, this is a nice affordance. CodeMirror seems to have a build-in option highlightSelectionMatches that we could use here.

Keywords: good-first-bug
Priority: -- → P3

Hi I am new to bug fixing. Can i work on this?

Great to hear saumyasinghal004, thanks for offering to help.

Jason, can you get saumyasinghal004 started?

Flags: needinfo?(jlaster)

saumyasinghal004, I am assigning to you for now. https://searchfox.org/mozilla-central/source/devtools/client/shared/sourceeditor/editor.js is the shared library that most panels use for codemirror; which also means you want to test your changes in all places that display code.

Assignee: nobody → saumyasinghal004
Status: UNCONFIRMED → ASSIGNED
Ever confirmed: true

Thank you for assigning this to me. I am about to start working on this, I'll ask here if I get stuck on anything.

Hi saumyasinghal, are you still interested in fixing this bug?
Is there anything we could help you with?
Please don't hesitate to ask questions.

Honza

Flags: needinfo?(saumyasinghal004)

This good-first-bug hasn't had any activity for 2 months, it is automatically unassigned.
For more information, please visit auto_nag documentation.

Assignee: saumyasinghal004 → nobody
Status: ASSIGNED → NEW

Hello,

Can I ask what is the status on this bug? I'm new to the Mozilla Firefox work flow and looking around to learn more, and I'm down to tackle this bug.

Phu

Hi,
the bug is still open and patch is welcome.

Let me know if you are interested in this and I can assign it to you.

Honza

Flags: needinfo?(saumyasinghal004)
Flags: needinfo?(phu.thai888)
Flags: needinfo?(jlaster)

Yes,

I am interested in fixing this bug. Also, just a quick question, I set up my environment in VSCode. For some reason, when I looked at the source code of Firefox, I kept getting includePath error (the red squiggly line under the header file). I edited my includePath to pointed to the src folder including any subdirectories, and it still give me errors.

thank you

Flags: needinfo?(phu.thai888) → needinfo?(odvarko)

(In reply to phu.thai888 from comment #10)

Yes,

Assigned to you, thank you.

I am interested in fixing this bug. Also, just a quick question, I set up my environment in VSCode. For some reason, when I looked at the source code of Firefox, I kept getting includePath error (the red squiggly line under the header file). I edited my includePath to pointed to the src folder including any subdirectories, and it still give me errors.

I don't know what the problem could be, but you might ask here:
https://chat.mozilla.org/#/group/+devtools-team:mozilla.org

Honza

Assignee: nobody → phu.thai888
Status: NEW → ASSIGNED
Flags: needinfo?(odvarko)
Severity: normal → S3

Hi Honza,

When I tried to build the firefox to setup my development environment, I encounter lld-link:error during ./mach build. I have asked in the build chat and the introduction chat section. It seems like no one encountered the same problem as I did. At this point, I don't know how to get past that to get everything setup.

Phu

Flags: needinfo?(odvarko)

Sorry, I don't know what the problem could be. You should keep searching for the error (e.g. https://stackoverflow.com/questions/59043551/lld-link-error-no-input-files-when-trying-to-link-with-libcmt-lib-on-windows10) and asking on the chat (perhaps in different room)...

Honza

Flags: needinfo?(odvarko)

Hi Honza,

So I've been asking around (including in Stack Overflow), but I did not have any luck. The only option left I can think of is to debug the error for myself. However, the problem is I'm not sure where to start with such a big program. If there are any tips for me on how to debug, it would be greatly appreciated.

thank you,

Phu

Flags: needinfo?(odvarko)

Here is the official Firefox contributors’ quick reference:
https://firefox-source-docs.mozilla.org/contributing/contribution_quickref.html

Please follow the instructions there.
You might also want to start fresh if possible (clean up your machine before).
Not sure what's your OS, but you might also try to setup your dev environment in a virtual machine.

Honza

Flags: needinfo?(odvarko)

Hi Honza,

I will try to set up my environment on my other machine to see if it still give me the error. The machine that I currently want to work on is quite old, and I think that could be the problem.

thank you,

Phu Dang

Flags: needinfo?(odvarko)

Sound good, thank you for the update.

Flags: needinfo?(odvarko)

(In reply to Jan Honza Odvarko [:Honza] (always need-info? me) from comment #17)

Sound good, thank you for the update.

Hello Honza,

Finally! My apology for the late update. I've been busy with my other work. I finally got the source code to build on my system. Now, would you please clarify to me where should I start? I know that I'm suppose to make it so that when user double-clicked on a variable, it will search/highlight where they have occurred in the file. Is that correct?

thank you,

Phu Dang

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:

You need to figure out how to plugin and activate the feature.

  1. 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

which is calling createEditor

  1. 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

This good-first-bug hasn't had any activity for 2 months, it is automatically unassigned.
For more information, please visit auto_nag documentation.

Assignee: phu.thai888 → nobody
Status: ASSIGNED → NEW

Hello,

I am interested in fixing this bug (I think it's a good first bug to start contributing).
Could you please assign it to me if nobody is working on it ?

Thank you,
Sincerely,
Colin

Hi Colin,
Sure i have assigned to you.
Please note https://bugzilla.mozilla.org/show_bug.cgi?id=1619312#c19. Honza hints that this might be more of a second-ish bug.
So feel free to find another good-first-bug if this gets too difficult.

Thanks

Assignee: nobody → colin.cazabet

(In reply to Hubert Boma Manilla (:bomsy) from comment #22)

Hi Colin,
Sure i have assigned to you.
Please note https://bugzilla.mozilla.org/show_bug.cgi?id=1619312#c19. Honza hints that this might be more of a second-ish bug.
So feel free to find another good-first-bug if this gets too difficult.

Thanks

Hi Hubert,

Thank you for your response, I will dive in the code and I will keep you updated in this thread.

Sincerely,
Colin

(In reply to Hubert Boma Manilla (:bomsy) from comment #22)

Hello Hubert,

I think I have fixed the bug, I have put Jan Honza Odvarko as the reviewer but got no response, do you know who I could ask to review my diff ?
Or maybe I should wait more ?

Thank you,
Colin

(In reply to colin.cazabet from comment #25)

(In reply to Hubert Boma Manilla (:bomsy) from comment #22)

Hello Hubert,

I think I have fixed the bug, I have put Jan Honza Odvarko as the reviewer but got no response, do you know who I could ask to review my diff ?
Or maybe I should wait more ?

Thank you,
Colin

Hello Colin,
Ok thanks for the work! We have a small team ATM, and things are a bit busy, so there might be some delays to review. I see the patch also has :nchevobbe for review as well so should be ok. I can also take a look too as well when get a chance.

Thanks for your patience.

Thank you Colin for working on this!
(comments posted to Phab)

Depends on D124130

Attachment #9240091 - Attachment is obsolete: true
Pushed by nchevobbe@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/f75e9e3f382b Add match highlighting to codemirror in devtools. r=nchevobbe

https://hg.mozilla.org/mozilla-central/rev/f75e9e3f382b

Status: NEW → RESOLVED
Closed: 3 years ago
status-firefox94: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → 94 Branch
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: