editableuiview.js 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  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 EditableUIView from '../../src/editableui/editableuiview';
  7. import Locale from '@ckeditor/ckeditor5-utils/src/locale';
  8. describe( 'EditableUIView', () => {
  9. let view, editableElement, locale;
  10. beforeEach( () => {
  11. locale = new Locale( 'en' );
  12. editableElement = document.createElement( 'div' );
  13. return ( view = new EditableUIView( locale ) ).init();
  14. } );
  15. describe( 'constructor()', () => {
  16. it( 'sets initial values of attributes', () => {
  17. expect( view.isReadOnly ).to.be.false;
  18. expect( view.isFocused ).to.be.false;
  19. } );
  20. it( 'renders element from template when no editableElement', () => {
  21. view = new EditableUIView( locale );
  22. return view.init().then( () => {
  23. expect( view.element ).to.equal( view.editableElement );
  24. expect( view.element.classList.contains( 'ck-editor__editable' ) ).to.be.true;
  25. } );
  26. } );
  27. it( 'accepts editableElement as an argument', () => {
  28. view = new EditableUIView( locale, editableElement );
  29. return view.init().then( () => {
  30. expect( view.element ).to.equal( editableElement );
  31. expect( view.element ).to.equal( view.editableElement );
  32. expect( view.element.classList.contains( 'ck-editor__editable' ) ).to.be.true;
  33. } );
  34. } );
  35. } );
  36. describe( 'View bindings', () => {
  37. describe( 'class', () => {
  38. it( 'reacts on view#isFocused', () => {
  39. view.isFocused = true;
  40. expect( view.element.classList.contains( 'ck-focused' ) ).to.be.true;
  41. expect( view.element.classList.contains( 'ck-blurred' ) ).to.be.false;
  42. view.isFocused = false;
  43. expect( view.element.classList.contains( 'ck-focused' ) ).to.be.false;
  44. expect( view.element.classList.contains( 'ck-blurred' ) ).to.be.true;
  45. } );
  46. } );
  47. describe( 'contenteditable', () => {
  48. it( 'reacts on view#isReadOnly', () => {
  49. view.isReadOnly = true;
  50. expect( view.element.hasAttribute( 'contenteditable' ) ).to.be.false;
  51. view.isReadOnly = false;
  52. expect( view.element.hasAttribute( 'contenteditable' ) ).to.be.true;
  53. } );
  54. } );
  55. } );
  56. describe( 'destroy', () => {
  57. it( 'updates contentEditable property of editableElement', () => {
  58. return new EditableUIView( locale, editableElement ).init().then( () => {
  59. expect( view.editableElement.contentEditable ).to.equal( 'true' );
  60. } )
  61. .then( () => view.destroy() )
  62. .then( () => {
  63. expect( view.editableElement.contentEditable ).to.equal( 'false' );
  64. } );
  65. } );
  66. } );
  67. } );