Question

I’m using a jQuery plugin called toggleEdit for inline editing.

Everything works fine when the code is actually used in the page.

However, my test suite fails with the following error:

TypeError: Cannot call method 'remove' of undefined

I tracked it down to be triggered from within the clear method of this particular plugin. Its source file can be found here.

There are two relevant bits in that code:

1- The _init function

self.element.addClass("toggleEdit toggleEdit-edit toggleEdit-edit-" +   
self._tag(self.element))
//store reference to preview element
.data("toggleEdit-preview", self.p);

As you can see, when the plugin is first instantiated it uses the data structure on self to store the newly created element.

2- The clear function

self.element.data("toggleEdit-preview").remove();

The clear function then tries to access that structure and retrieve the element. That’s when, while inside a jasmine spec, it fails with the aforementioned exception.

Has anyone seen anything similar?

EDIT:

This is my spec, it’s the simplest piece of code able to reproduce the error:

it("should update the given attribute on the server", function(){
  $('#user-details input, #user-details select').toggleEdit(); //this line triggers the error
});

http://alz.so/static/plugins/toggleedit/jquery.toggleedit.js

Answer 1

Found my problem: old version of the jQuery + jQuery UI duo. Upgrading them resolves the exception.