Question

I have in-place editing set up for a network model. There are two input fields, for the title and the description of the model. When the user clicks on the title, it switches out the <h2> tags for an <input>, much as in the canonical Todos example.

I am adding events to the relevant template like this:

Template.network_edit.events = {}

Template.network_edit.events['click #network-description'] = -> 
    Session.set('editing_network_description',true)
    Meteor.flush()
    focus_field_by_id('network-description-input')

Template.network_edit.events['click #network-title'] = -> 
    Session.set('editing_network_title',true)
    Meteor.flush()
    focus_field_by_id('network-title-input')

The focus_field_by_id function is,

  var focus_field_by_id = function (id) {
  var input = document.getElementById(id);
  if (input) {
    input.focus();
    input.select();
  }
};

Everything works as expected, but when I click on the #network-description, I see an error in the console:

Uncaught TypeError: Cannot read property 'parentNode' of null

Thrown at line 600 of liveui.js. When I click on #network-title, I receive no such error.

If I reverse the order of the events, putting the #network-title event first, and the network-description second, I receive the error when I click on the #network-title instead. In general, the first event added throws this error, but not subsequent events.

As I said, everything appears works properly (the inputs appear, gain focus, etc.), but the error is disconcerting and I may be missing something.

Answer 1

Aha, I was able to reproduce this.

This is a bug that occurs when the DOM is mutated during event handling. After the call to Meteor.flush(), the original target of the event is no longer in the template. Meteor’s event processing code chokes, probably while checking to see if the second handler applies, hence why the first one seems to break. The error is harmless, and you aren’t doing anything wrong.

Event handling is being rewritten for the next release, and I have a regression test in place for this case that the new code already passes.

Thanks for the report and for your patience.