enableenginedebug.js 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966
  1. /**
  2. * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. import enableEngineDebug from '../../src/dev-utils/enableenginedebug';
  6. import StandardEditor from '@ckeditor/ckeditor5-core/src/editor/standardeditor';
  7. import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
  8. import ModelPosition from '../../src/model/position';
  9. import ModelRange from '../../src/model/range';
  10. import ModelText from '../../src/model/text';
  11. import ModelTextProxy from '../../src/model/textproxy';
  12. import ModelElement from '../../src/model/element';
  13. import AttributeOperation from '../../src/model/operation/attributeoperation';
  14. import InsertOperation from '../../src/model/operation/insertoperation';
  15. import MarkerOperation from '../../src/model/operation/markeroperation';
  16. import MoveOperation from '../../src/model/operation/moveoperation';
  17. import NoOperation from '../../src/model/operation/nooperation';
  18. import RenameOperation from '../../src/model/operation/renameoperation';
  19. import RootAttributeOperation from '../../src/model/operation/rootattributeoperation';
  20. import RemoveOperation from '../../src/model/operation/removeoperation';
  21. import DeltaFactory from '../../src/model/delta/deltafactory';
  22. import Delta from '../../src/model/delta/delta';
  23. import AttributeDelta from '../../src/model/delta/attributedelta';
  24. import { RootAttributeDelta } from '../../src/model/delta/attributedelta';
  25. import InsertDelta from '../../src/model/delta/insertdelta';
  26. import MarkerDelta from '../../src/model/delta/markerdelta';
  27. import MergeDelta from '../../src/model/delta/mergedelta';
  28. import MoveDelta from '../../src/model/delta/movedelta';
  29. import RenameDelta from '../../src/model/delta/renamedelta';
  30. import SplitDelta from '../../src/model/delta/splitdelta';
  31. import UnwrapDelta from '../../src/model/delta/unwrapdelta';
  32. import WrapDelta from '../../src/model/delta/wrapdelta';
  33. import deltaTransform from '../../src/model/delta/transform';
  34. import ModelDocument from '../../src/model/document';
  35. import ModelDocumentFragment from '../../src/model/documentfragment';
  36. import ViewDocument from '../../src/view/document';
  37. import ViewAttributeElement from '../../src/view/attributeelement';
  38. import ViewContainerElement from '../../src/view/containerelement';
  39. import ViewText from '../../src/view/text';
  40. import ViewTextProxy from '../../src/view/textproxy';
  41. import ViewDocumentFragment from '../../src/view/documentfragment';
  42. /* global document */
  43. describe( 'enableEngineDebug', () => {
  44. it( 'should return plugin class', () => {
  45. const result = enableEngineDebug();
  46. expect( result.prototype ).to.be.instanceof( Plugin );
  47. } );
  48. it( 'should not throw when called multiple times', () => {
  49. enableEngineDebug();
  50. enableEngineDebug();
  51. const result = enableEngineDebug();
  52. expect( result.prototype ).to.be.instanceof( Plugin );
  53. } );
  54. } );
  55. describe( 'debug tools', () => {
  56. let DebugPlugin, log, error;
  57. class TestEditor extends StandardEditor {
  58. constructor( ...args ) {
  59. super( ...args );
  60. this.document.createRoot( 'main' );
  61. this.editing.createRoot( this.element, 'main' );
  62. }
  63. }
  64. before( () => {
  65. log = sinon.spy();
  66. error = sinon.spy();
  67. DebugPlugin = enableEngineDebug( { log, error } );
  68. } );
  69. afterEach( () => {
  70. log.reset();
  71. } );
  72. describe( 'should provide logging tools', () => {
  73. let modelDoc, modelRoot, modelElement, modelDocFrag;
  74. beforeEach( () => {
  75. modelDoc = new ModelDocument();
  76. modelRoot = modelDoc.createRoot();
  77. modelElement = new ModelElement( 'paragraph', null, new ModelText( 'foo' ) );
  78. modelDocFrag = new ModelDocumentFragment( [ new ModelText( 'bar' ) ] );
  79. } );
  80. it( 'for ModelText', () => {
  81. const foo = new ModelText( 'foo', { foo: 'bar' } );
  82. expect( foo.toString() ).to.equal( '#foo' );
  83. foo.log();
  84. expect( log.calledWithExactly( 'ModelText: #foo' ) ).to.be.true;
  85. foo.logExtended();
  86. expect( log.calledWithExactly( 'ModelText: #foo, attrs: {"foo":"bar"}' ) ).to.be.true;
  87. } );
  88. it( 'for ModelTextProxy', () => {
  89. const foo = new ModelText( 'foo', { foo: 'bar' } );
  90. const proxy = new ModelTextProxy( foo, 1, 1 );
  91. expect( proxy.toString() ).to.equal( '#o' );
  92. proxy.log();
  93. expect( log.calledWithExactly( 'ModelTextProxy: #o' ) ).to.be.true;
  94. proxy.logExtended();
  95. expect( log.calledWithExactly( 'ModelTextProxy: #o, attrs: {"foo":"bar"}' ) ).to.be.true;
  96. } );
  97. it( 'for ModelElement', () => {
  98. const paragraph = new ModelElement( 'paragraph', { foo: 'bar' }, new ModelText( 'foo' ) );
  99. expect( paragraph.toString() ).to.equal( '<paragraph>' );
  100. paragraph.log();
  101. expectLog( 'ModelElement: <paragraph>' );
  102. paragraph.logExtended();
  103. expectLog( 'ModelElement: <paragraph>, 1 children, attrs: {"foo":"bar"}' );
  104. sinon.spy( paragraph, 'logExtended' );
  105. paragraph.logAll();
  106. expect( paragraph.logExtended.called ).to.be.true;
  107. expectLog( 'ModelText: #foo' );
  108. } );
  109. it( 'for ModelRootElement', () => {
  110. modelRoot.log();
  111. expectLog( 'ModelRootElement: main' );
  112. } );
  113. it( 'for ModelDocumentFragment', () => {
  114. modelDocFrag.log();
  115. expectLog( 'ModelDocumentFragment: documentFragment' );
  116. } );
  117. it( 'for ModelPosition', () => {
  118. const posInRoot = new ModelPosition( modelRoot, [ 0, 1, 0 ] );
  119. const posInElement = new ModelPosition( modelElement, [ 0 ] );
  120. const posInDocFrag = new ModelPosition( modelDocFrag, [ 2, 3 ] );
  121. expect( posInRoot.toString() ).to.equal( 'main [ 0, 1, 0 ]' );
  122. expect( posInElement.toString() ).to.equal( '<paragraph> [ 0 ]' );
  123. expect( posInDocFrag.toString() ).to.equal( 'documentFragment [ 2, 3 ]' );
  124. posInRoot.log();
  125. expectLog( 'ModelPosition: main [ 0, 1, 0 ]' );
  126. } );
  127. it( 'for ModelRange', () => {
  128. const rangeInRoot = ModelRange.createIn( modelRoot );
  129. const rangeInElement = ModelRange.createIn( modelElement );
  130. const rangeInDocFrag = ModelRange.createIn( modelDocFrag );
  131. expect( rangeInRoot.toString() ).to.equal( 'main [ 0 ] - [ 0 ]' );
  132. expect( rangeInElement.toString() ).to.equal( '<paragraph> [ 0 ] - [ 3 ]' );
  133. expect( rangeInDocFrag.toString() ).to.equal( 'documentFragment [ 0 ] - [ 3 ]' );
  134. rangeInRoot.log();
  135. expectLog( 'ModelRange: main [ 0 ] - [ 0 ]' );
  136. } );
  137. it( 'for ViewText', () => {
  138. const foo = new ViewText( 'foo' );
  139. expect( foo.toString() ).to.equal( '#foo' );
  140. foo.log();
  141. expect( log.calledWithExactly( 'ViewText: #foo' ) ).to.be.true;
  142. foo.logExtended();
  143. expect( log.calledWithExactly( 'ViewText: #foo' ) ).to.be.true;
  144. } );
  145. it( 'for ViewTextProxy', () => {
  146. const foo = new ViewText( 'foo', { foo: 'bar' } );
  147. const proxy = new ViewTextProxy( foo, 1, 1 );
  148. expect( proxy.toString() ).to.equal( '#o' );
  149. proxy.log();
  150. expect( log.calledWithExactly( 'ViewTextProxy: #o' ) ).to.be.true;
  151. proxy.logExtended();
  152. expect( log.calledWithExactly( 'ViewTextProxy: #o' ) ).to.be.true;
  153. } );
  154. describe( 'for operations', () => {
  155. beforeEach( () => {
  156. modelRoot.appendChildren( [ new ModelText( 'foobar' ) ] );
  157. } );
  158. it( 'AttributeOperation', () => {
  159. const op = new AttributeOperation( ModelRange.createIn( modelRoot ), 'key', null, { foo: 'bar' }, 0 );
  160. expect( op.toString() ).to.equal( 'AttributeOperation( 0 ): "key": null -> {"foo":"bar"}, main [ 0 ] - [ 6 ]' );
  161. op.log();
  162. expect( log.calledWithExactly( op.toString() ) ).to.be.true;
  163. } );
  164. it( 'InsertOperation', () => {
  165. const op = new InsertOperation( ModelPosition.createAt( modelRoot, 3 ), [ new ModelText( 'abc' ) ], 0 );
  166. expect( op.toString() ).to.equal( 'InsertOperation( 0 ): [ 1 ] -> main [ 3 ]' );
  167. op.log();
  168. expect( log.calledWithExactly( op.toString() ) ).to.be.true;
  169. } );
  170. it( 'MarkerOperation', () => {
  171. const op = new MarkerOperation( 'marker', null, ModelRange.createIn( modelRoot ), modelDoc.markers, 0 );
  172. expect( op.toString() ).to.equal( 'MarkerOperation( 0 ): "marker": null -> main [ 0 ] - [ 6 ]' );
  173. op.log();
  174. expect( log.calledWithExactly( op.toString() ) ).to.be.true;
  175. } );
  176. it( 'MoveOperation', () => {
  177. const op = new MoveOperation( ModelPosition.createAt( modelRoot, 1 ), 2, ModelPosition.createAt( modelRoot, 6 ), 0 );
  178. expect( op.toString() ).to.equal( 'MoveOperation( 0 ): main [ 1 ] - [ 3 ] -> main [ 6 ]' );
  179. op.log();
  180. expect( log.calledWithExactly( op.toString() ) ).to.be.true;
  181. } );
  182. it( 'NoOperation', () => {
  183. const op = new NoOperation( 0 );
  184. expect( op.toString() ).to.equal( 'NoOperation( 0 )' );
  185. op.log();
  186. expect( log.calledWithExactly( op.toString() ) ).to.be.true;
  187. } );
  188. it( 'RenameOperation', () => {
  189. const op = new RenameOperation( ModelPosition.createAt( modelRoot, 1 ), 'old', 'new', 0 );
  190. expect( op.toString() ).to.equal( 'RenameOperation( 0 ): main [ 1 ]: "old" -> "new"' );
  191. op.log();
  192. expect( log.calledWithExactly( op.toString() ) ).to.be.true;
  193. } );
  194. it( 'RootAttributeOperation', () => {
  195. const op = new RootAttributeOperation( modelRoot, 'key', 'old', null, 0 );
  196. expect( op.toString() ).to.equal( 'RootAttributeOperation( 0 ): "key": "old" -> null, main' );
  197. op.log();
  198. expect( log.calledWithExactly( op.toString() ) ).to.be.true;
  199. } );
  200. } );
  201. describe( 'for deltas', () => {
  202. it( 'Delta', () => {
  203. const delta = new Delta();
  204. const op = { log: sinon.spy() };
  205. delta.addOperation( op );
  206. sinon.spy( delta, 'log' );
  207. delta.logAll();
  208. expect( op.log.called ).to.be.true;
  209. expect( delta.log.called ).to.be.true;
  210. } );
  211. it( 'AttributeDelta', () => {
  212. modelRoot.appendChildren( new ModelText( 'foobar' ) );
  213. const delta = new AttributeDelta();
  214. const op = new AttributeOperation( ModelRange.createIn( modelRoot ), 'key', null, { foo: 'bar' }, 0 );
  215. delta.addOperation( op );
  216. expect( delta.toString() ).to.equal( 'AttributeDelta( 0 ): "key": -> {"foo":"bar"}, main [ 0 ] - [ 6 ], 1 ops' );
  217. delta.log();
  218. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  219. } );
  220. it( 'InsertDelta', () => {
  221. const delta = new InsertDelta();
  222. const op = new InsertOperation( ModelPosition.createAt( modelRoot, 3 ), [ new ModelText( 'abc' ) ], 0 );
  223. delta.addOperation( op );
  224. expect( delta.toString() ).to.equal( 'InsertDelta( 0 ): [ 1 ] -> main [ 3 ]' );
  225. delta.log();
  226. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  227. } );
  228. it( 'MarkerDelta', () => {
  229. modelRoot.appendChildren( new ModelText( 'foobar' ) );
  230. const delta = new MarkerDelta();
  231. const op = new MarkerOperation( 'marker', null, ModelRange.createIn( modelRoot ), modelDoc.markers, 0 );
  232. delta.addOperation( op );
  233. expect( delta.toString() ).to.equal( 'MarkerDelta( 0 ): "marker": null -> main [ 0 ] - [ 6 ]' );
  234. delta.log();
  235. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  236. } );
  237. it( 'MergeDelta', () => {
  238. const otherRoot = modelDoc.createRoot( '$root', 'otherRoot' );
  239. const firstEle = new ModelElement( 'paragraph' );
  240. const removedEle = new ModelElement( 'paragraph', null, [ new ModelText( 'foo' ) ] );
  241. otherRoot.appendChildren( [ firstEle, removedEle ] );
  242. const delta = new MergeDelta();
  243. const move = new MoveOperation( ModelPosition.createAt( removedEle, 0 ), 3, ModelPosition.createAt( firstEle, 0 ), 0 );
  244. const remove = new RemoveOperation( ModelPosition.createBefore( removedEle ), 1, 1 );
  245. delta.addOperation( move );
  246. delta.addOperation( remove );
  247. expect( delta.toString() ).to.equal( 'MergeDelta( 0 ): otherRoot [ 1 ]' );
  248. delta.log();
  249. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  250. } );
  251. it( 'MoveDelta', () => {
  252. const delta = new MoveDelta();
  253. const move1 = new MoveOperation( ModelPosition.createAt( modelRoot, 0 ), 1, ModelPosition.createAt( modelRoot, 3 ), 0 );
  254. const move2 = new MoveOperation( ModelPosition.createAt( modelRoot, 1 ), 1, ModelPosition.createAt( modelRoot, 6 ), 0 );
  255. delta.addOperation( move1 );
  256. delta.addOperation( move2 );
  257. expect( delta.toString() ).to.equal( 'MoveDelta( 0 ): main [ 0 ] - [ 1 ] -> main [ 3 ]; main [ 1 ] - [ 2 ] -> main [ 6 ]' );
  258. delta.log();
  259. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  260. } );
  261. it( 'RenameDelta', () => {
  262. const delta = new RenameDelta();
  263. const op = new RenameOperation( ModelPosition.createAt( modelRoot, 1 ), 'old', 'new', 0 );
  264. delta.addOperation( op );
  265. expect( delta.toString() ).to.equal( 'RenameDelta( 0 ): main [ 1 ]: "old" -> "new"' );
  266. delta.log();
  267. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  268. } );
  269. it( 'RootAttributeDelta', () => {
  270. const delta = new RootAttributeDelta();
  271. const op = new RootAttributeOperation( modelRoot, 'key', 'old', null, 0 );
  272. delta.addOperation( op );
  273. expect( delta.toString() ).to.equal( 'RootAttributeDelta( 0 ): "key": "old" -> null, main' );
  274. delta.log();
  275. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  276. } );
  277. it( 'SplitDelta', () => {
  278. const otherRoot = modelDoc.createRoot( 'main', 'otherRoot' );
  279. const splitEle = new ModelElement( 'paragraph', null, [ new ModelText( 'foo' ) ] );
  280. otherRoot.appendChildren( [ splitEle ] );
  281. const delta = new SplitDelta();
  282. const insert = new InsertOperation( ModelPosition.createAt( otherRoot, 1 ), [ new ModelElement( 'paragraph' ) ], 0 );
  283. const move = new MoveOperation( ModelPosition.createAt( splitEle, 1 ), 2, new ModelPosition( otherRoot, [ 1, 0 ] ), 1 );
  284. delta.addOperation( insert );
  285. delta.addOperation( move );
  286. expect( delta.toString() ).to.equal( 'SplitDelta( 0 ): otherRoot [ 0, 1 ]' );
  287. delta.log();
  288. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  289. } );
  290. it( 'UnwrapDelta', () => {
  291. const otherRoot = modelDoc.createRoot( 'main', 'otherRoot' );
  292. const unwrapEle = new ModelElement( 'paragraph', null, [ new ModelText( 'foo' ) ] );
  293. otherRoot.appendChildren( [ unwrapEle ] );
  294. const delta = new UnwrapDelta();
  295. const move = new MoveOperation( ModelPosition.createAt( unwrapEle, 0 ), 3, ModelPosition.createAt( otherRoot, 0 ), 0 );
  296. const remove = new RemoveOperation( ModelPosition.createAt( otherRoot, 3 ), 1, 1 );
  297. delta.addOperation( move );
  298. delta.addOperation( remove );
  299. expect( delta.toString() ).to.equal( 'UnwrapDelta( 0 ): otherRoot [ 0 ]' );
  300. delta.log();
  301. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  302. } );
  303. it( 'WrapDelta', () => {
  304. const delta = new WrapDelta();
  305. const insert = new InsertOperation( ModelPosition.createAt( modelRoot, 6 ), new ModelElement( 'paragraph' ), 0 );
  306. const move = new MoveOperation( ModelPosition.createAt( modelRoot, 0 ), 6, new ModelPosition( modelRoot, [ 1, 0 ] ), 1 );
  307. delta.addOperation( insert );
  308. delta.addOperation( move );
  309. expect( delta.toString() ).to.equal( 'WrapDelta( 0 ): main [ 0 ] - [ 6 ] -> <paragraph>' );
  310. delta.log();
  311. expect( log.calledWithExactly( delta.toString() ) ).to.be.true;
  312. } );
  313. } );
  314. it( 'for applied operations', () => {
  315. const delta = new InsertDelta();
  316. const op = new InsertOperation( ModelPosition.createAt( modelRoot, 0 ), [ new ModelText( 'foo' ) ], 0 );
  317. delta.addOperation( op );
  318. modelDoc.applyOperation( op );
  319. expect( log.calledWithExactly( 'Applying InsertOperation( 0 ): [ 1 ] -> main [ 0 ]' ) ).to.be.true;
  320. } );
  321. } );
  322. describe( 'should provide tree printing tools', () => {
  323. it( 'for model', () => {
  324. const modelDoc = new ModelDocument();
  325. const modelRoot = modelDoc.createRoot();
  326. modelRoot.appendChildren( [
  327. new ModelElement( 'paragraph', { foo: 'bar' }, [
  328. new ModelText( 'This is ' ), new ModelText( 'bold', { bold: true } ), new ModelText( '.' )
  329. ] ),
  330. new ModelElement( 'listItem', { type: 'numbered', indent: 0 }, new ModelText( 'One.' ) ),
  331. ] );
  332. const modelRootTree = modelRoot.printTree();
  333. expect( modelRootTree ).to.equal(
  334. '<main>' +
  335. '\n\t<paragraph foo="bar">' +
  336. '\n\t\tThis is ' +
  337. '\n\t\t<$text bold=true>bold</$text>' +
  338. '\n\t\t.' +
  339. '\n\t</paragraph>' +
  340. '\n\t<listItem type="numbered" indent=0>' +
  341. '\n\t\tOne.' +
  342. '\n\t</listItem>' +
  343. '\n</main>'
  344. );
  345. modelRoot.logTree();
  346. expect( log.calledWithExactly( modelRootTree ) ).to.be.true;
  347. const modelParagraph = modelRoot.getChild( 0 );
  348. const modelParagraphTree = modelParagraph.printTree();
  349. expect( modelParagraphTree ).to.equal(
  350. '<paragraph foo="bar">' +
  351. '\n\tThis is ' +
  352. '\n\t<$text bold=true>bold</$text>' +
  353. '\n\t.' +
  354. '\n</paragraph>'
  355. );
  356. log.reset();
  357. modelParagraph.logTree();
  358. expect( log.calledWithExactly( modelParagraphTree ) ).to.be.true;
  359. const modelDocFrag = new ModelDocumentFragment( [
  360. new ModelText( 'This is ' ), new ModelText( 'bold', { bold: true } ), new ModelText( '.' ),
  361. new ModelElement( 'paragraph', { foo: 'bar' }, [
  362. new ModelText( 'This is ' ), new ModelText( 'bold', { bold: true } ), new ModelText( '.' )
  363. ] )
  364. ] );
  365. const modelDocFragTree = modelDocFrag.printTree();
  366. expect( modelDocFragTree ).to.equal(
  367. 'ModelDocumentFragment: [' +
  368. '\n\tThis is ' +
  369. '\n\t<$text bold=true>bold</$text>' +
  370. '\n\t.' +
  371. '\n\t<paragraph foo="bar">' +
  372. '\n\t\tThis is ' +
  373. '\n\t\t<$text bold=true>bold</$text>' +
  374. '\n\t\t.' +
  375. '\n\t</paragraph>' +
  376. '\n]'
  377. );
  378. log.reset();
  379. modelDocFrag.logTree();
  380. expect( log.calledWithExactly( modelDocFragTree ) ).to.be.true;
  381. } );
  382. it( 'for view', () => {
  383. const viewDoc = new ViewDocument();
  384. const viewRoot = viewDoc.createRoot( 'div' );
  385. viewRoot.appendChildren( [
  386. new ViewContainerElement( 'p', { foo: 'bar' }, [
  387. new ViewText( 'This is ' ), new ViewAttributeElement( 'b', null, new ViewText( 'bold' ) ), new ViewText( '.' )
  388. ] ),
  389. new ViewContainerElement( 'ol', null, [
  390. new ViewContainerElement( 'li', null, new ViewText( 'One.' ) )
  391. ] )
  392. ] );
  393. const viewRootTree = viewRoot.printTree();
  394. expect( viewRootTree ).to.equal(
  395. '<div>' +
  396. '\n\t<p foo="bar">' +
  397. '\n\t\tThis is ' +
  398. '\n\t\t<b>' +
  399. '\n\t\t\tbold' +
  400. '\n\t\t</b>' +
  401. '\n\t\t.' +
  402. '\n\t</p>' +
  403. '\n\t<ol>' +
  404. '\n\t\t<li>' +
  405. '\n\t\t\tOne.' +
  406. '\n\t\t</li>' +
  407. '\n\t</ol>' +
  408. '\n</div>'
  409. );
  410. viewRoot.logTree();
  411. expect( log.calledWithExactly( viewRootTree ) ).to.be.true;
  412. const viewParagraph = viewRoot.getChild( 0 );
  413. const viewParagraphTree = viewParagraph.printTree();
  414. expect( viewParagraphTree ).to.equal(
  415. '<p foo="bar">' +
  416. '\n\tThis is ' +
  417. '\n\t<b>' +
  418. '\n\t\tbold' +
  419. '\n\t</b>' +
  420. '\n\t.' +
  421. '\n</p>'
  422. );
  423. log.reset();
  424. viewParagraph.logTree();
  425. expect( log.calledWithExactly( viewParagraphTree ) ).to.be.true;
  426. const viewDocFrag = new ViewDocumentFragment( [
  427. new ViewText( 'Text.' ),
  428. new ViewContainerElement( 'p', { foo: 'bar' }, [
  429. new ViewText( 'This is ' ), new ViewAttributeElement( 'b', null, new ViewText( 'bold' ) ), new ViewText( '.' )
  430. ] )
  431. ] );
  432. const viewDocFragTree = viewDocFrag.printTree();
  433. expect( viewDocFragTree ).to.equal(
  434. 'ViewDocumentFragment: [' +
  435. '\n\tText.' +
  436. '\n\t<p foo="bar">' +
  437. '\n\t\tThis is ' +
  438. '\n\t\t<b>' +
  439. '\n\t\t\tbold' +
  440. '\n\t\t</b>' +
  441. '\n\t\t.' +
  442. '\n\t</p>' +
  443. '\n]'
  444. );
  445. log.reset();
  446. viewDocFrag.logTree();
  447. expect( log.calledWithExactly( viewDocFragTree ) ).to.be.true;
  448. } );
  449. } );
  450. describe( 'should store model and view trees state', () => {
  451. let editor;
  452. beforeEach( () => {
  453. const div = document.createElement( 'div' );
  454. return TestEditor.create( div, {
  455. plugins: [ DebugPlugin ]
  456. } ).then( ( _editor ) => {
  457. editor = _editor;
  458. } );
  459. } );
  460. it( 'should store model and view state after each applied operation', () => {
  461. const model = editor.document;
  462. const modelRoot = model.getRoot();
  463. const view = editor.editing.view;
  464. const insert = new InsertOperation( ModelPosition.createAt( modelRoot, 0 ), new ModelText( 'foobar' ), 0 );
  465. model.applyOperation( wrapInDelta( insert ) );
  466. const remove = new RemoveOperation( ModelPosition.createAt( modelRoot, 1 ), 2, 1 );
  467. model.applyOperation( wrapInDelta( remove ) );
  468. log.reset();
  469. model.log( 0 );
  470. expectLog(
  471. '<$graveyard></$graveyard>' +
  472. '\n<main></main>'
  473. );
  474. model.log( 1 );
  475. expectLog(
  476. '<$graveyard></$graveyard>' +
  477. '\n<main>' +
  478. '\n\tfoobar' +
  479. '\n</main>'
  480. );
  481. model.log( 2 );
  482. expectLog(
  483. '<$graveyard>' +
  484. '\n\t<$graveyardHolder>' +
  485. '\n\t\too' +
  486. '\n\t</$graveyardHolder>' +
  487. '\n</$graveyard>' +
  488. '\n<main>' +
  489. '\n\tfbar' +
  490. '\n</main>'
  491. );
  492. model.log();
  493. expectLog(
  494. '<$graveyard>' +
  495. '\n\t<$graveyardHolder>' +
  496. '\n\t\too' +
  497. '\n\t</$graveyardHolder>' +
  498. '\n</$graveyard>' +
  499. '\n<main>' +
  500. '\n\tfbar' +
  501. '\n</main>'
  502. );
  503. view.log( 0 );
  504. expectLog(
  505. '<div></div>'
  506. );
  507. view.log( 1 );
  508. expectLog(
  509. '<div>' +
  510. '\n\tfoobar' +
  511. '\n</div>'
  512. );
  513. view.log( 2 );
  514. expectLog(
  515. '<div>' +
  516. '\n\tfbar' +
  517. '\n</div>'
  518. );
  519. sinon.spy( model, 'log' );
  520. sinon.spy( view, 'log' );
  521. editor.logModel( 1 );
  522. expect( model.log.calledWithExactly( 1 ) ).to.be.true;
  523. editor.logView( 2 );
  524. expect( view.log.calledWithExactly( 2 ) ).to.be.true;
  525. model.log.reset();
  526. view.log.reset();
  527. editor.logModel();
  528. expect( model.log.calledWithExactly( 2 ) ).to.be.true;
  529. model.log.reset();
  530. view.log.reset();
  531. editor.logDocuments();
  532. expect( model.log.calledWithExactly( 2 ) ).to.be.true;
  533. expect( view.log.calledWithExactly( 2 ) ).to.be.true;
  534. model.log.reset();
  535. view.log.reset();
  536. editor.logDocuments( 1 );
  537. expect( model.log.calledWithExactly( 1 ) ).to.be.true;
  538. expect( view.log.calledWithExactly( 1 ) ).to.be.true;
  539. } );
  540. it( 'should remove old states', () => {
  541. const model = editor.document;
  542. const modelRoot = model.getRoot();
  543. for ( let i = 0; i < 25; i++ ) {
  544. const insert = new InsertOperation( ModelPosition.createAt( modelRoot, 0 ), new ModelText( 'foobar' ), model.version );
  545. model.applyOperation( wrapInDelta( insert ) );
  546. }
  547. model.log( 0 );
  548. expectLog( 'Tree log unavailable for given version: 0' );
  549. } );
  550. } );
  551. describe( 'should provide methods for delta replayer', () => {
  552. it( 'getAppliedDeltas()', () => {
  553. const modelDoc = new ModelDocument();
  554. expect( modelDoc.getAppliedDeltas() ).to.equal( '' );
  555. const otherRoot = modelDoc.createRoot( '$root', 'otherRoot' );
  556. const firstEle = new ModelElement( 'paragraph' );
  557. const removedEle = new ModelElement( 'paragraph', null, [ new ModelText( 'foo' ) ] );
  558. otherRoot.appendChildren( [ firstEle, removedEle ] );
  559. const delta = new MergeDelta();
  560. const move = new MoveOperation( ModelPosition.createAt( removedEle, 0 ), 3, ModelPosition.createAt( firstEle, 0 ), 0 );
  561. const remove = new RemoveOperation( ModelPosition.createBefore( removedEle ), 1, 1 );
  562. delta.addOperation( move );
  563. delta.addOperation( remove );
  564. modelDoc.applyOperation( move );
  565. modelDoc.applyOperation( remove );
  566. const stringifiedDeltas = modelDoc.getAppliedDeltas();
  567. expect( stringifiedDeltas ).to.equal( JSON.stringify( delta.toJSON() ) );
  568. } );
  569. it( 'createReplayer()', () => {
  570. const modelDoc = new ModelDocument();
  571. const otherRoot = modelDoc.createRoot( '$root', 'otherRoot' );
  572. const firstEle = new ModelElement( 'paragraph' );
  573. const removedEle = new ModelElement( 'paragraph', null, [ new ModelText( 'foo' ) ] );
  574. otherRoot.appendChildren( [ firstEle, removedEle ] );
  575. const delta = new MergeDelta();
  576. const move = new MoveOperation( ModelPosition.createAt( removedEle, 0 ), 3, ModelPosition.createAt( firstEle, 0 ), 0 );
  577. const remove = new RemoveOperation( ModelPosition.createBefore( removedEle ), 1, 1 );
  578. delta.addOperation( move );
  579. delta.addOperation( remove );
  580. const stringifiedDeltas = JSON.stringify( delta.toJSON() );
  581. const deltaReplayer = modelDoc.createReplayer( stringifiedDeltas );
  582. expect( deltaReplayer.getDeltasToReplay() ).to.deep.equal( [ JSON.parse( stringifiedDeltas ) ] );
  583. } );
  584. } );
  585. describe( 'should provide debug tools for delta transformation', () => {
  586. let document, root, otherRoot;
  587. beforeEach( () => {
  588. document = new ModelDocument();
  589. root = document.createRoot();
  590. otherRoot = document.createRoot( 'other', 'other' );
  591. } );
  592. it( 'Delta#_saveHistory()', () => {
  593. const insertDeltaA = new InsertDelta();
  594. const insertOpA = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 0 );
  595. insertDeltaA.addOperation( insertOpA );
  596. const insertDeltaB = new InsertDelta();
  597. const insertOpB = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 0 );
  598. insertDeltaB.addOperation( insertOpB );
  599. const insertDeltaFinalA = new InsertDelta();
  600. const insertOpFinalA = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 1 );
  601. insertDeltaFinalA.addOperation( insertOpFinalA );
  602. const insertDeltaFinalAJsonWithoutHistory = JSON.stringify( insertDeltaFinalA );
  603. insertDeltaFinalA._saveHistory( {
  604. before: insertDeltaA,
  605. transformedBy: insertDeltaB,
  606. wasImportant: true,
  607. resultIndex: 0,
  608. resultsTotal: 1
  609. } );
  610. const insertDeltaC = new InsertDelta();
  611. const insertOpC = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 1 );
  612. insertDeltaC.addOperation( insertOpC );
  613. const insertDeltaFinalB = new InsertDelta();
  614. const insertOpFinalB = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 2 );
  615. insertDeltaFinalB.addOperation( insertOpFinalB );
  616. insertDeltaFinalB._saveHistory( {
  617. before: insertDeltaFinalA,
  618. transformedBy: insertDeltaC,
  619. wasImportant: false,
  620. resultIndex: 1,
  621. resultsTotal: 3
  622. } );
  623. expect( insertDeltaA.history ).to.be.undefined;
  624. expect( insertDeltaB.history ).to.be.undefined;
  625. expect( insertDeltaFinalA.history ).not.to.be.undefined;
  626. expect( insertDeltaFinalA.history.length ).to.equal( 1 );
  627. expect( insertDeltaFinalA.history[ 0 ] ).to.deep.equal( {
  628. before: JSON.stringify( insertDeltaA ),
  629. transformedBy: JSON.stringify( insertDeltaB ),
  630. wasImportant: true,
  631. resultIndex: 0,
  632. resultsTotal: 1
  633. } );
  634. expect( insertDeltaFinalB.history ).not.to.be.undefined;
  635. expect( insertDeltaFinalB.history.length ).to.equal( 2 );
  636. expect( insertDeltaFinalB.history[ 0 ] ).to.deep.equal( {
  637. before: JSON.stringify( insertDeltaA ),
  638. transformedBy: JSON.stringify( insertDeltaB ),
  639. wasImportant: true,
  640. resultIndex: 0,
  641. resultsTotal: 1
  642. } );
  643. expect( insertDeltaFinalB.history[ 1 ] ).to.deep.equal( {
  644. before: insertDeltaFinalAJsonWithoutHistory,
  645. transformedBy: JSON.stringify( insertDeltaC ),
  646. wasImportant: false,
  647. resultIndex: 1,
  648. resultsTotal: 3
  649. } );
  650. } );
  651. it( 'save delta history on deltaTransform.transform', () => {
  652. const deltaA = new MoveDelta();
  653. const opA = new MoveOperation( ModelPosition.createAt( root, 4 ), 4, ModelPosition.createAt( otherRoot, 4 ), 0 );
  654. deltaA.addOperation( opA );
  655. const deltaB = new InsertDelta();
  656. const opB = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 0 );
  657. deltaB.addOperation( opB );
  658. const deltaC = new MoveDelta();
  659. const opC = new MoveOperation( ModelPosition.createAt( root, 4 ), 2, ModelPosition.createAt( root, 0 ), 1 );
  660. deltaC.addOperation( opC );
  661. let result = deltaTransform.transform( deltaA, deltaB, false );
  662. expect( result[ 0 ].history ).not.to.be.undefined;
  663. expect( result[ 0 ].history.length ).to.equal( 1 );
  664. expect( result[ 0 ].history[ 0 ] ).to.deep.equal( {
  665. before: JSON.stringify( deltaA ),
  666. transformedBy: JSON.stringify( deltaB ),
  667. wasImportant: false,
  668. resultIndex: 0,
  669. resultsTotal: 1
  670. } );
  671. const firstResultWithoutHistory = result[ 0 ].clone();
  672. delete firstResultWithoutHistory.history;
  673. result = deltaTransform.transform( result[ 0 ], deltaC, true );
  674. expect( result[ 0 ].history ).not.to.be.undefined;
  675. expect( result[ 0 ].history.length ).to.equal( 2 );
  676. expect( result[ 0 ].history[ 0 ] ).to.deep.equal( {
  677. before: JSON.stringify( deltaA ),
  678. transformedBy: JSON.stringify( deltaB ),
  679. wasImportant: false,
  680. resultIndex: 0,
  681. resultsTotal: 1
  682. } );
  683. expect( result[ 0 ].history[ 1 ] ).to.deep.equal( {
  684. before: JSON.stringify( firstResultWithoutHistory ),
  685. transformedBy: JSON.stringify( deltaC ),
  686. wasImportant: true,
  687. resultIndex: 0,
  688. resultsTotal: 1
  689. } );
  690. } );
  691. it( 'recreate delta using Delta#history', () => {
  692. const deltaA = new MoveDelta();
  693. const opA = new MoveOperation( ModelPosition.createAt( root, 4 ), 4, ModelPosition.createAt( otherRoot, 4 ), 0 );
  694. deltaA.addOperation( opA );
  695. const deltaB = new InsertDelta();
  696. const opB = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 0 );
  697. deltaB.addOperation( opB );
  698. const deltaC = new MoveDelta();
  699. const opC = new MoveOperation( ModelPosition.createAt( root, 4 ), 2, ModelPosition.createAt( root, 0 ), 1 );
  700. deltaC.addOperation( opC );
  701. let original = deltaTransform.transform( deltaA, deltaB, false );
  702. original = deltaTransform.transform( original[ 0 ], deltaC, true )[ 0 ];
  703. const history = original.history;
  704. let recreated = deltaTransform.transform(
  705. DeltaFactory.fromJSON( JSON.parse( history[ 0 ].before ), document ),
  706. DeltaFactory.fromJSON( JSON.parse( history[ 0 ].transformedBy ), document ),
  707. history[ 0 ].wasImportant
  708. );
  709. recreated = recreated[ history[ 0 ].resultIndex ];
  710. recreated = deltaTransform.transform(
  711. recreated,
  712. DeltaFactory.fromJSON( JSON.parse( history[ 1 ].transformedBy ), document ),
  713. history[ 1 ].wasImportant
  714. );
  715. recreated = recreated[ history[ 1 ].resultIndex ];
  716. delete original.history;
  717. delete recreated.history;
  718. expect( JSON.stringify( recreated ) ).to.equal( JSON.stringify( original ) );
  719. } );
  720. it( 'provide additional logging when transformation crashes', () => {
  721. const deltaA = new MoveDelta();
  722. const opA = new MoveOperation( ModelPosition.createAt( root, 4 ), 4, ModelPosition.createAt( otherRoot, 4 ), 0 );
  723. deltaA.addOperation( opA );
  724. const deltaB = new InsertDelta();
  725. const opB = new InsertOperation( ModelPosition.createAt( root, 0 ), new ModelText( 'a' ), 0 );
  726. deltaB.addOperation( opB );
  727. deltaTransform.defaultTransform = () => {
  728. throw new Error();
  729. };
  730. expect( () => deltaTransform.transform( deltaA, deltaB, true ) ).to.throw( Error );
  731. expect( error.calledWith( deltaA.toString() + ' (important)' ) ).to.be.true;
  732. expect( error.calledWith( deltaB.toString() ) ).to.be.true;
  733. } );
  734. } );
  735. function expectLog( expectedLogMsg ) {
  736. expect( log.calledWithExactly( expectedLogMsg ) ).to.be.true;
  737. log.reset();
  738. }
  739. function wrapInDelta( op ) {
  740. const delta = new Delta();
  741. delta.addOperation( op );
  742. return op;
  743. }
  744. } );