Uncaught TypeError: Cannot read property 'createRange' of null

[dantman]

I get this error at during various user interactions. It's hard to pinpoint the type of or order of events that triggers it.

It's not always createRange, but it's always a range related name.

When these errors happen, nothing in the UI or editable block appears to break. So this seems to be a case of something being triggered when it isn't needed and not validating things before using it. Which probably can be fixed simply by testing before doing things.

((Note that personally that kind of error is a bigger problem. Because I treat uncaught errors as a reason to warn the user of a potential bug and recommend a refresh.))

Uncaught TypeError: Cannot read property 'createRange' of null
  window.AlloyEditor.CKEDITOR.plugins.get.e.getClientRectsRegion @ VM4516:680
  window.AlloyEditor.CKEDITOR.plugins.get.e.getSelectionRegion @ VM4516:680
  window.AlloyEditor.CKEDITOR.plugins.get.e.getSelectionData @ VM4516:680
  (anonymous function) @ VM4516:680
  (anonymous function) @ VM4516:680
  setTimeout (async)
  window.AlloyEditor.CKEDITOR.tools.debounce.CKEDITOR.tools.debounce.r @ VM4516:680
  j @ VM4516:10
  CKEDITOR.event.CKEDITOR.event.fire @ VM4516:12
  CKEDITOR.dom.domObject.a @ VM4516:45

[dantman]

Here's the error from a un-minified version. The error appears to be in SelectionRegion#getClientRectsRegion code. And the null appears to be part of nativeSelection (from selection.getNative()). Which is called by the handleUI code.

Uncaught TypeError: Cannot read property 'createRange' of null
  getClientRectsRegion @ VM5940:1125
  getSelectionRegion @ VM5940:1069
  getSelectionData @ VM5940:1051
  (anonymous function) @ VM5940:1699
  (anonymous function) @ VM5940:739
  setTimeout (async)callFn @ VM5940:738
  j @ VM5940:10
  CKEDITOR.event.CKEDITOR.event.fire @ VM5940:12
  CKEDITOR.dom.domObject.a @ VM5940:45

[dantman]

Ok, thanks to finding the source I discovered the action that triggers this.

If you type some text into the editable area and then quickly (via tab or a mouse click) make the focus exit the editor. Then there's a good chance this error is triggered. Because this is a race condition this could happen unexpectedly during normal user interactions.

Basically the issue is that AlloyEditor debounces the firing of the editorInteraction event (that tracks the selection) with a timer. If the user exits the editable area before that timer fires. Then AlloyEditor attempts to get data about a selection that does not exist.

[ipeychev]

Hey @dantman,

We have other public functions, which rely on the native selection. They shouldn't throw exceptions neither.
I just committed a fix, could you try if that will fix the issue for you?

Thanks,

[dantman]

I think it has.

[ipeychev]

Okay, so let's go with this commit then. I also would like to emphasize that I highly appreciate your contribution, it helped a lot!

Thanks,