renderer.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689
  1. /**
  2. * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. /**
  6. * @module engine/view/renderer
  7. */
  8. import ViewText from './text';
  9. import ViewPosition from './position';
  10. import Selection from './selection';
  11. import { INLINE_FILLER, INLINE_FILLER_LENGTH, startsWithFiller, isInlineFiller, isBlockFiller } from './filler';
  12. import mix from '@ckeditor/ckeditor5-utils/src/mix';
  13. import diff from '@ckeditor/ckeditor5-utils/src/diff';
  14. import insertAt from '@ckeditor/ckeditor5-utils/src/dom/insertat';
  15. import remove from '@ckeditor/ckeditor5-utils/src/dom/remove';
  16. import log from '@ckeditor/ckeditor5-utils/src/log';
  17. import ObservableMixin from '@ckeditor/ckeditor5-utils/src/observablemixin';
  18. import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
  19. /* global Range */
  20. /**
  21. * Renderer updates DOM structure and selection, to make them a reflection of the view structure and selection.
  22. *
  23. * View nodes which may need to be rendered needs to be {@link module:engine/view/renderer~Renderer#markToSync marked}.
  24. * Then, on {@link module:engine/view/renderer~Renderer#render render}, renderer compares the view nodes with the DOM nodes
  25. * in order to check which ones really need to be refreshed. Finally, it creates DOM nodes from these view nodes,
  26. * {@link module:engine/view/domconverter~DomConverter#bindElements binds} them and inserts into the DOM tree.
  27. *
  28. * Every time {@link module:engine/view/renderer~Renderer#render render} is called, renderer additionally checks if
  29. * {@link module:engine/view/renderer~Renderer#selection selection} needs update and updates it if so.
  30. *
  31. * Renderer uses {@link module:engine/view/domconverter~DomConverter} to transform and bind nodes.
  32. */
  33. export default class Renderer {
  34. /**
  35. * Creates a renderer instance.
  36. *
  37. * @param {module:engine/view/domconverter~DomConverter} domConverter Converter instance.
  38. * @param {module:engine/view/selection~Selection} selection View selection.
  39. */
  40. constructor( domConverter, selection ) {
  41. /**
  42. * Set of DOM Documents instances.
  43. *
  44. * @member {Set.<Document>}
  45. */
  46. this.domDocuments = new Set();
  47. /**
  48. * Converter instance.
  49. *
  50. * @readonly
  51. * @member {module:engine/view/domconverter~DomConverter}
  52. */
  53. this.domConverter = domConverter;
  54. /**
  55. * Set of nodes which attributes changed and may need to be rendered.
  56. *
  57. * @readonly
  58. * @member {Set.<module:engine/view/node~Node>}
  59. */
  60. this.markedAttributes = new Set();
  61. /**
  62. * Set of elements which child lists changed and may need to be rendered.
  63. *
  64. * @readonly
  65. * @member {Set.<module:engine/view/node~Node>}
  66. */
  67. this.markedChildren = new Set();
  68. /**
  69. * Set of text nodes which text data changed and may need to be rendered.
  70. *
  71. * @readonly
  72. * @member {Set.<module:engine/view/node~Node>}
  73. */
  74. this.markedTexts = new Set();
  75. /**
  76. * View selection. Renderer updates DOM Selection to make it match this one.
  77. *
  78. * @readonly
  79. * @member {module:engine/view/selection~Selection}
  80. */
  81. this.selection = selection;
  82. /**
  83. * The text node in which the inline filler was rendered.
  84. *
  85. * @private
  86. * @member {Text}
  87. */
  88. this._inlineFiller = null;
  89. /**
  90. * Indicates if view document is focused and selection can be rendered. Selection will not be rendered if
  91. * this is set to `false`.
  92. *
  93. * @member {Boolean}
  94. */
  95. this.isFocused = false;
  96. /**
  97. * DOM element containing fake selection.
  98. *
  99. * @private
  100. * @type {null|HTMLElement}
  101. */
  102. this._fakeSelectionContainer = null;
  103. }
  104. /**
  105. * Mark node to be synchronized.
  106. *
  107. * Note that only view nodes which parents have corresponding DOM elements need to be marked to be synchronized.
  108. *
  109. * @see #markedAttributes
  110. * @see #markedChildren
  111. * @see #markedTexts
  112. *
  113. * @param {module:engine/view/document~ChangeType} type Type of the change.
  114. * @param {module:engine/view/node~Node} node Node to be marked.
  115. */
  116. markToSync( type, node ) {
  117. if ( type === 'text' ) {
  118. if ( this.domConverter.getCorrespondingDom( node.parent ) ) {
  119. this.markedTexts.add( node );
  120. }
  121. } else {
  122. // If the node has no DOM element it is not rendered yet,
  123. // its children/attributes do not need to be marked to be sync.
  124. if ( !this.domConverter.getCorrespondingDom( node ) ) {
  125. return;
  126. }
  127. if ( type === 'attributes' ) {
  128. this.markedAttributes.add( node );
  129. } else if ( type === 'children' ) {
  130. this.markedChildren.add( node );
  131. } else {
  132. /**
  133. * Unknown type passed to Renderer.markToSync.
  134. *
  135. * @error renderer-unknown-type
  136. */
  137. throw new CKEditorError( 'view-renderer-unknown-type: Unknown type passed to Renderer.markToSync.' );
  138. }
  139. }
  140. }
  141. /**
  142. * Render method checks {@link #markedAttributes},
  143. * {@link #markedChildren} and {@link #markedTexts} and updates all
  144. * nodes which need to be updated. Then it clears all three sets. Also, every time render is called it compares and
  145. * if needed updates the selection.
  146. *
  147. * Renderer tries not to break text composition (e.g. IME) and x-index of the selection,
  148. * so it does as little as it is needed to update the DOM.
  149. *
  150. * For attributes it adds new attributes to DOM elements, updates values and removes
  151. * attributes which do not exist in the view element.
  152. *
  153. * For text nodes it updates the text string if it is different. Note that if parent element is marked as an element
  154. * which changed child list, text node update will not be done, because it may not be possible do find a
  155. * {@link module:engine/view/domconverter~DomConverter#getCorrespondingDomText corresponding DOM text}. The change will be handled
  156. * in the parent element.
  157. *
  158. * For elements, which child lists have changed, it calculates a {@link module:utils/diff~diff} and adds or removes children which have
  159. * changed.
  160. *
  161. * Rendering also handles {@link module:engine/view/filler fillers}. Especially, it checks if the inline filler is needed
  162. * at selection position and adds or removes it. To prevent breaking text composition inline filler will not be
  163. * removed as long selection is in the text node which needed it at first.
  164. */
  165. render() {
  166. let inlineFillerPosition;
  167. // There was inline filler rendered in the DOM but it's not
  168. // at the selection position any more, so we can remove it
  169. // (cause even if it's needed, it must be placed in another location).
  170. if ( this._inlineFiller && !this._isSelectionInInlineFiller() ) {
  171. this._removeInlineFiller();
  172. }
  173. // If we've got the filler, let's try to guess its position in the view.
  174. if ( this._inlineFiller ) {
  175. inlineFillerPosition = this._getInlineFillerPosition();
  176. }
  177. // Othewise, if it's needed, create it at the selection position.
  178. else if ( this._needsInlineFillerAtSelection() ) {
  179. inlineFillerPosition = this.selection.getFirstPosition();
  180. // Do not use `markToSync` so it will be added even if the parent is already added.
  181. this.markedChildren.add( inlineFillerPosition.parent );
  182. }
  183. for ( let node of this.markedTexts ) {
  184. if ( !this.markedChildren.has( node.parent ) && this.domConverter.getCorrespondingDom( node.parent ) ) {
  185. this._updateText( node, { inlineFillerPosition } );
  186. }
  187. }
  188. for ( let element of this.markedAttributes ) {
  189. this._updateAttrs( element );
  190. }
  191. for ( let element of this.markedChildren ) {
  192. this._updateChildren( element, { inlineFillerPosition } );
  193. }
  194. this._updateSelection();
  195. this._updateFocus();
  196. this.markedTexts.clear();
  197. this.markedAttributes.clear();
  198. this.markedChildren.clear();
  199. // Remember the filler by its node.
  200. this._inlineFiller = this._getInlineFillerNode( inlineFillerPosition );
  201. }
  202. /**
  203. * Gets the text node in which the inline filler is kept.
  204. *
  205. * @private
  206. * @param {module:engine/view/position~Position} fillerPosition The position on which the filler is needed in the view.
  207. * @returns {Text} The text node with the filler.
  208. */
  209. _getInlineFillerNode( fillerPosition ) {
  210. if ( !fillerPosition ) {
  211. this._inlineFiller = null;
  212. return;
  213. }
  214. const domPosition = this.domConverter.viewPositionToDom( fillerPosition );
  215. /* istanbul ignore if */
  216. if ( !domPosition || !startsWithFiller( domPosition.parent ) ) {
  217. /**
  218. * Cannot find filler node by its position.
  219. *
  220. * @error view-renderer-cannot-find-filler
  221. */
  222. throw new CKEditorError( 'view-renderer-cannot-find-filler: Cannot find filler node by its position.' );
  223. }
  224. return domPosition.parent;
  225. }
  226. /**
  227. * Gets the position of the inline filler based on the current selection.
  228. * Here, we assume that we know that the filler is needed and
  229. * {@link #_isSelectionInInlineFiller is at the selection position}, and, since it's needed,
  230. * it's somewhere at the selection postion.
  231. *
  232. * Note: we cannot restore the filler position based on the filler's DOM text node, because
  233. * when this method is called (before rendering) the bindings will often be broken. View to DOM
  234. * bindings are only dependable after rendering.
  235. *
  236. * @private
  237. * @returns {module:engine/view/position~Position}
  238. */
  239. _getInlineFillerPosition() {
  240. const firstPos = this.selection.getFirstPosition();
  241. if ( firstPos.parent.is( 'text' ) ) {
  242. return ViewPosition.createBefore( this.selection.getFirstPosition().parent );
  243. } else {
  244. return firstPos;
  245. }
  246. }
  247. /**
  248. * Returns `true` if the selection hasn't left the inline filler's text node.
  249. * If it is `true` it means that the filler had been added for a reason and the selection does not
  250. * left the filler's text node. E.g. the user can be in the middle of a composition so it should not be touched.
  251. *
  252. * @private
  253. * @returns {Boolean} True if the inline filler and selection are in the same place.
  254. */
  255. _isSelectionInInlineFiller() {
  256. if ( this.selection.rangeCount != 1 || !this.selection.isCollapsed ) {
  257. return false;
  258. }
  259. // Note, we can't check if selection's position equals position of the
  260. // this._inlineFiller node, because of #663. We may not be able to calculate
  261. // the filler's position in the view at this stage.
  262. // Instead, we check it the other way – whether selection is anchored in
  263. // that text node or next to it.
  264. // Possible options are:
  265. // "FILLER{}"
  266. // "FILLERadded-text{}"
  267. const selectionPosition = this.selection.getFirstPosition();
  268. const position = this.domConverter.viewPositionToDom( selectionPosition );
  269. if ( position && this.domConverter.isText( position.parent ) && startsWithFiller( position.parent ) ) {
  270. return true;
  271. }
  272. return false;
  273. }
  274. /**
  275. * Removes the inline filler.
  276. *
  277. * @private
  278. */
  279. _removeInlineFiller() {
  280. const domFillerNode = this._inlineFiller;
  281. // Something weird happened and the stored node doesn't contain the filler's text.
  282. if ( !startsWithFiller( domFillerNode ) ) {
  283. /**
  284. * The inline filler node was lost. Most likely, something overwrote the filler text node
  285. * in the DOM.
  286. *
  287. * @error view-renderer-filler-was-lost
  288. */
  289. throw new CKEditorError( 'view-renderer-filler-was-lost: The inline filler node was lost.' );
  290. }
  291. if ( isInlineFiller( domFillerNode ) ) {
  292. domFillerNode.parentNode.removeChild( domFillerNode );
  293. } else {
  294. domFillerNode.data = domFillerNode.data.substr( INLINE_FILLER_LENGTH );
  295. }
  296. this._inlineFiller = null;
  297. }
  298. /**
  299. * Checks if the inline {@link module:engine/view/filler filler} should be added.
  300. *
  301. * @private
  302. * @returns {Boolean} True if the inline fillers should be added.
  303. */
  304. _needsInlineFillerAtSelection() {
  305. if ( this.selection.rangeCount != 1 || !this.selection.isCollapsed ) {
  306. return false;
  307. }
  308. const selectionPosition = this.selection.getFirstPosition();
  309. const selectionParent = selectionPosition.parent;
  310. const selectionOffset = selectionPosition.offset;
  311. // If there is no DOM root we do not care about fillers.
  312. if ( !this.domConverter.getCorrespondingDomElement( selectionParent.root ) ) {
  313. return false;
  314. }
  315. if ( !( selectionParent.is( 'element' ) ) ) {
  316. return false;
  317. }
  318. // We have block filler, we do not need inline one.
  319. if ( selectionOffset === selectionParent.getFillerOffset() ) {
  320. return false;
  321. }
  322. const nodeBefore = selectionPosition.nodeBefore;
  323. const nodeAfter = selectionPosition.nodeAfter;
  324. if ( nodeBefore instanceof ViewText || nodeAfter instanceof ViewText ) {
  325. return false;
  326. }
  327. return true;
  328. }
  329. /**
  330. * Checks if text needs to be updated and possibly updates it.
  331. *
  332. * @private
  333. * @param {module:engine/view/text~Text} viewText View text to update.
  334. * @param {Object} options
  335. * @param {module:engine/view/position~Position} options.inlineFillerPosition The position on which the inline
  336. * filler should be rendered.
  337. */
  338. _updateText( viewText, options ) {
  339. const domText = this.domConverter.getCorrespondingDom( viewText );
  340. const newDomText = this.domConverter.viewToDom( viewText, domText.ownerDocument );
  341. const actualText = domText.data;
  342. let expectedText = newDomText.data;
  343. const filler = options.inlineFillerPosition;
  344. if ( filler && filler.parent == viewText.parent && filler.offset == viewText.index ) {
  345. expectedText = INLINE_FILLER + expectedText;
  346. }
  347. if ( actualText != expectedText ) {
  348. domText.data = expectedText;
  349. }
  350. }
  351. /**
  352. * Checks if attributes list needs to be updated and possibly updates it.
  353. *
  354. * @private
  355. * @param {module:engine/view/element~Element} viewElement View element to update.
  356. */
  357. _updateAttrs( viewElement ) {
  358. const domElement = this.domConverter.getCorrespondingDom( viewElement );
  359. const domAttrKeys = Array.from( domElement.attributes ).map( attr => attr.name );
  360. const viewAttrKeys = viewElement.getAttributeKeys();
  361. // Add or overwrite attributes.
  362. for ( let key of viewAttrKeys ) {
  363. domElement.setAttribute( key, viewElement.getAttribute( key ) );
  364. }
  365. // Remove from DOM attributes which do not exists in the view.
  366. for ( let key of domAttrKeys ) {
  367. if ( !viewElement.hasAttribute( key ) ) {
  368. domElement.removeAttribute( key );
  369. }
  370. }
  371. }
  372. /**
  373. * Checks if elements child list needs to be updated and possibly updates it.
  374. *
  375. * @private
  376. * @param {module:engine/view/element~Element} viewElement View element to update.
  377. * @param {Object} options
  378. * @param {module:engine/view/position~Position} options.inlineFillerPosition The position on which the inline
  379. * filler should be rendered.
  380. */
  381. _updateChildren( viewElement, options ) {
  382. const domConverter = this.domConverter;
  383. const domElement = domConverter.getCorrespondingDom( viewElement );
  384. if ( !domElement ) {
  385. // If there is no `domElement` it means that it was already removed from DOM.
  386. // There is no need to update it. It will be updated when re-inserted.
  387. return;
  388. }
  389. const domDocument = domElement.ownerDocument;
  390. const filler = options.inlineFillerPosition;
  391. const actualDomChildren = domElement.childNodes;
  392. const expectedDomChildren = Array.from( domConverter.viewChildrenToDom( viewElement, domDocument, { bind: true } ) );
  393. if ( filler && filler.parent == viewElement ) {
  394. const expectedNodeAfterFiller = expectedDomChildren[ filler.offset ];
  395. if ( this.domConverter.isText( expectedNodeAfterFiller ) ) {
  396. expectedNodeAfterFiller.data = INLINE_FILLER + expectedNodeAfterFiller.data;
  397. } else {
  398. expectedDomChildren.splice( filler.offset, 0, domDocument.createTextNode( INLINE_FILLER ) );
  399. }
  400. }
  401. const actions = diff( actualDomChildren, expectedDomChildren, sameNodes );
  402. let i = 0;
  403. for ( let action of actions ) {
  404. if ( action === 'insert' ) {
  405. insertAt( domElement, i, expectedDomChildren[ i ] );
  406. i++;
  407. } else if ( action === 'delete' ) {
  408. // Whenever element is removed from DOM, unbind it.
  409. this.domConverter.unbindDomElement( actualDomChildren[ i ] );
  410. remove( actualDomChildren[ i ] );
  411. } else { // 'equal'
  412. i++;
  413. }
  414. }
  415. function sameNodes( actualDomChild, expectedDomChild ) {
  416. // Elements.
  417. if ( actualDomChild === expectedDomChild ) {
  418. return true;
  419. }
  420. // Texts.
  421. else if ( domConverter.isText( actualDomChild ) && domConverter.isText( expectedDomChild ) ) {
  422. return actualDomChild.data === expectedDomChild.data;
  423. }
  424. // Block fillers.
  425. else if ( isBlockFiller( actualDomChild, domConverter.blockFiller ) &&
  426. isBlockFiller( expectedDomChild, domConverter.blockFiller ) ) {
  427. return true;
  428. }
  429. // Not matching types.
  430. return false;
  431. }
  432. }
  433. /**
  434. * Checks if selection needs to be updated and possibly updates it.
  435. *
  436. * @private
  437. */
  438. _updateSelection() {
  439. // If there is no selection - remove DOM and fake selections.
  440. if ( this.selection.rangeCount === 0 ) {
  441. this._removeDomSelection();
  442. this._removeFakeSelection();
  443. return;
  444. }
  445. const domRoot = this.domConverter.getCorrespondingDomElement( this.selection.editableElement );
  446. // Do nothing if there is no focus, or there is no DOM element corresponding to selection's editable element.
  447. if ( !this.isFocused || !domRoot ) {
  448. return;
  449. }
  450. // Render selection.
  451. if ( this.selection.isFake ) {
  452. this._updateFakeSelection( domRoot );
  453. } else {
  454. this._removeFakeSelection();
  455. this._updateDomSelection( domRoot );
  456. }
  457. }
  458. /**
  459. * Updates fake selection.
  460. *
  461. * @private
  462. * @param {HTMLElement} domRoot Valid DOM root where fake selection container should be added.
  463. */
  464. _updateFakeSelection( domRoot ) {
  465. const domDocument = domRoot.ownerDocument;
  466. // Create fake selection container if one does not exist.
  467. if ( !this._fakeSelectionContainer ) {
  468. this._fakeSelectionContainer = domDocument.createElement( 'div' );
  469. this._fakeSelectionContainer.style.position = 'fixed';
  470. this._fakeSelectionContainer.style.top = 0;
  471. this._fakeSelectionContainer.style.left = '-9999px';
  472. this._fakeSelectionContainer.appendChild( domDocument.createTextNode( '\u00A0' ) );
  473. }
  474. // Add fake container if not already added.
  475. if ( !this._fakeSelectionContainer.parentElement ) {
  476. domRoot.appendChild( this._fakeSelectionContainer );
  477. }
  478. // Update contents.
  479. const content = this.selection.fakeSelectionLabel || '\u00A0';
  480. this._fakeSelectionContainer.firstChild.data = content;
  481. // Update selection.
  482. const domSelection = domDocument.getSelection();
  483. domSelection.removeAllRanges();
  484. const domRange = new Range();
  485. domRange.selectNodeContents( this._fakeSelectionContainer );
  486. domSelection.addRange( domRange );
  487. // Bind fake selection container with current selection.
  488. this.domConverter.bindFakeSelection( this._fakeSelectionContainer, this.selection );
  489. }
  490. /**
  491. * Updates DOM selection.
  492. *
  493. * @private
  494. * @param {HTMLElement} domRoot Valid DOM root where DOM selection should be rendered.
  495. */
  496. _updateDomSelection( domRoot ) {
  497. const domSelection = domRoot.ownerDocument.defaultView.getSelection();
  498. const oldViewSelection = domSelection && this.domConverter.domSelectionToView( domSelection );
  499. if ( oldViewSelection && this.selection.isEqual( oldViewSelection ) ) {
  500. return;
  501. }
  502. if ( oldViewSelection && areSimilarSelections( oldViewSelection, this.selection ) ) {
  503. const data = {
  504. oldSelection: oldViewSelection,
  505. currentSelection: this.selection
  506. };
  507. log.warn( 'renderer-skipped-selection-rendering: The selection was not rendered due to its similarity to the current one.', data );
  508. return;
  509. }
  510. // Multi-range selection is not available in most browsers, and, at least in Chrome, trying to
  511. // set such selection, that is not continuous, throws an error. Because of that, we will just use anchor
  512. // and focus of view selection.
  513. // Since we are not supporting multi-range selection, we also do not need to check if proper editable is
  514. // selected. If there is any editable selected, it is okay (editable is taken from selection anchor).
  515. const anchor = this.domConverter.viewPositionToDom( this.selection.anchor );
  516. const focus = this.domConverter.viewPositionToDom( this.selection.focus );
  517. domSelection.collapse( anchor.parent, anchor.offset );
  518. domSelection.extend( focus.parent, focus.offset );
  519. }
  520. /**
  521. * Removes DOM selection.
  522. *
  523. * @private
  524. */
  525. _removeDomSelection() {
  526. for ( let doc of this.domDocuments ) {
  527. const domSelection = doc.getSelection();
  528. if ( domSelection.rangeCount ) {
  529. const activeDomElement = doc.activeElement;
  530. const viewElement = this.domConverter.getCorrespondingViewElement( activeDomElement );
  531. if ( activeDomElement && viewElement ) {
  532. doc.getSelection().removeAllRanges();
  533. }
  534. }
  535. }
  536. }
  537. /**
  538. * Removes fake selection.
  539. *
  540. * @private
  541. */
  542. _removeFakeSelection() {
  543. const container = this._fakeSelectionContainer;
  544. if ( container ) {
  545. container.remove();
  546. }
  547. }
  548. /**
  549. * Checks if focus needs to be updated and possibly updates it.
  550. *
  551. * @private
  552. */
  553. _updateFocus() {
  554. if ( this.isFocused ) {
  555. const editable = this.selection.editableElement;
  556. if ( editable ) {
  557. this.domConverter.focus( editable );
  558. }
  559. }
  560. }
  561. }
  562. mix( Renderer, ObservableMixin );
  563. // Checks if two given selections are similar. Selections are considered similar if they are non-collapsed
  564. // and their trimmed (see {@link #_trimSelection}) representations are equal.
  565. //
  566. // @private
  567. // @param {module:engine/view/selection~Selection} selection1
  568. // @param {module:engine/view/selection~Selection} selection2
  569. // @returns {Boolean}
  570. function areSimilarSelections( selection1, selection2 ) {
  571. return !selection1.isCollapsed && trimSelection( selection1 ).isEqual( trimSelection( selection2 ) );
  572. }
  573. // Creates a copy of a given selection with all of its ranges
  574. // trimmed (see {@link module:engine/view/range~Range#getTrimmed getTrimmed}).
  575. //
  576. // @private
  577. // @param {module:engine/view/selection~Selection} selection
  578. // @returns {module:engine/view/selection~Selection} Selection copy with all ranges trimmed.
  579. function trimSelection( selection ) {
  580. const newSelection = Selection.createFromSelection( selection );
  581. const ranges = newSelection.getRanges();
  582. let trimmedRanges = [];
  583. for ( let range of ranges ) {
  584. trimmedRanges.push( range.getTrimmed() );
  585. }
  586. newSelection.setRanges( trimmedRanges, newSelection.isBackward );
  587. return newSelection;
  588. }