Accessing the DOM Element from a context menu callback

5,295 views
Skip to first unread message

Craig Kelley

unread,
Nov 5, 2010, 1:22:04 PM11/5/10
to Chromium-extensions
According to http://code.google.com/chrome/extensions/beta/contextMenus.html,
the onclick handler returns this info object:

menuItemId ( integer )
parentMenuItemId ( optional integer )
mediaType ( optional string )
linkUrl ( optional string )
srcUrl ( optional string )
pageUrl ( string )
frameUrl ( optional string )
selectionText ( optional string )
editable ( string )

Is there no way to get the actual element that was clicked on? I have
a context menu that works great for images, but I'd like to have
access to the specific image that was clicked on. I could iterate
over the document to find srcUrls that match, but that could be more
than one image.

Any ideas?

-Craig

Craig Kelley

unread,
Nov 5, 2010, 2:09:33 PM11/5/10
to Chromium-extensions
Nevermind; I found the bug that this pertains to:

http://code.google.com/p/chromium/issues/detail?id=39507

Please star it up! :-)

On Nov 5, 11:22 am, Craig Kelley <namo...@gmail.com> wrote:
> According tohttp://code.google.com/chrome/extensions/beta/contextMenus.html,

Arne Roomann-Kurrik

unread,
Nov 5, 2010, 6:36:49 PM11/5/10
to Craig Kelley, Chromium-extensions
I agree with the need to update the API, but thought up of a workaround in the meantime - you can inject a content script in the page that keeps a reference to the dom target of any mouse clicks and use message passing to get that value from your context menu handler.  Not very elegant, but might be useful in the meantime.

Here's a codelab I wrote for a slightly different use case: http://kurrik.github.com/hackathons/09-25-2010/font-selector-chrome-extension.html - you could probably get away with doing things a bit more transparently, though (don't require the browser action click to start selecting items, listen to mousedown instead of mousemove, don't style the current dom element, etc).

~Arne


--
You received this message because you are subscribed to the Google Groups "Chromium-extensions" group.
To post to this group, send email to chromium-...@chromium.org.
To unsubscribe from this group, send email to chromium-extens...@chromium.org.
For more options, visit this group at http://groups.google.com/a/chromium.org/group/chromium-extensions/?hl=en.


Afuna Matata

unread,
Nov 6, 2010, 12:06:49 AM11/6/10
to kur...@chromium.org, Craig Kelley, Chromium-extensions
I'd love to have that added to the API, and have starred accordingly.

In the meantime, I've used this workaround in my own extension (which handles links not images, but same deal):

use document.addEventListener( "contextmenu", function... ) from a content script. If event.target is an image, then extract the attributes you need and pass it as a message to your extension.


You could also add the event listener on the images instead of the document, but that won't work if the image you clicked on was created dynamically.

Arne Roomann-Kurrik

unread,
Nov 8, 2010, 5:23:12 PM11/8/10
to Afuna Matata, Craig Kelley, Chromium-extensions
Right on, I forgot about the contextmenu event.  That might be a good workaround for getting a handle to any clicked on dom element, not just images.

~Arne

Craig Kelley

unread,
Nov 8, 2010, 5:42:37 PM11/8/10
to Chromium-extensions
This is what I ended up doing. Luckily, I'm only interested in IMG
element, and that is one of the options for extensions. I then use
messages to communicate between tabs and the background. It's working
so far...

On Nov 8, 3:23 pm, Arne Roomann-Kurrik <kur...@chromium.org> wrote:
> Right on, I forgot about the contextmenu event.  That might be a good
> workaround for getting a handle to any clicked on dom element, not just
> images.
>
> ~Arne
>
>
>
>
>
>
>
> On Fri, Nov 5, 2010 at 9:06 PM, Afuna Matata <afunamat...@gmail.com> wrote:
> > I'd love to have that added to the API, and have starred accordingly.
>
> > In the meantime, I've used this workaround in my own extension (which
> > handles links not images, but same deal):
>
> > use document.addEventListener( "contextmenu", function... ) from a content
> > script. If event.target is an image, then extract the attributes you need
> > and pass it as a message to your extension.
>
> > You could also add the event listener on the images instead of the
> > document, but that won't work if the image you clicked on was created
> > dynamically.
>
> > On Sat, Nov 6, 2010 at 6:36 AM, Arne Roomann-Kurrik <kur...@chromium.org>wrote:
>
> >> I agree with the need to update the API, but thought up of a workaround in
> >> the meantime - you can inject a content script in the page that keeps a
> >> reference to the dom target of any mouse clicks and use message passing to
> >> get that value from your context menu handler.  Not very elegant, but might
> >> be useful in the meantime.
>
> >> Here's a codelab I wrote for a slightly different use case:
> >>http://kurrik.github.com/hackathons/09-25-2010/font-selector-chrome-e...you could probably get away with doing things a bit more transparently,
> >> though (don't require the browser action click to start selecting items,
> >> listen to mousedown instead of mousemove, don't style the current dom
> >> element, etc).
>
> >> ~Arne
>
Reply all
Reply to author
Forward
0 new messages