Question

I know very little about JavaScript but despite this I’m trying to cobble something together on my wordpress blog. It’s not working, and I don’t know how to resolve it, and hey, that’s what StackOverflow is for, right?

Firstly, the error message is:

Error: element.dispatchEvent is not a function Source File: http://.../wp-includes/js/prototype.js?ver=1.6 Line: 3936 

It happens on page load. My page load handler is registered thusly:

Event.observe(window, 'load', show_dates_as_local_time); 

The error goes away if I disable some other plugins, and this (plus googling) led me to conclude that it was a conflict between prototype and jQuery (which is used by some of the other plugins).

Secondly I’m following the wordpress recommended practice of using wp_enqeue_script to add a dependency from my JavaScript to the Prototype library, as follows:

add_action( 'wp_print_scripts', 'depo_theme_add_javascript' );  function depo_theme_add_javascript() {     wp_enqueue_script('friendly_dates', 'javascript/friendly_dates.js', array('prototype')); } 

Now I’m also aware that there are some potential conflicts between jQuery and Prototype which are resolved using the jQuery noConflicts method. I’ve tried calling that from various places but no good. I don’t think this is the problem because a) the noConflict function relates solely to the $ variable, which doesn’t seem to be the problem here, and b) I would expect wordpress to sort it out for me because it can…

Lastly, using the Venkman debugger I’ve determined that the element referenced in the error message is indeed an HTMLDocument but also does lack a dispatchEvent. Not sure how this could happen, given it’s a standard DOM method?

Answer 1

Thanks for the suggestions all. In the end I think Kent’s explanation was the closest, which basically amounted to ‘Prototype is broken’. (Sorry if I’m summarizing you incorrectly 🙂

As for the jQuery.noConflict option – I already mentioned this in the question. It makes a difference when you run this method, and I have very little control over that. As I said, I have tried running it in a couple of different places (specifically the page header and also from my script file), to no effect. So, much as we’d all like it to be, ‘just use noConflict‘ is not an answer to this question, at least not without additional information.

Besides, jQuery.noConflict seems to be about the $ variable, and the code around the error point does not deal with that variable at all. Of course they could be related indirectly, I haven’t tracked it down.

So basically I ended up rewriting the script using jQuery instead of Prototype, which actually had its own problems. Anyway I’ve published the whole war story on my blog, should you be interested.