8
0

editorwatchdog.js 33 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112
  1. /**
  2. * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. /* globals setTimeout, window, console, document */
  6. import EditorWatchdog from '../src/editorwatchdog';
  7. import Editor from '@ckeditor/ckeditor5-core/src/editor/editor';
  8. import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
  9. import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
  10. import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
  11. import { assertCKEditorError } from '@ckeditor/ckeditor5-utils/tests/_utils/utils';
  12. import HtmlDataProcessor from '@ckeditor/ckeditor5-engine/src/dataprocessor/htmldataprocessor';
  13. describe( 'EditorWatchdog', () => {
  14. let element;
  15. beforeEach( () => {
  16. element = document.createElement( 'div' );
  17. document.body.appendChild( element );
  18. } );
  19. afterEach( () => {
  20. element.remove();
  21. sinon.restore();
  22. } );
  23. describe( 'create()', () => {
  24. it( 'should create an editor instance', async () => {
  25. const watchdog = new EditorWatchdog();
  26. const editorCreateSpy = sinon.spy( ClassicTestEditor, 'create' );
  27. const editorDestroySpy = sinon.spy( ClassicTestEditor.prototype, 'destroy' );
  28. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  29. await watchdog.create( element, {} );
  30. sinon.assert.calledOnce( editorCreateSpy );
  31. sinon.assert.notCalled( editorDestroySpy );
  32. await watchdog.destroy();
  33. sinon.assert.calledOnce( editorCreateSpy );
  34. sinon.assert.calledOnce( editorDestroySpy );
  35. } );
  36. it( 'should throw an error when the creator is not defined', async () => {
  37. const watchdog = new EditorWatchdog();
  38. try {
  39. await watchdog.create();
  40. } catch ( err ) {
  41. assertCKEditorError( err, /^watchdog-creator-not-defined/, null );
  42. }
  43. } );
  44. it( 'should properly copy the config', async () => {
  45. const watchdog = new EditorWatchdog();
  46. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  47. const config = {
  48. foo: [],
  49. bar: document.createElement( 'div' )
  50. };
  51. await watchdog.create( element, config );
  52. expect( watchdog.editor.config._config.foo ).to.not.equal( config.foo );
  53. expect( watchdog.editor.config._config.bar ).to.equal( config.bar );
  54. await watchdog.destroy();
  55. } );
  56. it( 'should support editor data passed as the first argument', async () => {
  57. const watchdog = new EditorWatchdog();
  58. watchdog.setCreator( ( data, config ) => ClassicTestEditor.create( data, config ) );
  59. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  60. const originalErrorHandler = window.onerror;
  61. const windowErrorSpy = sinon.spy();
  62. window.onerror = windowErrorSpy;
  63. await watchdog.create( '<p>foo</p>', { plugins: [ Paragraph ] } );
  64. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  65. await new Promise( res => {
  66. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  67. watchdog.on( 'restart', () => {
  68. window.onerror = originalErrorHandler;
  69. res();
  70. } );
  71. } );
  72. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  73. await watchdog.destroy();
  74. } );
  75. } );
  76. describe( 'editor', () => {
  77. it( 'should be the current editor instance', () => {
  78. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  79. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  80. const originalErrorHandler = window.onerror;
  81. const windowErrorSpy = sinon.spy();
  82. window.onerror = windowErrorSpy;
  83. expect( watchdog.editor ).to.be.null;
  84. let oldEditor;
  85. return watchdog.create( element, {} )
  86. .then( () => {
  87. oldEditor = watchdog.editor;
  88. expect( watchdog.editor ).to.be.instanceOf( ClassicTestEditor );
  89. return new Promise( res => {
  90. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  91. watchdog.on( 'restart', () => {
  92. window.onerror = originalErrorHandler;
  93. res();
  94. } );
  95. } );
  96. } )
  97. .then( () => {
  98. expect( watchdog.editor ).to.be.instanceOf( ClassicTestEditor );
  99. expect( watchdog.editor ).to.not.equal( oldEditor );
  100. return watchdog.destroy();
  101. } )
  102. .then( () => {
  103. expect( watchdog.editor ).to.be.null;
  104. } );
  105. } );
  106. } );
  107. describe( 'error handling', () => {
  108. it( 'Watchdog should not restart editor during the initialization', () => {
  109. const watchdog = new EditorWatchdog();
  110. let editor;
  111. watchdog.setCreator( async el => {
  112. editor = await ClassicTestEditor.create( el );
  113. await Promise.reject( new Error( 'foo' ) );
  114. } );
  115. return watchdog.create( element ).then(
  116. () => { throw new Error( '`watchdog.create()` should throw an error.' ); },
  117. err => {
  118. expect( err ).to.be.instanceOf( Error );
  119. expect( err.message ).to.equal( 'foo' );
  120. return editor.destroy();
  121. }
  122. );
  123. } );
  124. it( 'Watchdog should not restart editor during the destroy', async () => {
  125. const watchdog = new EditorWatchdog();
  126. watchdog.setCreator( el => ClassicTestEditor.create( el ) );
  127. watchdog.setDestructor( () => Promise.reject( new Error( 'foo' ) ) );
  128. await watchdog.create( element );
  129. let caughtError = false;
  130. const editor = watchdog.editor;
  131. try {
  132. await watchdog.destroy();
  133. } catch ( err ) {
  134. caughtError = true;
  135. expect( err ).to.be.instanceOf( Error );
  136. expect( err.message ).to.equal( 'foo' );
  137. await editor.destroy();
  138. }
  139. if ( !caughtError ) {
  140. throw new Error( '`watchdog.create()` should throw an error.' );
  141. }
  142. } );
  143. it( 'Watchdog should not hide intercepted errors', () => {
  144. const watchdog = new EditorWatchdog();
  145. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  146. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  147. const originalErrorHandler = window.onerror;
  148. const windowErrorSpy = sinon.spy();
  149. window.onerror = windowErrorSpy;
  150. return watchdog.create( element ).then( () => {
  151. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  152. return new Promise( res => {
  153. watchdog.on( 'restart', () => {
  154. window.onerror = originalErrorHandler;
  155. sinon.assert.calledOnce( windowErrorSpy );
  156. // Various browsers will display the error slightly differently.
  157. expect( windowErrorSpy.getCall( 0 ).args[ 0 ] ).to.match( /foo/ );
  158. watchdog.destroy().then( res );
  159. } );
  160. } );
  161. } );
  162. } );
  163. it( 'Watchdog should intercept editor errors and restart the editor during the runtime', () => {
  164. const watchdog = new EditorWatchdog();
  165. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  166. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  167. const originalErrorHandler = window.onerror;
  168. window.onerror = undefined;
  169. return watchdog.create( element ).then( () => {
  170. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  171. return new Promise( res => {
  172. watchdog.on( 'restart', () => {
  173. window.onerror = originalErrorHandler;
  174. watchdog.destroy().then( res );
  175. } );
  176. } );
  177. } );
  178. } );
  179. it( 'Watchdog should not intercept non-editor errors', () => {
  180. const watchdog = new EditorWatchdog();
  181. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  182. const editorErrorSpy = sinon.spy();
  183. watchdog.on( 'error', editorErrorSpy );
  184. const watchdogErrorHandlerSpy = sinon.spy( watchdog, '_handleError' );
  185. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  186. const originalErrorHandler = window.onerror;
  187. window.onerror = undefined;
  188. return watchdog.create( element ).then( () => {
  189. const error = new Error( 'foo' );
  190. setTimeout( () => {
  191. throw error;
  192. } );
  193. setTimeout( () => {
  194. throw 'bar';
  195. } );
  196. setTimeout( () => {
  197. throw null;
  198. } );
  199. return new Promise( res => {
  200. setTimeout( () => {
  201. window.onerror = originalErrorHandler;
  202. sinon.assert.notCalled( editorErrorSpy );
  203. // Assert that only instances of the `Error` class will be checked deeper.
  204. sinon.assert.calledOnce( watchdogErrorHandlerSpy );
  205. expect( watchdogErrorHandlerSpy.getCall( 0 ).args[ 0 ] ).to.equal( error );
  206. watchdog.destroy().then( res );
  207. } );
  208. } );
  209. } );
  210. } );
  211. it( 'Watchdog should not intercept other editor errors', () => {
  212. const watchdog1 = EditorWatchdog.for( ClassicTestEditor );
  213. const watchdog2 = EditorWatchdog.for( ClassicTestEditor );
  214. const config = {
  215. plugins: []
  216. };
  217. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  218. const originalErrorHandler = window.onerror;
  219. window.onerror = undefined;
  220. return Promise.all( [
  221. watchdog1.create( element, config ),
  222. watchdog2.create( element, config )
  223. ] ).then( () => {
  224. return new Promise( res => {
  225. const watchdog1ErrorSpy = sinon.spy();
  226. const watchdog2ErrorSpy = sinon.spy();
  227. watchdog1.on( 'restart', watchdog1ErrorSpy );
  228. watchdog2.on( 'restart', watchdog2ErrorSpy );
  229. setTimeout( () => throwCKEditorError( 'foo', watchdog2.editor ) );
  230. setTimeout( () => {
  231. window.onerror = originalErrorHandler;
  232. sinon.assert.notCalled( watchdog1ErrorSpy );
  233. sinon.assert.calledOnce( watchdog2ErrorSpy );
  234. Promise.all( [ watchdog1.destroy(), watchdog2.destroy() ] )
  235. .then( res );
  236. } );
  237. } );
  238. } );
  239. } );
  240. it( 'Watchdog should intercept editor errors and restart the editor if the editor can be found from the context', () => {
  241. const watchdog = new EditorWatchdog();
  242. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  243. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  244. const originalErrorHandler = window.onerror;
  245. window.onerror = undefined;
  246. return watchdog.create( element ).then( () => {
  247. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor.model.document ) );
  248. return new Promise( res => {
  249. watchdog.on( 'restart', () => {
  250. window.onerror = originalErrorHandler;
  251. watchdog.destroy().then( res );
  252. } );
  253. } );
  254. } );
  255. } );
  256. it( 'Watchdog should intercept editor errors and restart the editor if the editor can be found from the context #2', () => {
  257. const watchdog = new EditorWatchdog();
  258. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  259. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  260. const originalErrorHandler = window.onerror;
  261. window.onerror = undefined;
  262. return watchdog.create( element ).then( () => {
  263. setTimeout( () => throwCKEditorError( 'foo', {
  264. foo: [ 1, 2, 3, {
  265. bar: new Set( [
  266. new Map( [
  267. [ 'foo', 'bar' ],
  268. [ 0, watchdog.editor ]
  269. ] )
  270. ] )
  271. } ]
  272. } ) );
  273. return new Promise( res => {
  274. watchdog.on( 'restart', () => {
  275. window.onerror = originalErrorHandler;
  276. watchdog.destroy().then( res );
  277. } );
  278. } );
  279. } );
  280. } );
  281. it( 'Watchdog should crash permanently if the `crashNumberLimit` is reached' +
  282. ' and the average time between errors is lower than `minimumNonErrorTimePeriod` (default values)', () => {
  283. const watchdog = new EditorWatchdog();
  284. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  285. const errorSpy = sinon.spy();
  286. watchdog.on( 'error', errorSpy );
  287. const restartSpy = sinon.spy();
  288. watchdog.on( 'restart', restartSpy );
  289. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  290. const originalErrorHandler = window.onerror;
  291. window.onerror = undefined;
  292. return watchdog.create( element ).then( () => {
  293. setTimeout( () => throwCKEditorError( 'foo1', watchdog.editor ) );
  294. setTimeout( () => throwCKEditorError( 'foo2', watchdog.editor ) );
  295. setTimeout( () => throwCKEditorError( 'foo3', watchdog.editor ) );
  296. setTimeout( () => throwCKEditorError( 'foo4', watchdog.editor ) );
  297. return new Promise( res => {
  298. setTimeout( () => {
  299. expect( errorSpy.callCount ).to.equal( 4 );
  300. expect( watchdog.crashes.length ).to.equal( 4 );
  301. expect( restartSpy.callCount ).to.equal( 3 );
  302. window.onerror = originalErrorHandler;
  303. watchdog.destroy().then( res );
  304. } );
  305. } );
  306. } );
  307. } );
  308. it( 'Watchdog should crash permanently if the `crashNumberLimit` is reached' +
  309. ' and the average time between errors is lower than `minimumNonErrorTimePeriod` (custom values)', () => {
  310. const watchdog = new EditorWatchdog( { crashNumberLimit: 2, minimumNonErrorTimePeriod: 1000 } );
  311. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  312. const errorSpy = sinon.spy();
  313. watchdog.on( 'error', errorSpy );
  314. const restartSpy = sinon.spy();
  315. watchdog.on( 'restart', restartSpy );
  316. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  317. const originalErrorHandler = window.onerror;
  318. window.onerror = undefined;
  319. return watchdog.create( element ).then( () => {
  320. setTimeout( () => throwCKEditorError( 'foo1', watchdog.editor ) );
  321. setTimeout( () => throwCKEditorError( 'foo2', watchdog.editor ) );
  322. setTimeout( () => throwCKEditorError( 'foo3', watchdog.editor ) );
  323. setTimeout( () => throwCKEditorError( 'foo4', watchdog.editor ) );
  324. return new Promise( res => {
  325. setTimeout( () => {
  326. expect( errorSpy.callCount ).to.equal( 3 );
  327. expect( watchdog.crashes.length ).to.equal( 3 );
  328. expect( restartSpy.callCount ).to.equal( 2 );
  329. window.onerror = originalErrorHandler;
  330. watchdog.destroy().then( res );
  331. } );
  332. } );
  333. } );
  334. } );
  335. it( 'Watchdog should not crash permantently when average time between errors is longer than `minimumNonErrorTimePeriod`', () => {
  336. const watchdog = new EditorWatchdog( { crashNumberLimit: 2, minimumNonErrorTimePeriod: 0 } );
  337. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  338. const errorSpy = sinon.spy();
  339. watchdog.on( 'error', errorSpy );
  340. const restartSpy = sinon.spy();
  341. watchdog.on( 'restart', restartSpy );
  342. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  343. const originalErrorHandler = window.onerror;
  344. window.onerror = undefined;
  345. return watchdog.create( element ).then( () => {
  346. setTimeout( () => throwCKEditorError( 'foo1', watchdog.editor ), 5 );
  347. setTimeout( () => throwCKEditorError( 'foo2', watchdog.editor ), 10 );
  348. setTimeout( () => throwCKEditorError( 'foo3', watchdog.editor ), 15 );
  349. setTimeout( () => throwCKEditorError( 'foo4', watchdog.editor ), 20 );
  350. return new Promise( res => {
  351. setTimeout( () => {
  352. expect( errorSpy.callCount ).to.equal( 4 );
  353. expect( watchdog.crashes.length ).to.equal( 4 );
  354. expect( restartSpy.callCount ).to.equal( 4 );
  355. window.onerror = originalErrorHandler;
  356. watchdog.destroy().then( res );
  357. }, 20 );
  358. } );
  359. } );
  360. } );
  361. it( 'Watchdog should warn if the CKEditorError missing its context', () => {
  362. const watchdog = new EditorWatchdog();
  363. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  364. watchdog.setDestructor( editor => editor.destroy() );
  365. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  366. const originalErrorHandler = window.onerror;
  367. window.onerror = undefined;
  368. sinon.stub( console, 'warn' );
  369. return watchdog.create( element ).then( () => {
  370. setTimeout( () => throwCKEditorError( 'foo' ) );
  371. return new Promise( res => {
  372. setTimeout( () => {
  373. window.onerror = originalErrorHandler;
  374. expect( watchdog.crashes ).to.deep.equal( [] );
  375. sinon.assert.calledWithExactly(
  376. console.warn,
  377. 'The error is missing its context and Watchdog cannot restart the proper editor.'
  378. );
  379. watchdog.destroy().then( res );
  380. } );
  381. } );
  382. } );
  383. } );
  384. it( 'Watchdog should omit error if the CKEditorError context is equal to null', () => {
  385. const watchdog = new EditorWatchdog();
  386. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  387. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  388. const originalErrorHandler = window.onerror;
  389. window.onerror = undefined;
  390. return watchdog.create( element ).then( () => {
  391. setTimeout( () => throwCKEditorError( 'foo', null ) );
  392. return new Promise( res => {
  393. setTimeout( () => {
  394. window.onerror = originalErrorHandler;
  395. expect( watchdog.crashes ).to.deep.equal( [] );
  396. watchdog.destroy().then( res );
  397. } );
  398. } );
  399. } );
  400. } );
  401. it( 'editor should be restarted with the data before the crash #1', () => {
  402. const watchdog = new EditorWatchdog();
  403. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  404. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  405. const originalErrorHandler = window.onerror;
  406. window.onerror = undefined;
  407. return watchdog.create( element, {
  408. initialData: '<p>foo</p>',
  409. plugins: [ Paragraph ]
  410. } ).then( () => {
  411. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  412. return new Promise( res => {
  413. watchdog.on( 'restart', () => {
  414. window.onerror = originalErrorHandler;
  415. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  416. watchdog.destroy().then( res );
  417. } );
  418. } );
  419. } );
  420. } );
  421. it( 'editor should be restarted with the data before the crash #2', () => {
  422. const watchdog = new EditorWatchdog();
  423. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  424. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  425. const originalErrorHandler = window.onerror;
  426. window.onerror = undefined;
  427. return watchdog.create( element, {
  428. initialData: '<p>foo</p>',
  429. plugins: [ Paragraph ]
  430. } ).then( () => {
  431. const doc = watchdog.editor.model.document;
  432. watchdog.editor.model.change( writer => {
  433. writer.insertText( 'bar', writer.createPositionAt( doc.getRoot(), 1 ) );
  434. } );
  435. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  436. return new Promise( res => {
  437. watchdog.on( 'restart', () => {
  438. window.onerror = originalErrorHandler;
  439. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p><p>bar</p>' );
  440. watchdog.destroy().then( res );
  441. } );
  442. } );
  443. } );
  444. } );
  445. it( 'editor should be restarted with the data of the latest document version before the crash', () => {
  446. const watchdog = new EditorWatchdog();
  447. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  448. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  449. const originalErrorHandler = window.onerror;
  450. window.onerror = sinon.spy();
  451. return watchdog.create( element, {
  452. initialData: '<p>foo</p>',
  453. plugins: [ Paragraph ]
  454. } ).then( () => {
  455. const model = watchdog.editor.model;
  456. const doc = model.document;
  457. // Decrement the document version to simulate a situation when an operation
  458. // don't produce new document version.
  459. doc.version--;
  460. model.change( writer => {
  461. writer.insertText( 'bar', writer.createPositionAt( doc.getRoot(), 1 ) );
  462. } );
  463. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  464. return new Promise( res => {
  465. watchdog.on( 'restart', () => {
  466. window.onerror = originalErrorHandler;
  467. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  468. watchdog.destroy().then( res );
  469. } );
  470. } );
  471. } );
  472. } );
  473. it( 'editor should be restarted with the latest available data before the crash', () => {
  474. const watchdog = new EditorWatchdog();
  475. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  476. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  477. const originalErrorHandler = window.onerror;
  478. window.onerror = undefined;
  479. sinon.stub( console, 'error' );
  480. return watchdog.create( element, {
  481. initialData: '<p>foo</p>',
  482. plugins: [ Paragraph ]
  483. } ).then( () => {
  484. const editorGetDataError = new Error( 'Some error' );
  485. const getDataStub = sinon.stub( watchdog.editor.data, 'get' )
  486. .throwsException( editorGetDataError );
  487. // Keep the reference to cleanly destroy it at in the end, as during the TC it
  488. // throws an exception during destruction.
  489. const firstEditor = watchdog.editor;
  490. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  491. return new Promise( res => {
  492. const doc = watchdog.editor.model.document;
  493. watchdog.editor.model.change( writer => {
  494. writer.insertText( 'bar', writer.createPositionAt( doc.getRoot(), 1 ) );
  495. } );
  496. watchdog.on( 'restart', () => {
  497. window.onerror = originalErrorHandler;
  498. // It is called second time by during the default editor destruction
  499. // to update the source element.
  500. sinon.assert.calledTwice( getDataStub );
  501. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  502. sinon.assert.calledWith(
  503. console.error,
  504. editorGetDataError,
  505. 'An error happened during restoring editor data. Editor will be restored from the previously saved data.'
  506. );
  507. sinon.assert.calledWith(
  508. console.error,
  509. 'An error happened during the editor destructing.'
  510. );
  511. watchdog.destroy().then( () => {
  512. getDataStub.restore();
  513. return firstEditor.destroy();
  514. } ).then( res );
  515. } );
  516. } );
  517. } );
  518. } );
  519. it( 'should use the custom destructor if passed', () => {
  520. const watchdog = new EditorWatchdog();
  521. const destructionSpy = sinon.spy();
  522. watchdog.setCreator( ( el, config ) => ClassicTestEditor.create( el, config ) );
  523. watchdog.setDestructor( editor => {
  524. destructionSpy();
  525. return editor.destroy();
  526. } );
  527. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  528. const originalErrorHandler = window.onerror;
  529. window.onerror = undefined;
  530. return watchdog.create( element ).then( () => {
  531. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  532. return new Promise( res => {
  533. watchdog.on( 'restart', () => {
  534. window.onerror = originalErrorHandler;
  535. sinon.assert.calledOnce( destructionSpy );
  536. watchdog.destroy().then( res );
  537. } );
  538. } );
  539. } );
  540. } );
  541. } );
  542. describe( 'async error handling', () => {
  543. let unhandledRejectionEventSupported;
  544. before( () => {
  545. return isUnhandledRejectionEventSupported()
  546. .then( val => {
  547. unhandledRejectionEventSupported = val;
  548. } );
  549. } );
  550. it( 'Watchdog should handle async CKEditorError errors', () => {
  551. if ( !unhandledRejectionEventSupported ) {
  552. return;
  553. }
  554. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  555. const originalErrorHandler = window.onerror;
  556. window.onerror = undefined;
  557. return watchdog.create( element, {
  558. initialData: '<p>foo</p>',
  559. plugins: [ Paragraph ]
  560. } ).then( () => {
  561. const oldEditor = watchdog.editor;
  562. Promise.resolve().then( () => throwCKEditorError( 'foo', watchdog.editor ) );
  563. return new Promise( res => {
  564. watchdog.on( 'restart', () => {
  565. window.onerror = originalErrorHandler;
  566. expect( watchdog.editor ).to.not.equal( oldEditor );
  567. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  568. watchdog.destroy().then( res );
  569. } );
  570. } );
  571. } );
  572. } );
  573. it( 'Watchdog should not react to non-editor async errors', () => {
  574. if ( !unhandledRejectionEventSupported ) {
  575. return;
  576. }
  577. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  578. const originalErrorHandler = window.onerror;
  579. const editorErrorSpy = sinon.spy();
  580. window.onerror = undefined;
  581. return watchdog.create( element, {
  582. initialData: '<p>foo</p>',
  583. plugins: [ Paragraph ]
  584. } ).then( () => {
  585. watchdog.on( 'error', editorErrorSpy );
  586. Promise.resolve().then( () => Promise.reject( 'foo' ) );
  587. Promise.resolve().then( () => Promise.reject( new Error( 'bar' ) ) );
  588. // Wait a cycle.
  589. return new Promise( res => setTimeout( res ) );
  590. } ).then( () => {
  591. window.onerror = originalErrorHandler;
  592. sinon.assert.notCalled( editorErrorSpy );
  593. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  594. return watchdog.destroy();
  595. } );
  596. } );
  597. } );
  598. describe( 'destroy()', () => {
  599. // See #19.
  600. it( 'should clean internal stuff', () => {
  601. // 30ms should be enough to make the two data changes split into two data save actions.
  602. // This will ensure that the second data save action will be put off in time.
  603. const SAVE_INTERVAL = 30;
  604. const watchdog = EditorWatchdog.for( ClassicTestEditor, {
  605. saveInterval: SAVE_INTERVAL,
  606. } );
  607. return watchdog.create( element, {
  608. initialData: '<p>foo</p>',
  609. plugins: [ Paragraph ]
  610. } ).then( () => {
  611. const doc = watchdog.editor.model.document;
  612. watchdog.editor.model.change( writer => {
  613. writer.insertText( 'bar', writer.createPositionAt( doc.getRoot(), 1 ) );
  614. } );
  615. watchdog.editor.model.change( writer => {
  616. writer.insertText( 'foo', writer.createPositionAt( doc.getRoot(), 1 ) );
  617. } );
  618. return watchdog.destroy();
  619. } ).then( () => {
  620. // Wait to ensure that the throttled save is cleared and won't be executed
  621. // on the non-existing editor.
  622. return new Promise( res => setTimeout( res, SAVE_INTERVAL ) );
  623. } ).then( () => {
  624. expect( watchdog.editor ).to.equal( null );
  625. expect( watchdog.state ).to.equal( 'destroyed' );
  626. expect( watchdog.crashes ).to.deep.equal( [] );
  627. } );
  628. } );
  629. } );
  630. describe( 'static for()', () => {
  631. it( 'should be a shortcut method for creating the watchdog', () => {
  632. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  633. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  634. const originalErrorHandler = window.onerror;
  635. window.onerror = undefined;
  636. return watchdog.create( element, {
  637. initialData: '<p>foo</p>',
  638. plugins: [ Paragraph ]
  639. } ).then( () => {
  640. const oldEditor = watchdog.editor;
  641. expect( watchdog.editor ).to.be.an.instanceOf( ClassicTestEditor );
  642. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  643. return new Promise( res => {
  644. watchdog.on( 'restart', () => {
  645. window.onerror = originalErrorHandler;
  646. expect( watchdog.editor ).to.be.an.instanceOf( ClassicTestEditor );
  647. expect( watchdog.editor ).to.not.equal( oldEditor );
  648. expect( watchdog.editor.getData() ).to.equal( '<p>foo</p>' );
  649. watchdog.destroy().then( res );
  650. } );
  651. } );
  652. } );
  653. } );
  654. } );
  655. describe( 'crashes', () => {
  656. it( 'should be an array of caught errors by the watchdog', () => {
  657. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  658. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  659. const originalErrorHandler = window.onerror;
  660. window.onerror = undefined;
  661. return watchdog.create( element ).then( () => {
  662. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  663. setTimeout( () => throwCKEditorError( 'bar', watchdog.editor ) );
  664. return new Promise( res => {
  665. setTimeout( () => {
  666. window.onerror = originalErrorHandler;
  667. expect( watchdog.crashes[ 0 ].message ).to.equal( 'foo' );
  668. expect( watchdog.crashes[ 0 ].stack ).to.be.a( 'string' );
  669. expect( watchdog.crashes[ 0 ].date ).to.be.a( 'number' );
  670. expect( watchdog.crashes[ 0 ].filename ).to.be.a( 'string' );
  671. expect( watchdog.crashes[ 0 ].lineno ).to.be.a( 'number' );
  672. expect( watchdog.crashes[ 0 ].colno ).to.be.a( 'number' );
  673. expect( watchdog.crashes[ 1 ].message ).to.equal( 'bar' );
  674. watchdog.destroy().then( res );
  675. } );
  676. } );
  677. } );
  678. } );
  679. it( 'should include async errors', () => {
  680. return isUnhandledRejectionEventSupported().then( isSupported => {
  681. if ( !isSupported ) {
  682. return;
  683. }
  684. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  685. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  686. const originalErrorHandler = window.onerror;
  687. window.onerror = undefined;
  688. return watchdog.create( element ).then( () => {
  689. Promise.resolve().then( () => throwCKEditorError( 'foo', watchdog.editor ) );
  690. return new Promise( res => {
  691. // This `setTimeout` needs to have a timer defined because Firefox calls the code in random order
  692. // and causes the test failed.
  693. setTimeout( () => {
  694. window.onerror = originalErrorHandler;
  695. expect( watchdog.crashes[ 0 ].message ).to.equal( 'foo' );
  696. expect( watchdog.crashes[ 0 ].stack ).to.be.a( 'string' );
  697. expect( watchdog.crashes[ 0 ].date ).to.be.a( 'number' );
  698. expect( watchdog.crashes[ 0 ].filename ).to.be.an( 'undefined' );
  699. expect( watchdog.crashes[ 0 ].lineno ).to.be.an( 'undefined' );
  700. expect( watchdog.crashes[ 0 ].colno ).to.be.an( 'undefined' );
  701. watchdog.destroy().then( res );
  702. }, 10 );
  703. } );
  704. } );
  705. } );
  706. } );
  707. } );
  708. describe( 'state', () => {
  709. let orphanEditors = [];
  710. afterEach( () => {
  711. return Promise.all( orphanEditors.map( editor => editor.destroy() ) )
  712. .then( () => {
  713. orphanEditors = [];
  714. } );
  715. } );
  716. it( 'should reflect the state of the watchdog', () => {
  717. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  718. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  719. const originalErrorHandler = window.onerror;
  720. window.onerror = undefined;
  721. expect( watchdog.state ).to.equal( 'initializing' );
  722. return watchdog.create( element ).then( () => {
  723. orphanEditors.push( watchdog.editor );
  724. expect( watchdog.state ).to.equal( 'ready' );
  725. return watchdog.create( element ).then( () => {
  726. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  727. setTimeout( () => throwCKEditorError( 'bar', watchdog.editor ) );
  728. return new Promise( res => {
  729. setTimeout( () => {
  730. window.onerror = originalErrorHandler;
  731. expect( watchdog.state ).to.equal( 'ready' );
  732. watchdog.destroy().then( () => {
  733. expect( watchdog.state ).to.equal( 'destroyed' );
  734. res();
  735. } );
  736. } );
  737. } );
  738. } );
  739. } );
  740. } );
  741. it( 'should be observable', () => {
  742. const watchdog = EditorWatchdog.for( ClassicTestEditor );
  743. const states = [];
  744. watchdog.on( 'change:state', ( evt, propName, newValue ) => {
  745. states.push( newValue );
  746. } );
  747. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  748. const originalErrorHandler = window.onerror;
  749. window.onerror = undefined;
  750. return watchdog.create( element ).then( () => {
  751. orphanEditors.push( watchdog.editor );
  752. return watchdog.create( element ).then( () => {
  753. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  754. setTimeout( () => throwCKEditorError( 'bar', watchdog.editor ) );
  755. setTimeout( () => throwCKEditorError( 'baz', watchdog.editor ) );
  756. setTimeout( () => throwCKEditorError( 'biz', watchdog.editor ) );
  757. return new Promise( res => {
  758. setTimeout( () => {
  759. window.onerror = originalErrorHandler;
  760. watchdog.destroy().then( () => {
  761. expect( states ).to.deep.equal( [
  762. 'ready',
  763. 'crashed',
  764. 'initializing',
  765. 'ready',
  766. 'crashed',
  767. 'initializing',
  768. 'ready',
  769. 'crashed',
  770. 'initializing',
  771. 'ready',
  772. 'crashed',
  773. 'crashedPermanently',
  774. 'destroyed'
  775. ] );
  776. res();
  777. } );
  778. } );
  779. } );
  780. } );
  781. } );
  782. } );
  783. } );
  784. describe( 'multi-root editors', () => {
  785. it( 'should support multi-root editors', () => {
  786. class MultiRootEditor extends Editor {
  787. constructor( sourceElements, config ) {
  788. super( config );
  789. this.data.processor = new HtmlDataProcessor();
  790. // Create a root for each source element.
  791. for ( const rootName of Object.keys( sourceElements ) ) {
  792. this.model.document.createRoot( '$root', rootName );
  793. }
  794. }
  795. static async create( sourceElements, config ) {
  796. const editor = new this( sourceElements, config );
  797. await editor.initPlugins();
  798. await editor.data.init( config.initialData );
  799. editor.fire( 'ready' );
  800. return editor;
  801. }
  802. }
  803. const watchdog = EditorWatchdog.for( MultiRootEditor );
  804. // sinon.stub( window, 'onerror' ).value( undefined ); and similar do not work.
  805. const originalErrorHandler = window.onerror;
  806. window.onerror = undefined;
  807. return watchdog
  808. .create( {
  809. header: element
  810. }, {
  811. initialData: {
  812. header: '<p>Foo</p>'
  813. },
  814. plugins: [ Paragraph ]
  815. } )
  816. .then( () => {
  817. expect( watchdog.editor.data.get( { rootName: 'header' } ) ).to.equal( '<p>Foo</p>' );
  818. setTimeout( () => throwCKEditorError( 'foo', watchdog.editor ) );
  819. return new Promise( res => {
  820. window.onerror = originalErrorHandler;
  821. expect( watchdog.editor.data.get( { rootName: 'header' } ) ).to.equal( '<p>Foo</p>' );
  822. res();
  823. } );
  824. } ).then( () => {
  825. return watchdog.destroy();
  826. } );
  827. } );
  828. } );
  829. } );
  830. function throwCKEditorError( name, context ) {
  831. throw new CKEditorError( name, context );
  832. }
  833. // Feature detection works as a race condition - if the `unhandledrejection` event
  834. // is supported then the listener should be called first. Otherwise the timeout will be reached.
  835. function isUnhandledRejectionEventSupported() {
  836. return new Promise( res => {
  837. window.addEventListener( 'unhandledrejection', function listener() {
  838. res( true );
  839. window.removeEventListener( 'unhandledrejection', listener );
  840. } );
  841. Promise.resolve().then( () => Promise.reject( new Error() ) );
  842. setTimeout( () => res( false ) );
  843. } );
  844. }