autosize icon indicating copy to clipboard operation
autosize copied to clipboard

React new Event conflict

Open apuntovanini opened this issue 9 years ago • 2 comments

When initializing autosize inside a React component the new Event call conflicts with React internal event system. In this case the old-fashioned way of creating an event works properly

createEvent = function (name) {
  var evt = document.createEvent('Event');
  evt.initEvent(name, true, false);
  return evt;
};

I think we should add an option when initializing autosize to fallback to document.createEvent instead on new Event. What do you think?

apuntovanini avatar Feb 25 '16 12:02 apuntovanini

Switching to new Event was in response to #280. Using document.createEvent will work fine in practice, but I want to stick with the new standard if possible. Can you tell me more about the conflict you are experiencing?

jackmoore avatar Feb 25 '16 17:02 jackmoore

Sure! I initialize autosize inside a componentDidMount react function. Autosize triggers this error: Uncaught InvalidStateError: Failed to execute 'dispatchEvent' on 'EventTarget': The event provided is null.

on line 153

var evt = createEvent('autosize:resized');
ta.dispatchEvent(evt);

Probably the new Event(name) triggers some React stuff, but I cannot figure it out. If I create a new Event directly inside React component I get this:

var evt = new Event('foo');
console.log(evt)
evt: Constructor {props: "foo", context: undefined, state: null}

apuntovanini avatar Feb 28 '16 16:02 apuntovanini