Looking for an addon to automatically select all instances of selected word in the current page

Question

I am looking for an addon to install so that when you select a word in a webpage ( by clicking) it automatically highlights all the instances of that selected words in that text. There used to be this highlightall addon but it no longer works for recent version of Firefox! It was ver handy as all you had to do is to select that word and all instances get highlighted

Such an addon would be very helpful when reading a code as you can simply select a variable name and it would select everywhere that variable has been used in the code so you could understand the program better.

Answer 1

Ok man I made the addon and released it at AMO. I called HiliteOnSelection I linkified it.

Use it tell me how it works tell me how you would like to change it etc. I appreciate feedback.

More than 50 bounty would have been nice too, a side effect was I learned a lot so it's cool.

Answer 2

If you press ctrl+f and then click highlight all it will do it.

If you want to copy it heres the code for highlihgt all:

function toggleHighlight(aHighlight) {

          if (!this._dispatchFindEvent("highlightallchange"))
            return;

          let word = this._findField.value;
          // Bug 429723. Don't attempt to highlight ""
          if (aHighlight && !word)
            return;

          this.browser._lastSearchHighlight = aHighlight;
          this.browser.finder.highlight(aHighlight, word);

}

here it is on mxr

if you need more help let me know

Answer 3

Well, my code is quite complex because it performs several advanced services, but if you're asking how to highlight a word of text, the easiest way is to add a style attribute around the word. For example:

This hot dog needs more mustard.

... would become...

This hot <span style="color:#FFFF60">dog</span> needs more mustard.

The above would highlight "dog" in the sentence. The above assumes white text on black background, where yellow is a good highlight color. If the text is black on white background, that #FFFF60 should probably be something like #40FFC0 or #40FF40 or #4040FF or whatever you find looks good.

When you want to remove the highlight, you can delete the <span> element. In my case I usually put the style="color:#FFFF60" in some other existing element, so I don't delete the element to remove the highlight, I delete the style attribute I added to the element.

By the way, the reason I change text color to highlight terms is because that does not change the size of the word, and therefore the text never reflows (and screws up formatting). You could probably change background color to highlight, but I never tried that.

To find all instances of a certain word, I don't know, but probably the TreeWalker is part of the solution.

Answer 4

Ok C Graphics man here's the code

Ok its real easy you don't even have to write another function. Here's the code to highlight any word in the current tab.

gBrowser.selectedTab.linkedBrowser.finder.highlight(true, 'YOUR_WORD_HERE')

if you want to unighlight then set the first argument to false.

You can do this in any tab just have to supply the browser element within the tab.

like this code here will highlight everything in the first tab:

gBrowser.tabContainer.childNodes[0].linkedBrowser.finder.highlight(true, 'YOUR_WORD_HERE');