Merge pull request #866 from ckeditor/t/862

[#862] Fix for square bulleted list bug

CHANGES.md

@@ -18,10 +18,11 @@ Fixed Issues:
 * [#787](https://github.com/ckeditor/ckeditor-dev/issues/787): Fixed: Using cut inside nested table does not cut selected content.
 * [#842](https://github.com/ckeditor/ckeditor-dev/issues/842): Fixed: List style not restored when toggling list indent level in [Indent List](http://ckeditor.com/addon/indentlist) plugin.
 * [#711](https://github.com/ckeditor/ckeditor-dev/issues/711): Fixed: Dragging widgets should only work with left mouse button.
+* [#862](https://github.com/ckeditor/ckeditor-dev/issues/862): Fixed: "Object Styles" group in [Styles Combo](https://ckeditor.com/addon/stylescombo) plugin is visible only if whole element is selected.
 
 Other Changes:
 
-* [#815](https://github.com/ckeditor/ckeditor-dev/issues/815): Removed Node.js dependency from CKEditor build script. 
+* [#815](https://github.com/ckeditor/ckeditor-dev/issues/815): Removed Node.js dependency from CKEditor build script.
 
 ## CKEditor 4.7.3
 

plugins/stylescombo/plugin.js

@@ -141,8 +141,9 @@
 
 				onOpen: function() {
 					var selection = editor.getSelection(),
-						// When editor is focused but is returned `null` as selected element, then return editable (#646);
-						element = selection.getSelectedElement() || editor.editable(),
+						// When editor is focused but is returned `null` as selected element, then return editable (#646).
+						// In case when selection dosen't cover whole element, we try to return element where selection starts (#862).
+						element = selection.getSelectedElement() || selection.getStartElement() || editor.editable(),
 						elementPath = editor.elementPath( element ),
 						counter = [ 0, 0, 0, 0 ];
 

tests/plugins/stylescombo/manual/squarebulletedlist.html

@@ -0,0 +1,10 @@
+<textarea id="editor" cols="30" rows="10">
+	<ul>
+		<li>One</li>
+		<li>Two</li>
+		<li>Three</li>
+	</ul>
+</textarea>
+<script>
+	CKEDITOR.replace( 'editor' )
+</script>

tests/plugins/stylescombo/manual/squarebulletedlist.md

@@ -0,0 +1,11 @@
+@bender-ui: collapsed
+@bender-tags: bug, 4.8.0, 862
+@bender-ckeditor-plugins: wysiwygarea, toolbar, stylescombo, list
+
+1. Put selection in list.
+1. Open styles combo.
+1. Change `Object Styles` for bullet list to `Square Bulleted List`.
+
+**Expected:** Circles preceding list items change into squares.
+
+**Unexpected:** `Square Bulleted List` is not available option in styles combo.

tests/plugins/stylescombo/stylescombo.js

@@ -96,6 +96,29 @@
 				}
 
 			} );
+		},
+
+		// #862
+		'test visible object styles on list items': function() {
+			bender.editorBot.create( {
+				name: 'object_styles',
+				config: {
+					removePlugins: 'format,font',
+					language: 'en'
+				}
+			}, function( bot ) {
+
+				bot.setHtmlWithSelection( '<ul><li>o^ne</li><li>two</li></ul>' );
+
+				bot.combo( 'Styles', function( combo ) {
+					var list = combo._.list.element;
+					var squareOptionId = combo._.list._.items[ 'Square Bulleted List' ] ;
+
+					assert.isNotNull( list.findOne( '#' + squareOptionId ), 'Square Bulleted List should be avialable.' );
+					assert.areNotSame( 'none', list.findOne( '#' + squareOptionId ).getStyle( 'display' ).toLowerCase(),
+						'Element with ID: #' + squareOptionId + ', should be displayed.' );
+				} );
+			} );
 		}
 	} );
 } )();