Skip to main content

Bug Tracker

Side navigation

#11125 closed bug (invalid)

Opened January 03, 2012 04:06AM UTC

Closed January 04, 2012 10:45AM UTC

Last modified March 14, 2012 09:41AM UTC

jQuery.event.trigger throws exception when custom event name is same as DOM object property

Reported by: sigmaxis Owned by: sigmaxis
Priority: low Milestone: None
Component: event Version: 1.7.1
Keywords: Cc:
Blocked by: Blocking:
Description

I have code that fires/listens to a custom event named "action" on a normal DOM form object. Prior to jQuery 1.7 this causes no issues. In jQuery 1.7+, triggering the "action" custom event on the form object results in the following exception:

elem[type] is not a function

This is in jQuery-1.7.1.js line 3175.

http://jsfiddle.net/fzbFf/

My understanding is that jQuery tries to run the native behaviour method (default handler) on the form object, assuming that the event name is going to refer to a method. In this case, however, the "action" event name ends up referring to the form's string "action" URL attribute.

The same error happens if I trigger a custom event named "length" on the form object. (Minor note: if the "length" value of the form is zero, as in the jsFiddle above, this may not reproduce, but it does in my real use case, when the "length" value is 4 - or any truthy value)

I can just switch to using a different custom event name as temporary workaround, but this seems like something that should be fixed.

NOTE: there is a bug (http://bugs.jquery.com/ticket/10574) that describes exactly the same line of code and the same resulting exception, but it was marked invalid because the submitter worked in an esoteric context. However, in this case I am using normal DOM object with a fairly normal custom event use case.

Thanks guys!

Attachments (0)
Change History (9)

Changed January 03, 2012 04:38AM UTC by rwaldron comment:1

_comment0: How is this a bug? 1325566036074873
owner: → sigmaxis
status: newpending

How is this a bug?

http://jsfiddle.net/fzbFf/2/

Changed January 04, 2012 12:59AM UTC by sigmaxis comment:2

status: pendingnew

Are you referring to the fact that the inline Firebug frame shows no exception in your jsFiddle?

Here is a screenshot of the exception in my native Firebug: http://imgur.com/Fue0P

In general, assuming that this is reproducible, would this constitute a bug? I expected to use that name for custom events with impunity, since HTML does not define an event named "action"...

Changed January 04, 2012 01:03AM UTC by dmethvin comment:3

status: newpending

Do you need the event to bubble? If not you should be using .triggerHandler() anyway as the docs mention. Also, it's not a good idea to use generic terms for custom event names. Many of the MVC frameworks use a convention of an embedded colon for their custom event names, which won't conflict with present or future browser-defined events.

Changed January 04, 2012 03:44AM UTC by sigmaxis comment:4

status: pendingnew

Thank you for the workaround suggestions.

That aside, it simply seems to be incorrect behaviour to invoke a property on a DOM object without first checking whether it is callable or not.

Back to workarounds: I need the event to bubble, so I'll look into embedding a colon into the event name for better namespacing and keep using .trigger().

I really hope this bug remains open, at least in low/very-low priority. This issue will not come up for most developers out there, but it is still a clear case of unchecked property invocation.

Thanks!

Changed January 04, 2012 03:47AM UTC by sigmaxis comment:5

Sorry, forgot to mention:

Another course of action could be to add an extra note to .trigger() (et al) documentation that the event name will be used to invoke a DOM object property. Then at least this kind of error will not be a surprise.

Changed January 04, 2012 03:51AM UTC by dmethvin comment:6

status: newpending

What would you suggest we add to the current documentation? There is already a note (well technically two) on the current page.

Changed January 04, 2012 03:58AM UTC by rwaldron comment:7

An easier course would be to simply not use strings that are known DOM Node properties or element attributes . No one files a bug against JavaScript for not allowing the arbitrary use of break, do, instanceof, typeof, case, else, new, var, catch, finally, return, void, continue, for, switch, while, debugger, function, this, with, default, if, throw, delete, in or try - that would be absurd right? Because you can just use a different word. The policy should be extended to host objects as well.

Changed January 04, 2012 04:52AM UTC by sigmaxis comment:8

status: pendingnew

Fair enough, I just saw that note in the documentation. I had no idea that the custom event name is directly used to invoke a DOM object property.

That's why it did not occur to me to be cautious with overly-generic naming. You can see how to my ignorant self it did not seem absurd to use a normal noun that I knew to be not a *native DOM event* name, or even a known DOM method name.

But of course, knowing that .trigger() invokes any object property directly by design, I will be more cautious and use a prefix with colon.

Thanks!

Changed January 04, 2012 10:45AM UTC by addyosmani comment:9

component: unfiledevent
priority: undecidedlow
resolution: → invalid
status: newclosed

It looks like we can close this given that we already cover it adequately in our docs. @dmethvin, please feel free to add a needsdocs if you think we should be expanding on what we have any further :)