8
0

image.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. /**
  2. * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. /* global window */
  6. import ClassicTestEditor from 'tests/core/_utils/classictesteditor.js';
  7. import Image from 'ckeditor5/image/image.js';
  8. import Paragraph from 'ckeditor5/paragraph/paragraph.js';
  9. import ImageEngine from 'ckeditor5/image/imageengine.js';
  10. import MouseObserver from 'ckeditor5/engine/view/observer/mouseobserver.js';
  11. import { getData as getModelData } from 'ckeditor5/engine/dev-utils/model.js';
  12. describe( 'Image', () => {
  13. let editor, document, viewDocument, imageFeature;
  14. beforeEach( () => {
  15. const editorElement = window.document.createElement( 'div' );
  16. window.document.body.appendChild( editorElement );
  17. return ClassicTestEditor.create( editorElement, {
  18. features: [ Image, Paragraph ]
  19. } )
  20. .then( newEditor => {
  21. editor = newEditor;
  22. document = editor.document;
  23. viewDocument = editor.editing.view;
  24. imageFeature = editor.plugins.get( Image );
  25. } );
  26. } );
  27. it( 'should be loaded', () => {
  28. expect( imageFeature ).to.instanceOf( Image );
  29. } );
  30. it( 'should load ImageEngine', () => {
  31. expect( editor.plugins.get( ImageEngine ) ).to.instanceOf( ImageEngine );
  32. } );
  33. it( 'should add MouseObserver', () => {
  34. expect( viewDocument.getObserver( MouseObserver ) ).to.be.instanceOf( MouseObserver );
  35. } );
  36. it( 'should create selection in model on mousedown event', () => {
  37. editor.setData( '<figure class="image"><img src="image.png" alt="alt text" /></figure>' );
  38. const imageWidget = viewDocument.getRoot().getChild( 0 );
  39. const domEventDataMock = {
  40. target: imageWidget,
  41. preventDefault: sinon.spy()
  42. };
  43. viewDocument.fire( 'mousedown', domEventDataMock );
  44. sinon.assert.calledOnce( domEventDataMock.preventDefault );
  45. expect( getModelData( document ) ).to.equal( '[<image alt="alt text" src="image.png"></image>]' );
  46. } );
  47. it( 'should create selection in model on mousedown event when target is widget\'s child element', () => {
  48. editor.setData( '<figure class="image"><img src="image.png" alt="alt text" /></figure>' );
  49. const imgElement = viewDocument.getRoot().getChild( 0 ).getChild( 0 );
  50. const domEventDataMock = {
  51. target: imgElement,
  52. preventDefault: sinon.spy()
  53. };
  54. viewDocument.fire( 'mousedown', domEventDataMock );
  55. sinon.assert.calledOnce( domEventDataMock.preventDefault );
  56. expect( getModelData( document ) ).to.equal( '[<image alt="alt text" src="image.png"></image>]' );
  57. } );
  58. it( 'should do not change model if mousedown event is not on image', () => {
  59. editor.setData( '<p>foo bar</p><figure class="image"><img src="image.png" alt="alt text" /></figure>' );
  60. const paragraph = viewDocument.getRoot().getChild( 0 );
  61. const domEventDataMock = {
  62. target: paragraph,
  63. preventDefault: sinon.spy()
  64. };
  65. viewDocument.fire( 'mousedown', domEventDataMock );
  66. sinon.assert.notCalled( domEventDataMock.preventDefault );
  67. expect( getModelData( document ) )
  68. .to.equal( '<paragraph>[]foo bar</paragraph><image alt="alt text" src="image.png"></image>' );
  69. } );
  70. it( 'should not focus editable if already is focused', () => {
  71. editor.setData( '<figure class="image"><img src="image.png" alt="alt text" /></figure>' );
  72. const imageWidget = viewDocument.getRoot().getChild( 0 );
  73. const domEventDataMock = {
  74. target: imageWidget,
  75. preventDefault: sinon.spy()
  76. };
  77. const focusSpy = sinon.spy( viewDocument, 'focus' );
  78. viewDocument.isFocused = true;
  79. viewDocument.fire( 'mousedown', domEventDataMock );
  80. sinon.assert.calledOnce( domEventDataMock.preventDefault );
  81. sinon.assert.notCalled( focusSpy );
  82. expect( getModelData( document ) ).to.equal( '[<image alt="alt text" src="image.png"></image>]' );
  83. } );
  84. } );