Merge branch 't/13829' into major

ckeditor · May 19, 2016 · 45f3e0e · 45f3e0e
2 parents 3e2c788 + c397a13
commit 45f3e0e
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 12 deletions.
diff --git a/CHANGES.md b/CHANGES.md
@@ -5,6 +5,7 @@ CKEditor 4 Changelog
 
 New Features:
 
+* [#13829](http://dev.ckeditor.com/ticket/13829): Fixed: No class in [Widget](http://ckeditor.com/addon/widget) wrapper that would identify the widget type.
 * [#14449](http://dev.ckeditor.com/ticket/14449): Introduced the [Balloon Panel](http://ckeditor.com/addon/balloonpanel) plugin.
 * [#12077](https://dev.ckeditor.com/ticket/12077): Added support for the HTML5 `download` attribute in link (`<a>`) elements. Thanks to [sbusse](https://github.com/sbusse)!
 * [#13518](http://dev.ckeditor.com/ticket/13518): Introduced [`additionalRequestParameters`](http://docs.ckeditor.com/#!/api/CKEDITOR.fileTools.uploadWidgetDefinition-property-additionalRequestParameters) property.

diff --git a/plugins/widget/plugin.js b/plugins/widget/plugin.js
@@ -627,7 +627,9 @@
 				isInline;
 
 			if ( element instanceof CKEDITOR.dom.element ) {
-				widgetDef = this.registered[ widgetName || element.data( 'widget' ) ];
+				widgetName = widgetName || element.data( 'widget' );
+				widgetDef = this.registered[ widgetName ];
+
 				if ( !widgetDef )
 					return null;
 
@@ -639,13 +641,13 @@
 				// If attribute isn't already set (e.g. for pasted widget), set it.
 				if ( !element.hasAttribute( 'data-cke-widget-keep-attr' ) )
 					element.data( 'cke-widget-keep-attr', element.data( 'widget' ) ? 1 : 0 );
-				if ( widgetName )
-					element.data( 'widget', widgetName );
+
+				element.data( 'widget', widgetName );
 
 				isInline = isWidgetInline( widgetDef, element.getName() );
 
 				wrapper = new CKEDITOR.dom.element( isInline ? 'span' : 'div' );
-				wrapper.setAttributes( getWrapperAttributes( isInline ) );
+				wrapper.setAttributes( getWrapperAttributes( isInline, widgetName ) );
 
 				wrapper.data( 'cke-display-name', widgetDef.pathName ? widgetDef.pathName : element.getName() );
 
@@ -655,7 +657,9 @@
 				element.appendTo( wrapper );
 			}
 			else if ( element instanceof CKEDITOR.htmlParser.element ) {
-				widgetDef = this.registered[ widgetName || element.attributes[ 'data-widget' ] ];
+				widgetName = widgetName || element.attributes[ 'data-widget' ];
+				widgetDef = this.registered[ widgetName ];
+
 				if ( !widgetDef )
 					return null;
 
@@ -671,8 +675,7 @@
 
 				isInline = isWidgetInline( widgetDef, element.name );
 
-				wrapper = new CKEDITOR.htmlParser.element( isInline ? 'span' : 'div', getWrapperAttributes( isInline ) );
-
+				wrapper = new CKEDITOR.htmlParser.element( isInline ? 'span' : 'div', getWrapperAttributes( isInline, widgetName ) );
 				wrapper.attributes[ 'data-cke-display-name' ] = widgetDef.pathName ? widgetDef.pathName : element.name;
 
 				var parent = element.parent,
@@ -2199,7 +2202,7 @@
 		return false;
 	}
 
-	function getWrapperAttributes( inlineWidget ) {
+	function getWrapperAttributes( inlineWidget, name ) {
 		return {
 			// tabindex="-1" means that it can receive focus by code.
 			tabindex: -1,
@@ -2208,7 +2211,8 @@
 			'data-cke-filter': 'off',
 			// Class cke_widget_new marks widgets which haven't been initialized yet.
 			'class': 'cke_widget_wrapper cke_widget_new cke_widget_' +
-				( inlineWidget ? 'inline' : 'block' )
+				( inlineWidget ? 'inline' : 'block' ) +
+				( name ? ' cke_widget_' + name : '' )
 		};
 	}
 

diff --git a/tests/plugins/widget/_helpers/tools.js b/tests/plugins/widget/_helpers/tools.js
@@ -373,7 +373,7 @@ var widgetTestsTools = ( function() {
 		assertWidget: assertWidget,
 
 		widgetInitedWrapperAttributes:
-			'class="cke_widget_wrapper cke_widget_(?:inline|block)" ' +
+			'class="cke_widget_wrapper cke_widget_(?:inline|block) cke_widget_test(?:_upcasted_pasting|inline|block)" ' +
 			'contenteditable="false" ' +
 			'(?:data-cke-display-name="[a-z0-9]+" )?' +
 			'(?:data-cke-expando="[0-9]+" )?' +
@@ -382,7 +382,7 @@ var widgetTestsTools = ( function() {
 			'data-cke-widget-wrapper="1" ' +
 			'tabindex="-1"',
 		widgetWrapperAttributes:
-			'class="cke_widget_wrapper cke_widget_new cke_widget_(?:inline|block)" ' +
+			'class="cke_widget_wrapper cke_widget_new cke_widget_(?:inline|block) cke_widget_test(?:1|2|inline|block)?" ' +
 			'contenteditable="false" ' +
 			'(?:data-cke-display-name="[a-z0-9]+" )?' +
 			'(?:data-cke-expando="[0-9]+" )?' +
@@ -403,4 +403,4 @@ var widgetTestsTools = ( function() {
 			'</span>'
 	};
 
-} )();
+} )();
diff --git a/tests/plugins/widget/widgetsrepoapi.js b/tests/plugins/widget/widgetsrepoapi.js
@@ -229,6 +229,7 @@
 
 			assert.areSame( 'span', wrapper.getName(), 'inline wrapper name' );
 			assert.areSame( el, wrapper.getFirst(), 'inline wrapper first child' );
+			assert.isTrue( wrapper.hasClass( 'cke_widget_test' ), 'wrapper has css class based on widget name' );
 			assert.isMatching(
 				new RegExp( '^<p>foo<span ' + widgetWrapperAttributes + '><em data-cke-widget-keep-attr="1" data-widget="test">foo</em></span>bar(<br />)?</p>$' ),
 				fixHtml( editor.editable().getHtml() )
@@ -248,6 +249,7 @@
 
 			assert.areSame( 'div', wrapper.getName(), 'block wrapper name' );
 			assert.areSame( el, wrapper.getFirst(), 'block wrapper first child' );
+			assert.isTrue( wrapper.hasClass( 'cke_widget_test' ), 'wrapper has css class based on widget name' );
 			assert.isMatching(
 				new RegExp( '^<p>foo(<br />)?</p><div ' + widgetWrapperAttributes + '><div data-cke-widget-keep-attr="1" data-widget="test">foo</div></div><p>bar(<br />)?</p>$' ),
 				fixHtml( editor.editable().getHtml() ), 'HTML after 1st wrapElement()'
@@ -275,6 +277,7 @@
 
 			assert.areSame( 'span', wrapper.getName(), 'inline wrapper name' );
 			assert.areSame( el, wrapper.getFirst(), 'inline wrapper first child' );
+			assert.isTrue( wrapper.hasClass( 'cke_widget_test' ), 'wrapper has css class based on widget name' );
 			assert.isMatching(
 				new RegExp( '^<p>foo<span ' + widgetWrapperAttributes + '><span data-cke-widget-keep-attr="0" data-widget="test">foo</span></span>bar(<br />)?</p>$' ),
 				fixHtml( editor.editable().getHtml() )
@@ -332,6 +335,7 @@
 			var wrapper = this.editor.widgets.wrapElement( el, 'test' );
 
 			assert.areSame( 'span', wrapper.name, 'inline wrapper name' );
+			assert.isTrue( wrapper.hasClass( 'cke_widget_test' ), 'wrapper has css class based on widget name' );
 			assert.areSame( el, wrapper.children[ 0 ], 'inline wrapper first child' );
 			assert.isMatching( new RegExp( '^<p>foo<span ' + widgetWrapperAttributes + '><span data-cke-widget-keep-attr="0" data-widget="test">foo</span></span>bar</p>$' ), writeFrag( frag ) );
 		},