8
0

inserttableview.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. /**
  2. * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. /* globals document, Event */
  6. import ViewCollection from '@ckeditor/ckeditor5-ui/src/viewcollection';
  7. import InsertTableView from '../../src/ui/inserttableview';
  8. describe( 'InsertTableView', () => {
  9. let view, locale;
  10. beforeEach( () => {
  11. locale = { t() {} };
  12. view = new InsertTableView( locale );
  13. view.render();
  14. document.body.appendChild( view.element );
  15. } );
  16. afterEach( () => {
  17. view.element.remove();
  18. } );
  19. describe( 'constructor()', () => {
  20. it( 'sets view#locale', () => {
  21. expect( view.locale ).to.equal( locale );
  22. } );
  23. it( 'sets view#rows to 0', () => {
  24. expect( view.rows ).to.equal( 0 );
  25. } );
  26. it( 'sets view#columns to 0', () => {
  27. expect( view.columns ).to.equal( 0 );
  28. } );
  29. it( 'sets #label to default rows & columns', () => {
  30. expect( view.label ).to.equal( '0 x 0' );
  31. } );
  32. it( 'creates #element from template', () => {
  33. expect( view.element.classList.contains( 'ck' ) ).to.be.true;
  34. expect( view.element.children ).to.have.length( 2 );
  35. expect( view.element.children[ 0 ].classList.contains( 'ck-insert-table-dropdown__grid' ) ).to.be.true;
  36. expect( view.element.children[ 1 ].classList.contains( 'ck-insert-table-dropdown__label' ) ).to.be.true;
  37. } );
  38. it( 'creates view#items collection', () => {
  39. expect( view.items ).to.be.instanceOf( ViewCollection );
  40. expect( view.items ).to.have.length( 100 );
  41. } );
  42. describe( 'view#items bindings', () => {
  43. it( 'updates view#height & view#width on "over" event', () => {
  44. const boxView = view.items.get( 0 );
  45. expect( boxView.isOn ).to.be.false;
  46. boxView.fire( 'over' );
  47. expect( boxView.isOn ).to.be.true;
  48. expect( view.rows ).to.equal( 1 );
  49. expect( view.columns ).to.equal( 1 );
  50. const boxViewB = view.items.get( 22 );
  51. boxViewB.fire( 'over' );
  52. expect( view.rows ).to.equal( 3 );
  53. expect( view.columns ).to.equal( 3 );
  54. } );
  55. } );
  56. describe( 'bindings', () => {
  57. it( 'binds #label to rows & columns', () => {
  58. view.rows = 3;
  59. expect( view.label ).to.equal( '3 x 0' );
  60. view.columns = 7;
  61. expect( view.label ).to.equal( '3 x 7' );
  62. } );
  63. describe( 'DOM', () => {
  64. it( 'fires execute on "click" event', () => {
  65. const spy = sinon.spy();
  66. view.on( 'execute', spy );
  67. dispatchEvent( view.element, 'click' );
  68. sinon.assert.calledOnce( spy );
  69. } );
  70. describe( 'view#items mousemove event', () => {
  71. it( 'fires "over" event', () => {
  72. const boxView = view.items.get( 0 );
  73. const spy = sinon.spy();
  74. boxView.on( 'over', spy );
  75. dispatchEvent( boxView.element, 'mouseover' );
  76. sinon.assert.calledOnce( spy );
  77. } );
  78. } );
  79. } );
  80. } );
  81. } );
  82. } );
  83. function dispatchEvent( el, domEvtName ) {
  84. if ( !el.parentNode ) {
  85. throw new Error( 'To dispatch an event, element must be in DOM. Otherwise #target is null.' );
  86. }
  87. el.dispatchEvent( new Event( domEvtName, {
  88. bubbles: true
  89. } ) );
  90. }