Merge branch 't/10853'

Author: oleq

CHANGES.md

@@ -13,6 +13,7 @@ Fixed Issues:
 * [#11159](http://dev.ckeditor.com/ticket/11159): [Enhanced Image](http://ckeditor.com/addon/image2): Fixed buggy discovery of image dimensions in IE9 and IE10.
 * [#11101](http://dev.ckeditor.com/ticket/11101): Richcombo no longer breaks when given double quotes.
 * [#11077](http://dev.ckeditor.com/ticket/11077): [Enhanced Image](http://ckeditor.com/addon/image2): Empty undo step recorded when resizing the image.
+* [#10853](http://dev.ckeditor.com/ticket/10853): [Enhanced Image](http://ckeditor.com/addon/image2): Widget has paragraph wrapper when de-captioning unaligned image.
 * [#11198](http://dev.ckeditor.com/ticket/11198): Widgets: Drag handler is not fully visible when inline widget is in a heading.
 * [#11132](http://dev.ckeditor.com/ticket/11132): [Firefox] Fixed: Caret is lost after drag and drop of inline widget.
 * [#11182](http://dev.ckeditor.com/ticket/11182): [Internet Explorer 10-11] Fixed: Editor crashes (IE11) or works with minor issues (IE10) if page is loaded in Quirks Mode. See [`env.quirks`](http://docs.ckeditor.com/#!/api/CKEDITOR.env-property-quirks) for more details.

plugins/image2/plugin.js

@@ -150,6 +150,8 @@
 		data: function() {
 			var widget = this,
 				editor = widget.editor,
+				doc = editor.document,
+				editable = editor.editable(),
 				oldState = widget.oldData,
 				newState = widget.data;
 
@@ -181,6 +183,15 @@
 					if ( this.destroyed ) {
 						widget = editor.widgets.initOn( element, 'image2', widget.data );
 
+						// Once widget was re-created, it may become an inline element without
+						// block wrapper (i.e. when unaligned, end not captioned). Let's do some
+						// sort of autoparagraphing here (#10853).
+						if ( widget.inline && !( new CKEDITOR.dom.elementPath( widget.wrapper, editable ).block ) ) {
+							var block = doc.createElement( editor.activeEnterMode == CKEDITOR.ENTER_P ? 'p' : 'div' );
+							block.replace( widget.wrapper );
+							widget.wrapper.move( block );
+						}
+
 						// The focus must be transferred from the old one (destroyed)
 						// to the new one (just created).
 						if ( this.focused ) {
@@ -195,6 +206,7 @@
 					// According to the new state.
 					else
 						setWrapperAlign( widget );
+
 				}
 			} );
 
@@ -266,9 +278,7 @@
 	CKEDITOR.plugins.image2 = {
 		stateShifter: function( editor ) {
 			// Tag name used for centering non-captioned widgets.
-			var centerElement = editor.config.enterMode == CKEDITOR.ENTER_P ? 'p' : 'div',
-
-				doc = editor.document,
+			var doc = editor.document,
 				editable = editor.editable(),
 
 				// The order that stateActions get executed. It matters!
@@ -287,7 +297,7 @@
 								// Changed to "center" (non-captioned).
 								if ( newValue == 'center' ) {
 									data.destroy();
-									data.element = wrapInCentering( element );
+									data.element = wrapInCentering( editor, element );
 								}
 
 								// Changed to "non-center" from "center" while caption removed.
@@ -301,7 +311,7 @@
 						// Alignment remains and "center" removed caption.
 						else if ( newValue == 'center' && changed( data, 'hasCaption' ) && !hasCaptionAfter ) {
 							data.destroy();
-							data.element = wrapInCentering( element );
+							data.element = wrapInCentering( editor, element );
 						}
 
 						// Finally set display for figure.
@@ -369,10 +379,10 @@
 					return data.oldState[ name ] !== data.newState[ name ];
 			}
 
-			function wrapInCentering( element ) {
+			function wrapInCentering( editor, element ) {
 				// When widget gets centered. Wrapper must be created.
 				// Create new <p|div> with text-align:center.
-				var center = doc.createElement( centerElement, {
+				var center = doc.createElement( editor.activeEnterMode == CKEDITOR.ENTER_P ? 'p' : 'div', {
 					styles: { 'text-align': 'center' }
 				} );
 
@@ -395,12 +405,14 @@
 				if ( replaced.getParent() ) {
 					var range = editor.createRange();
 
-					// Move the range before old element and insert element into it.
 					range.moveToPosition( replaced, CKEDITOR.POSITION_BEFORE_START );
-					editable.insertElementIntoRange( replacing, range );
 
-					// Remove old element.
+					// Remove old element. Do it before insertion to avoid a case when
+					// element is moved from 'replaced' element before it, what creates
+					// a tricky case which insertElementIntorRange does not handle.
 					replaced.remove();
+
+					editable.insertElementIntoRange( replacing, range );
 				}
 				else
 					replacing.replace( replaced );