Skip to content

Commit

Permalink
Added insertHtmlIntoRange method. Fixed tests.
Browse files Browse the repository at this point in the history
  • Loading branch information
@Reinmar
Piotr Jasiun authored and Reinmar committed Dec 2, 2014
1 parent 90f42e9 commit 4f040eb
Show file tree
Hide file tree
Showing 4 changed files with 47 additions and 58 deletions.
46 changes: 27 additions & 19 deletions core/editable.js
View file
Expand Up @@ -230,21 +230,40 @@
}
},

/**
* @see CKEDITOR.editor#insertText
*/
insertText: function( text ) {
this.insertHtml( this.transformPlainTextToHtml( text ), 'text' );
},

/**
* @see CKEDITOR.editor#insertHtml
*/
insertHtml: function( data, mode ) {
// HTML insertion only considers the first range.
// Note: getRanges will be overwritten for tests since we want to test
// custom ranges and bypass native selections.
var range = this.editor.getSelection().getRanges()[ 0 ];

beforeInsert( this );

// Default mode is 'html'.
insert( this, mode || 'html', data );
insert( this, mode || 'html', data, range );

// Make the final range selection.
range.select();

afterInsert( this );

this.editor.fire( 'afterInsert' );
},

/**
* @see CKEDITOR.editor#insertText
*/
insertText: function( text ) {
beforeInsert( this );
insert( this, 'text', this.transformPlainTextToHtml( text ) );
insertHtmlIntoRange: function( data, mode, range ) {
// Default mode is 'html'
insert( this, mode || 'html', data, range );

this.editor.fire( 'afterInsert' );
},

/**
Expand Down Expand Up @@ -1260,14 +1279,8 @@

// Inserts the given (valid) HTML into the range position (with range content deleted),
// guarantee it's result to be a valid DOM tree.
function insert( editable, type, data ) {
function insert( editable, type, data, range ) {
var editor = editable.editor,
selection = editor.getSelection(),
// HTML insertion only considers the first range.
// Note: getRanges will be overwritten for tests since we want to test
// custom ranges and bypass native selections.
// TODO what should we do with others? Remove?
range = selection.getRanges()[ 0 ],
dontFilter = false;

if ( type == 'unfiltered_html' ) {
Expand Down Expand Up @@ -1320,11 +1333,6 @@
// Set final range position and clean up.

cleanupAfterInsertion( that );

// Make the final range selection.
range.select();

afterInsert( editable );
}

// Prepare range to its data deletion.
Expand Down
7 changes: 2 additions & 5 deletions plugins/widget/plugin.js
View file
Expand Up @@ -2626,18 +2626,15 @@
} );

// Listen with high priority to check widgets after data was inserted.
editor.on( 'insertText', checkNewWidgets, null, null, 999 );
editor.on( 'insertHtml', checkNewWidgets, null, null, 999 );

function checkNewWidgets() {
editor.on( 'afterInsert', function() {
editor.fire( 'lockSnapshot' );

// Init only new for performance reason.
// Focus inited if only widget was processed.
widgetsRepo.checkWidgets( { initOnlyNew: true, focusInited: processedWidgetOnly } );

editor.fire( 'unlockSnapshot' );
}
}, null, null, 999 );
}

// Helper for coordinating which widgets should be
Expand Down
50 changes: 17 additions & 33 deletions tests/core/editable/inserthtmlinto.js
View file
Expand Up @@ -5,15 +5,15 @@

bender.editor = {
config: {
allowedContent: 'div,p,b,i',
allowedContent: 'div p b i',
autoParagraph: false
}
};

var tools = bender.tools;

bender.test( {
checkInsertHtmlIntoRange: function( insertedHtml, range, expectedInsetionResult, expectedHtml ) {
checkInsertHtmlIntoRange: function( insertedHtml, range, expectedHtml ) {
var bot = this.editorBot,
editor = bot.editor,
editable = editor.editable(),
Expand All @@ -23,12 +23,10 @@
afterInsertCount++;
} );

assert.areSame( expectedInsetionResult, editable.insertHtmlIntoRange( insertedHtml, range ), 'Insertion should be ' + expectedInsetionResult + '.' );
assert.isInnerHtmlMatching( expectedHtml, tools.selection.getWithHtml( editor ), 'Editor content.' );
editable.insertHtmlIntoRange( insertedHtml, 'html', range );

if ( expectedInsetionResult ) {
assert.areSame( 1, afterInsertCount, 'afterInsert should be fired once.' );
};
assert.isInnerHtmlMatching( expectedHtml, editable.getHtml(), 'Editor content.' );
assert.areSame( 1, afterInsertCount, 'afterInsert should be fired once.' );
},

'test insertHtmlIntoRange - block': function() {
Expand All @@ -39,9 +37,7 @@
range.setStart( textNode, 2 );
range.setEnd( textNode, 4 );

this.checkInsertHtmlIntoRange(
'<div>div</div>', range,
true, '<p>fo</p><div>div</div><p>ar</p>' );
this.checkInsertHtmlIntoRange( '<div>div</div>', range, '<p>fodivar</p>' ); // Works the same way as insertHtml
},

'test insertHtmlIntoRange - inline': function() {
Expand All @@ -52,35 +48,29 @@
range.setStart( textNode, 2 );
range.setEnd( textNode, 4 );

this.checkInsertHtmlIntoRange(
'<b>b</b><i>i</i>', range,
true, '<p>fo<b>b</b><i>i</i>ar</p>' );
this.checkInsertHtmlIntoRange( '<b>b</b><i>i</i>', range, '<p>fo<b>b</b><i>i</i>ar</p>' );
},

'test insertHtmlIntoRange - inline, the same range': function() {
tools.setHtmlWithSelection( this.editor, '<p>fo[ob]ar</p>' );

var range = this.editor.createRange(),
textNode = this.editor.editable().getChild( [ 0, 0 ] );
range.setStart( textNode, 2 );
range.setEnd( textNode, 4 );
editable = this.editor.editable();
range.setStart( editable.getChild( [ 0, 0 ] ), 2 );
range.setEnd( editable.getChild( [ 0, 2 ] ), 0 );

this.checkInsertHtmlIntoRange(
'<b>b</b><i>i</i>', range,
true, '<p>fo<b>b</b><i>i</i>ar</p>' );
this.checkInsertHtmlIntoRange( '<b>b</b><i>i</i>', range, '<p>fo<b>b</b><i>i</i>ar</p>' );
},

'test insertHtmlIntoRange - collapsed': function() {
tools.setHtmlWithSelection( this.editor, '<p>foobar</p>' );

var range = this.editor.createRange(),
textNode = this.editor.editable().getChild( [ 0, 0 ] );
range.setStart( textNode, 2 );
range.setEnd( textNode, 4 );
range.setStart( textNode, 3 );
range.collapse();

this.checkInsertHtmlIntoRange(
'<b>b</b>', range,
true, '<p>foo<b>b</b>ba[]r</p>' );
this.checkInsertHtmlIntoRange( '<b>b</b>', range, '<p>foo<b>b</b>bar</p>' );
},

'test insertHtmlIntoRange - read-only': function() {
Expand All @@ -90,9 +80,7 @@
range.setStart( this.editor.document.getById( 'x' ).getFirst(), 3 );
range.collapse();

this.checkInsertHtmlIntoRange(
'<div>div</div>', range,
false, '<p>x</p><p contenteditable="false" id="x">foobar</p><p>y[]</p>' );
this.checkInsertHtmlIntoRange( '<div>div</div>', range, '<p>x</p><p contenteditable="false" id="x">foobar</p><p>y</p>' );
},

'test insertHtmlIntoRange - empty': function() {
Expand All @@ -102,9 +90,7 @@
range.setStart( this.editor.document.getById( 'x' ).getFirst(), 3 );
range.collapse();

this.checkInsertHtmlIntoRange(
'', range,
false, '<p>x</p><p contenteditable="false" id="x">foobar</p><p>y[]</p>' );
this.checkInsertHtmlIntoRange( '', range, '<p>x</p><p contenteditable="false" id="x">foobar</p><p>y</p>' );
},

'test insertHtmlIntoRange - removed content': function() {
Expand All @@ -114,9 +100,7 @@
range.setStart( this.editor.document.getById( 'x' ).getFirst(), 3 );
range.collapse();

this.checkInsertHtmlIntoRange(
'<img src="foo">', range,
false, '<p>x</p><p contenteditable="false" id="x">foobar</p><p>y[]</p>' );
this.checkInsertHtmlIntoRange( '<img src="foo">', range, '<p>x</p><p contenteditable="false" id="x">foobar</p><p>y</p>' );
}
} );

Expand Down
2 changes: 1 addition & 1 deletion tests/plugins/widget/widgetsintegration.js
View file
Expand Up @@ -259,7 +259,7 @@

listener.removeListener();

assert.areSame( 1, checked );
assert.areSame( 1, checked, 'checkWidgets' );
assert.isTrue( eventData.initOnlyNew, 'data.initOnlyNew was passed' );
assert.areSame( '<p>xfoox</p>', editorData, 'event was fired after data was inserted' );
},
Expand Down

0 comments on commit 4f040eb

Please sign in to comment.