Skip to content

Commit

Permalink
Merge branch 't/12617' into major
Browse files Browse the repository at this point in the history
  • Loading branch information
@Reinmar
Reinmar committed Feb 25, 2015
2 parents b7a30dd + 31e9387 commit b4b3a83
Show file tree
Hide file tree
Showing 2 changed files with 119 additions and 21 deletions.
36 changes: 24 additions & 12 deletions plugins/uploadwidget/plugin.js
View file
Expand Up @@ -258,22 +258,32 @@
* in common case in the {@link #onUploaded} callback.
*
* @property {Function}
* @param {String} html HTML to replace the upload widget.
* @param {String} data HTML to replace the upload widget.
* @param {String} [mode='html'] See {@link CKEDITOR.editor#method-insertHtml}'s modes.
*/
replaceWith: function( html ) {
// TODO: Use insertHtmlIntoRange (#12448) and handle multiple elements.

if ( html.trim() === '' ) {
replaceWith: function( data, mode ) {
if ( data.trim() === '' ) {
editor.widgets.del( this );
return;
}

var processedHtml = editor.dataProcessor.toHtml( html, { context: this.wrapper.getParent().getName() } ),
el = CKEDITOR.dom.element.createFromHtml( processedHtml ),
wasSelected = ( this == editor.widgets.focused ),
range;
var wasSelected = ( this == editor.widgets.focused ),
editable = editor.editable(),
range = editor.createRange(),
bookmark, bookmarks;

if ( !wasSelected ) {
bookmarks = editor.getSelection().createBookmarks();
}

range.setStartBefore( this.wrapper );
range.setEndAfter( this.wrapper );

el.replace( this.wrapper );
if ( wasSelected ) {
bookmark = range.createBookmark();
}

editable.insertHtmlIntoRange( data, range, mode );

editor.widgets.checkWidgets( { initOnlyNew: true } );

Expand All @@ -282,10 +292,12 @@
editor.widgets.destroy( this, true );

if ( wasSelected ) {
range = editor.createRange();
range.setStartAt( el, CKEDITOR.POSITION_BEFORE_END );
range.moveToBookmark( bookmark );
range.select();
} else {
editor.getSelection().selectBookmarks( bookmarks );
}

}

/**
Expand Down
104 changes: 95 additions & 9 deletions tests/plugins/uploadwidget/uploadwidget.js
View file
Expand Up @@ -165,15 +165,19 @@

addTestUploadWidget( editor, 'testReplaceWith1', {
onUploaded: function() {
// We're using strong to force editable.insertHtml to do some elements merging.
this.replaceWith( '<strong>uploaded</strong>' );
}
} );

bot.setData( '<p>x<span data-cke-upload-id="' + loader.id + '" data-widget="testReplaceWith1">uploading...</span>x</p>', function() {
editor.widgets.getByElement( editor.editable().findOne( 'span[data-widget="testReplaceWith1"]' ) ).focus(); // focus widget

loader.changeStatus( 'uploaded' );

assertUploadingWidgets( editor, 'testReplaceWith1', 0 );
assert.areSame( '<p>x<strong>uploaded</strong>x</p>', editor.getData() );

assert.isInnerHtmlMatching( '<p>x[<strong>uploaded</strong>]x@</p>', bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts );
} );
},

Expand All @@ -192,17 +196,17 @@
} );

bot.setData( '<p>x<span data-cke-upload-id="' + loader.id + '" data-widget="testReplaceWith1">uploading...</span>x</p>', function() {
editor.widgets.getByElement( editor.editable().findOne( 'span[data-widget="testReplaceWith1"]' ) ).focus(); // focus widget

loader.changeStatus( 'uploaded' );

assertUploadingWidgets( editor, 'testReplaceWith1', 0 );
assert.areSame( '<p>xx</p>', editor.getData() );

assert.isInnerHtmlMatching( '<p>x^x@</p>', bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts );
} );
},

'test replaceWith multiple elements': function() {
// replaceWith must use insertHtmlIntoRange to handle multiple elements.
assert.ignore();

var bot = this.editorBot,
editor = bot.editor,
uploads = editor.uploadsRepository,
Expand All @@ -217,10 +221,71 @@
} );

bot.setData( '<p>x<span data-cke-upload-id="' + loader.id + '" data-widget="testReplaceWith1">uploading...</span>x</p>', function() {
editor.widgets.getByElement( editor.editable().findOne( 'span[data-widget="testReplaceWith1"]' ) ).focus(); // focus widget

loader.changeStatus( 'uploaded' );

assertUploadingWidgets( editor, 'testReplaceWith1', 0 );

assert.isInnerHtmlMatching( '<p>x[<strong>uploaded1</strong><em>upl<u>oad</u>ed2</em>]x@</p>', bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts );
} );
},

'test replaceWith preserves selection placed before the widget': function() {
var bot = this.editorBot,
editor = bot.editor,
uploads = editor.uploadsRepository,
loader = uploads.create( bender.tools.getTestPngFile() );

loader.loadAndUpload( 'uploadUrl' );

addTestUploadWidget( editor, 'testReplaceWith1', {
onUploaded: function() {
// We're using strong to force editable.insertHtml to do some elements merging.
this.replaceWith( '<strong>uploaded</strong>' );
}
} );

bot.setData( '<p><strong>foo<span data-cke-upload-id="' + loader.id + '" data-widget="testReplaceWith1">uploading...</span>x</strong></p>', function() {
var range = editor.createRange();
range.setStart( editor.editable().findOne( 'strong' ).getFirst(), 2 ); // fo^o
range.collapse( true );
editor.getSelection().selectRanges( [ range ] );

loader.changeStatus( 'uploaded' );

assertUploadingWidgets( editor, 'testReplaceWith1', 0 );

assert.isInnerHtmlMatching( '<p><strong>fo^ouploadedx</strong>@</p>', bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts );
} );
},

'test replaceWith preserves selection placed after the widget': function() {
var bot = this.editorBot,
editor = bot.editor,
uploads = editor.uploadsRepository,
loader = uploads.create( bender.tools.getTestPngFile() );

loader.loadAndUpload( 'uploadUrl' );

addTestUploadWidget( editor, 'testReplaceWith1', {
onUploaded: function() {
// We're using strong to force editable.insertHtml to do some elements merging.
this.replaceWith( '<strong>uploaded</strong>' );
}
} );

bot.setData( '<p><strong>x<span data-cke-upload-id="' + loader.id + '" data-widget="testReplaceWith1">uploading...</span>foo</strong></p>', function() {
var range = editor.createRange();
range.setStart( editor.editable().findOne( 'strong' ).getLast(), 2 ); // fo^o
range.collapse( true );
editor.getSelection().selectRanges( [ range ] );

loader.changeStatus( 'uploaded' );

assertUploadingWidgets( editor, 'testReplaceWith1', 0 );
assert.areSame( '<p>x<strong>uploaded1</strong><em>upl<u>oad</u>ed2</em>x</p>', editor.getData() );

assert.isInnerHtmlMatching( '<p><strong>xuploadedfo^o</strong>@</p>', bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts );
} );
},

Expand Down Expand Up @@ -574,15 +639,15 @@

loader.changeStatus( 'uploaded' );

assert.isInnerHtmlMatching( '<p>xuploaded{}x@</p>', bender.tools.selection.getWithHtml( editor ), 'After redo.' );
assert.isInnerHtmlMatching( '<p>x[uploaded]x@</p>', bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts, 'After redo.' );

editor.execCommand( 'undo' );

assert.areSame( '<p>xx</p>', editor.getData(), 'After undo.' );

editor.execCommand( 'redo' );

assert.isInnerHtmlMatching( '<p>xuploaded{}x@</p>', bender.tools.selection.getWithHtml( editor ), 'After redo.' );
assert.isInnerHtmlMatching( '<p>x[uploaded]x@</p>', bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts, 'After redo.' );
} );
},

Expand Down Expand Up @@ -827,7 +892,7 @@

loader.changeStatus( 'uploaded' );

assert.isInnerHtmlMatching( '<p>xuploadedx@</p><p>uploaded^@</p>',
assert.isInnerHtmlMatching( '<p>xuploadedx@</p><p>[uploaded]@</p>',
bender.tools.selection.getWithHtml( editor ), htmlMatchingOpts );

editor.execCommand( 'undo' );
Expand Down Expand Up @@ -908,6 +973,27 @@
assert.isFalse( wrapper.hasClass( 'cke_upload_loading' ), 'Has NOT class loading.' );
assert.isTrue( wrapper.hasClass( 'cke_upload_uploading' ), 'Has class uploading.' );
} );
},

'test text mode': function() {
var bot = this.editorBot,
editor = bot.editor,
uploads = editor.uploadsRepository,
loader = uploads.create( bender.tools.getTestPngFile() );

loader.loadAndUpload( 'uploadUrl' );

addTestUploadWidget( editor, 'testTextMode', {
onUploaded: function() {
this.replaceWith( '<p>x</p>', 'text' );
}
} );

bot.setData( '<p><u>x<span data-cke-upload-id="' + loader.id + '" data-widget="testTextMode">uploading...</span>x</u></p>', function() {
loader.changeStatus( 'uploaded' );

assert.areSame( '<p><u>xxx</u></p>', editor.getData() );
} );
}
} );
} )();

0 comments on commit b4b3a83

Please sign in to comment.