diff --git a/package.json b/package.json index c90c0401..63a30cde 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "@ckeditor/ckeditor5-widget": "^0.2.0" }, "devDependencies": { + "@ckeditor/ckeditor5-basic-styles": "^0.9.0", "@ckeditor/ckeditor5-clipboard": "^0.7.0", "@ckeditor/ckeditor5-dev-lint": "^3.1.0", "@ckeditor/ckeditor5-editor-classic": "^0.8.0", diff --git a/src/imagecaption/imagecaptionengine.js b/src/imagecaption/imagecaptionengine.js index 3e3c546f..a3c0a480 100644 --- a/src/imagecaption/imagecaptionengine.js +++ b/src/imagecaption/imagecaptionengine.js @@ -16,10 +16,9 @@ import viewWriter from '@ckeditor/ckeditor5-engine/src/view/writer'; import ModelPosition from '@ckeditor/ckeditor5-engine/src/model/position'; import ViewPosition from '@ckeditor/ckeditor5-engine/src/view/position'; import buildViewConverter from '@ckeditor/ckeditor5-engine/src/conversion/buildviewconverter'; -import { isImage, isImageWidget } from '../image/utils'; +import { isImage } from '../image/utils'; import { captionElementCreator, - isCaption, getCaptionFromImage, matchImageCaption } from './utils'; @@ -100,8 +99,6 @@ export default class ImageCaptionEngine extends Plugin { */ _updateCaptionVisibility() { const mapper = this.editor.editing.mapper; - const viewSelection = this.editor.editing.view.selection; - const selectedElement = viewSelection.getSelectedElement(); let viewCaption; // Hide last selected caption if have no child elements. @@ -109,16 +106,21 @@ export default class ImageCaptionEngine extends Plugin { this._lastSelectedCaption.addClass( 'ck-hidden' ); } - // If whole image widget is selected. - if ( selectedElement && isImageWidget( selectedElement ) ) { - const modelImage = mapper.toModelElement( selectedElement ); - const modelCaption = getCaptionFromImage( modelImage ); + // If whole image is selected. + const modelSelection = this.editor.document.selection; + const selectedElement = modelSelection.getSelectedElement(); + + if ( selectedElement && selectedElement.is( 'image' ) ) { + const modelCaption = getCaptionFromImage( selectedElement ); viewCaption = mapper.toViewElement( modelCaption ); } // If selection is placed inside caption. - if ( isCaption( viewSelection.editableElement ) ) { - viewCaption = viewSelection.editableElement; + const position = modelSelection.getFirstPosition(); + const modelCaption = getParentCaption( position.parent ); + + if ( modelCaption ) { + viewCaption = mapper.toViewElement( modelCaption ); } if ( viewCaption ) { diff --git a/tests/manual/tickets/127/1.html b/tests/manual/tickets/127/1.html new file mode 100644 index 00000000..b66076e1 --- /dev/null +++ b/tests/manual/tickets/127/1.html @@ -0,0 +1,6 @@ +
+

foo bar Link bold

+
+ CKEditor logo +
+
diff --git a/tests/manual/tickets/127/1.js b/tests/manual/tickets/127/1.js new file mode 100644 index 00000000..7d211891 --- /dev/null +++ b/tests/manual/tickets/127/1.js @@ -0,0 +1,30 @@ +/** + * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved. + * For licensing, see LICENSE.md. + */ + +/* global document, console, window */ + +import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor'; +import Enter from '@ckeditor/ckeditor5-enter/src/enter'; +import Typing from '@ckeditor/ckeditor5-typing/src/typing'; +import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph'; +import Link from '@ckeditor/ckeditor5-link/src/link'; +import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold'; +import Image from '../../../../src/image'; +import ImageCaption from '../../../../src/imagecaption'; +import Undo from '@ckeditor/ckeditor5-undo/src/undo'; +import ContextualToolbar from '@ckeditor/ckeditor5-ui/src/toolbar/contextual/contextualtoolbar'; +import ImageToolbar from '../../../../src/imagetoolbar'; + +ClassicEditor + .create( document.querySelector( '#editor' ), { + plugins: [ Enter, Typing, Paragraph, Link, Bold, Image, Undo, ImageToolbar, ContextualToolbar, ImageCaption ], + toolbar: [ 'bold', 'undo', 'redo' ], + } ) + .then( editor => { + window.editor = editor; + } ) + .catch( err => { + console.error( err.stack ); + } ); diff --git a/tests/manual/tickets/127/1.md b/tests/manual/tickets/127/1.md new file mode 100644 index 00000000..4d68175c --- /dev/null +++ b/tests/manual/tickets/127/1.md @@ -0,0 +1,8 @@ +### Update caption visibility when typing at the end of a link [#127](https://github.com/ckeditor/ckeditor5-image/issues/127) + +1. Place caret at the end of the link. +1. Type two letters. +1. (See the note below) No error should be displayed to console, and normal typing should be possible. + +NOTE: Because of [the issue in typing](https://github.com/ckeditor/ckeditor5-typing/issues/120) after typing first letter selection will be moved to the beginning of the link. +This note will be removed when issue will be resolved.