domconverter.js 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. /**
  2. * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. /* globals document */
  6. import DomConverter from '../../../src/view/domconverter';
  7. import ViewEditable from '../../../src/view/editableelement';
  8. import ViewDocument from '../../../src/view/document';
  9. import { BR_FILLER, NBSP_FILLER } from '../../../src/view/filler';
  10. import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
  11. import global from '@ckeditor/ckeditor5-utils/src/dom/global';
  12. testUtils.createSinonSandbox();
  13. describe( 'DomConverter', () => {
  14. let converter;
  15. beforeEach( () => {
  16. converter = new DomConverter();
  17. } );
  18. describe( 'constructor()', () => {
  19. it( 'should create converter with BR block filler by default', () => {
  20. expect( converter.blockFiller ).to.equal( BR_FILLER );
  21. } );
  22. it( 'should create converter with defined block filler', () => {
  23. converter = new DomConverter( { blockFiller: NBSP_FILLER } );
  24. expect( converter.blockFiller ).to.equal( NBSP_FILLER );
  25. } );
  26. } );
  27. describe( 'focus()', () => {
  28. let viewEditable, domEditable, domEditableParent, viewDocument;
  29. beforeEach( () => {
  30. viewDocument = new ViewDocument();
  31. viewEditable = new ViewEditable( 'div' );
  32. viewEditable.document = viewDocument;
  33. domEditable = document.createElement( 'div' );
  34. domEditableParent = document.createElement( 'div' );
  35. converter.bindElements( domEditable, viewEditable );
  36. domEditable.setAttribute( 'contenteditable', 'true' );
  37. domEditableParent.appendChild( domEditable );
  38. document.body.appendChild( domEditableParent );
  39. } );
  40. afterEach( () => {
  41. document.body.removeChild( domEditableParent );
  42. viewDocument.destroy();
  43. } );
  44. it( 'should call focus on corresponding DOM editable', () => {
  45. const focusSpy = testUtils.sinon.spy( domEditable, 'focus' );
  46. converter.focus( viewEditable );
  47. expect( focusSpy.calledOnce ).to.be.true;
  48. } );
  49. it( 'should not focus already focused editable', () => {
  50. const focusSpy = testUtils.sinon.spy( domEditable, 'focus' );
  51. converter.focus( viewEditable );
  52. converter.focus( viewEditable );
  53. expect( focusSpy.calledOnce ).to.be.true;
  54. } );
  55. // https://github.com/ckeditor/ckeditor5-engine/issues/951
  56. // https://github.com/ckeditor/ckeditor5-engine/issues/957
  57. it( 'should actively prevent scrolling', () => {
  58. const scrollToSpy = testUtils.sinon.stub( global.window, 'scrollTo' );
  59. const editableScrollLeftSpy = sinon.spy();
  60. const editableScrollTopSpy = sinon.spy();
  61. const parentScrollLeftSpy = sinon.spy();
  62. const parentScrollTopSpy = sinon.spy();
  63. const documentElementScrollLeftSpy = sinon.spy();
  64. const documentElementScrollTopSpy = sinon.spy();
  65. Object.defineProperties( domEditable, {
  66. scrollLeft: {
  67. get: () => 20,
  68. set: editableScrollLeftSpy
  69. },
  70. scrollTop: {
  71. get: () => 200,
  72. set: editableScrollTopSpy
  73. }
  74. } );
  75. Object.defineProperties( domEditableParent, {
  76. scrollLeft: {
  77. get: () => 40,
  78. set: parentScrollLeftSpy
  79. },
  80. scrollTop: {
  81. get: () => 400,
  82. set: parentScrollTopSpy
  83. }
  84. } );
  85. Object.defineProperties( global.document.documentElement, {
  86. scrollLeft: {
  87. get: () => 60,
  88. set: documentElementScrollLeftSpy
  89. },
  90. scrollTop: {
  91. get: () => 600,
  92. set: documentElementScrollTopSpy
  93. }
  94. } );
  95. global.window.scrollX = 10;
  96. global.window.scrollY = 100;
  97. converter.focus( viewEditable );
  98. sinon.assert.calledWithExactly( scrollToSpy, 10, 100 );
  99. sinon.assert.calledWithExactly( editableScrollLeftSpy, 20 );
  100. sinon.assert.calledWithExactly( editableScrollTopSpy, 200 );
  101. sinon.assert.calledWithExactly( parentScrollLeftSpy, 40 );
  102. sinon.assert.calledWithExactly( parentScrollTopSpy, 400 );
  103. sinon.assert.calledWithExactly( documentElementScrollLeftSpy, 60 );
  104. sinon.assert.calledWithExactly( documentElementScrollTopSpy, 600 );
  105. } );
  106. } );
  107. describe( 'DOM nodes type checking', () => {
  108. let text, element, documentFragment, comment;
  109. before( () => {
  110. text = document.createTextNode( 'test' );
  111. element = document.createElement( 'div' );
  112. documentFragment = document.createDocumentFragment();
  113. comment = document.createComment( 'a' );
  114. } );
  115. describe( 'isText()', () => {
  116. it( 'should return true for Text nodes', () => {
  117. expect( converter.isText( text ) ).to.be.true;
  118. } );
  119. it( 'should return false for other arguments', () => {
  120. expect( converter.isText( element ) ).to.be.false;
  121. expect( converter.isText( documentFragment ) ).to.be.false;
  122. expect( converter.isText( comment ) ).to.be.false;
  123. expect( converter.isText( {} ) ).to.be.false;
  124. } );
  125. } );
  126. describe( 'isElement()', () => {
  127. it( 'should return true for HTMLElement nodes', () => {
  128. expect( converter.isElement( element ) ).to.be.true;
  129. } );
  130. it( 'should return false for other arguments', () => {
  131. expect( converter.isElement( text ) ).to.be.false;
  132. expect( converter.isElement( documentFragment ) ).to.be.false;
  133. expect( converter.isElement( comment ) ).to.be.false;
  134. expect( converter.isElement( {} ) ).to.be.false;
  135. } );
  136. } );
  137. describe( 'isDocumentFragment()', () => {
  138. it( 'should return true for HTMLElement nodes', () => {
  139. expect( converter.isDocumentFragment( documentFragment ) ).to.be.true;
  140. } );
  141. it( 'should return false for other arguments', () => {
  142. expect( converter.isDocumentFragment( text ) ).to.be.false;
  143. expect( converter.isDocumentFragment( element ) ).to.be.false;
  144. expect( converter.isDocumentFragment( comment ) ).to.be.false;
  145. expect( converter.isDocumentFragment( {} ) ).to.be.false;
  146. } );
  147. } );
  148. describe( 'isComment()', () => {
  149. it( 'should return true for HTML comments', () => {
  150. expect( converter.isComment( comment ) ).to.be.true;
  151. } );
  152. it( 'should return false for other arguments', () => {
  153. expect( converter.isComment( text ) ).to.be.false;
  154. expect( converter.isComment( element ) ).to.be.false;
  155. expect( converter.isComment( documentFragment ) ).to.be.false;
  156. expect( converter.isComment( {} ) ).to.be.false;
  157. } );
  158. } );
  159. } );
  160. } );