Error "Cannot read property 'is' of null" thrown in Real-time Collaboration demo

[mlewand]

📝 Provide a description of requested docs changes

1. Open https://ckeditor.com/docs/ckeditor5/latest/features/collaboration/real-time-collaboration/real-time-collaboration.html (or permalink)
2. Wait till editor is initialized.
3. Inspect javascript console.

✔️ Expected result

No exceptions are logged.

❌ Actual result

watchdog.js:383 Uncaught TypeError: Cannot read property 'is' of null
    at h._shouldReactToError (watchdog.js:383)
    at h._handleError (watchdog.js:352)
    at _boundErrorHandler (watchdog.js:99)

is thrown

📃 Other details

Error occurs randomly. Since it does, I'll put some details below:

Exception details available here

Uncaught TypeError: Cannot read property 'is' of null
    at h._shouldReactToError (watchdog.js:383)
    at h._handleError (watchdog.js:352)
    at _boundErrorHandler (watchdog.js:99)
_shouldReactToError @ watchdog.js:383
_handleError @ watchdog.js:352
_boundErrorHandler @ watchdog.js:99
error (async)
(anonymous) @ watchdog.js:250
Promise.then (async)
create @ watchdog.js:247
(anonymous) @ collaboration.js:122
XMLHttpRequest.send (async)
(anonymous) @ xhr.js:160
t.exports @ xhr.js:11
t.exports @ dispatchRequest.js:57
Promise.then (async)
a.request @ Axios.js:51
a.<computed> @ Axios.js:61
(anonymous) @ bind.js:9
o @ randomuser.js:5
(anonymous) @ collaboration.js:118

• Browser: Any
• CKEditor version: 15.0.0

[ma2ciek]

It's caused by the emoji sdk:

ErrorEvent {isTrusted: true, message: "Script error.", filename: "", lineno: 0, colno: 0, …}bubbles: falsecancelBubble: falsecancelable: truecolno: 0composed: falsecurrentTarget: Window {parent: Window, postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, …}defaultPrevented: falseerror: nulleventPhase: 0filename: ""isTrusted: truelineno: 0message: "Script error."path: [Window]returnValue: truesrcElement: Window {parent: Window, postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, …}target: Window {parent: Window, postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, …}timeStamp: 31120.74499996379type: "error"__proto__: ErrorEvent

sdk.js:1 Uncaught TypeError: Cannot read property 'contentWindow' of null
    at D (sdk.js:1)
    at f (sdk.js:1)
D @ sdk.js:1
f @ sdk.js:1

The most important part is that the error event has the error:null part, which causes the latter issue.

[mlewand]

Looks like you have already a good understanding of that, why does it throw randomly? 🤔

[ma2ciek]

It looks like something like the throw null was thrown somewhere, probably typing setTimeout( () => { throw null } ) into the console should be enough to reproduce the issue. So, similarly to the rejections, everything you type after the throw statement is available in the eventError.error later. So the things other than errors (especially the null) should be ignored here to fix the issue.

// _boundErrorHandler
if ( evt.reason ) {
	// Note that evt.reason might be everything that is in the promise rejection.
	if ( evt.reason instanceof Error ) {
		this._handleError( evt.reason, evt );
	}
} else {
	// <- The condition is missing here and everything can be treated as the error.
	this._handleError( evt.error, evt );
}