Closed Bug 913440 Opened 6 years ago Closed 6 years ago

Implement a pseudo class to highlight element easily

Categories

(DevTools :: Inspector, defect)

x86
All
defect
Not set

Tracking

(Not tracked)

RESOLVED FIXED
Firefox 26

People

(Reporter: paul, Assigned: paul)

References

Details

Attachments

(1 file)

In Firefox Desktop, in the developer tools, to highlight an element, we add a <xul:box> on top of the browser and draw another <xul:box> in it.

For Firefox Android and Firefox OS, we also want to be able to highlight a node. But drawing a window on top of the content window is not easy (syncing highlighter position when the user scroll or pan is hard).

A very easy way to work around that is to use CSS to style the highlighted element. For exemple: "outline:3px solid red". It would be really useful if we could have a dedicated pseudo class. It will be up to the devtools code to add and remove the pseudo class to the highlighted elements, via nsIDOMUtils.addPseudoClassLock().
Attached patch patch.diffSplinter Review
Assignee: nobody → paul
Status: NEW → ASSIGNED
Attachment #800752 - Flags: review?(bzbarsky)
Blocks: 912915
Comment on attachment 800752 [details] [diff] [review]
patch.diff

r=me
Attachment #800752 - Flags: review?(bzbarsky) → review+
https://hg.mozilla.org/mozilla-central/rev/e2bf999b8857
Status: ASSIGNED → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 26
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.