Ticket #3708: 3708.patch

_source/plugins/styles/plugin.js

@@ -283 +283 @@
                         // Create the element to be inserted in the DOM.
                         var collapsedElement = getElement( this, document );
 
+                        // Webkit require actual text content to move selection into
+                        // this collapsed element. (#3708)
+                        if( CKEDITOR.env.webkit )
+                        {
+                                var bogusText = collapsedElement.append(  document.createText('\ufeff') );
+                                function onInputRemoveBogus( evt )
+                                {
+                                        document.removeListener( 'keyup', arguments.callee );
+                                        document.removeListener( 'mouseup', arguments.callee );
+
+                                        var keyCode = evt.data.getKey(),
+                                                bogusText = collapsedElement.getFirst();
+                                        // Ignore control keys.
+                                        if ( keyCode == 17  // Ctrl
+                                                 || keyCode == 16 // Shift
+                                                 || keyCode == 18 // Alt
+                                                )
+                                        {
+                                                checkNextInput();
+                                                return;
+                                        }
+
+                                        // Followed by any alphabatic key pressed indicate now the
+                                        // style element is no longer collpased.
+                                        if( /\w/.test( String.fromCharCode( keyCode ) ) )
+                                        {
+                                                // The bogus text has been merged with newly inputed char,
+                                                // split it out, move selection after it, then remove it.
+                                                bogusText = bogusText.split( 1 ).getPrevious();
+                                                range.moveToPosition( bogusText, CKEDITOR.POSITION_AFTER_END );
+                                                bogusText.remove();
+                                                range.select();
+                                        }
+                                        else
+                                                bogusText.remove();
+                                }
+                                function checkNextInput()
+                                {
+                                        document.on( 'keyup', onInputRemoveBogus );
+                                        document.on( 'mouseup', onInputRemoveBogus );
+                                }
+                                // It's possible that we're now inside a key event thread,
+                                // e.g. shortcutKey, so defer to skip this 'keyup'.
+                                window.setTimeout(  checkNextInput, 300 );
+                        }
                         // Insert the empty element into the DOM at the range position.
                         range.insertNode( collapsedElement );
 
+
                         // Place the selection right inside the empty element.
                         range.moveToPosition( collapsedElement, CKEDITOR.POSITION_BEFORE_END );