region.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. /**
  2. * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. /* global document */
  6. /* bender-tags: ui */
  7. 'use strict';
  8. const modules = bender.amd.require( 'core/ui/region', 'core/ui/view' );
  9. bender.tools.createSinonSandbox();
  10. let Region, View;
  11. let TestViewA, TestViewB;
  12. let region, el;
  13. describe( 'View', () => {
  14. beforeEach( createRegionInstance );
  15. describe( 'constructor', () => {
  16. it( 'accepts name', () => {
  17. expect( region.name ).to.be.equal( 'foo' );
  18. expect( region.el ).to.be.null;
  19. expect( region.views.length ).to.be.equal( 0 );
  20. } );
  21. } );
  22. describe( 'init', () => {
  23. it( 'accepts region element', () => {
  24. region.init( el );
  25. expect( region.el ).to.be.equal( el );
  26. } );
  27. } );
  28. describe( 'views collection', () => {
  29. it( 'updates DOM when adding views', () => {
  30. region.init( el );
  31. expect( region.el.childNodes.length ).to.be.equal( 0 );
  32. region.views.add( new TestViewA() );
  33. expect( region.el.childNodes.length ).to.be.equal( 1 );
  34. region.views.add( new TestViewA() );
  35. expect( region.el.childNodes.length ).to.be.equal( 2 );
  36. } );
  37. it( 'does not update DOM when no region element', () => {
  38. region.init();
  39. expect( () => {
  40. region.views.add( new TestViewA() );
  41. region.views.add( new TestViewA() );
  42. } ).to.not.throw();
  43. } );
  44. it( 'updates DOM when removing views', () => {
  45. region.init( el );
  46. let viewA = new TestViewA();
  47. let viewB = new TestViewB();
  48. region.views.add( viewA );
  49. region.views.add( viewB );
  50. expect( el.childNodes.length ).to.be.equal( 2 );
  51. expect( el.firstChild.nodeName ).to.be.equal( 'A' );
  52. expect( el.lastChild.nodeName ).to.be.equal( 'B' );
  53. region.views.remove( viewA );
  54. expect( el.childNodes.length ).to.be.equal( 1 );
  55. expect( el.firstChild.nodeName ).to.be.equal( 'B' );
  56. region.views.remove( viewB );
  57. expect( el.childNodes.length ).to.be.equal( 0 );
  58. } );
  59. } );
  60. describe( 'destroy', () => {
  61. it( 'destroys the region', () => {
  62. region.init( el );
  63. region.views.add( new TestViewA() );
  64. const elRef = region.el;
  65. const viewsRef = region.views;
  66. region.destroy();
  67. expect( elRef.parentNode ).to.be.null;
  68. expect( region.name ).to.be.equal( 'foo' );
  69. expect( region.views ).to.be.null;
  70. expect( viewsRef.length ).to.be.equal( 0 );
  71. expect( region.el ).to.be.null;
  72. } );
  73. it( 'destroys an element–less region', () => {
  74. region.init();
  75. expect( () => {
  76. region.destroy();
  77. } ).to.not.throw();
  78. } );
  79. } );
  80. } );
  81. function createRegionInstance() {
  82. Region = modules[ 'core/ui/region' ];
  83. View = modules[ 'core/ui/view' ];
  84. class A extends View {
  85. constructor() {
  86. super();
  87. this.template = { tag: 'a' };
  88. }
  89. }
  90. class B extends View {
  91. constructor() {
  92. super();
  93. this.template = { tag: 'b' };
  94. }
  95. }
  96. TestViewA = A;
  97. TestViewB = B;
  98. el = document.createElement( 'div' );
  99. region = new Region( 'foo' );
  100. }