Skip to content

Commit eab8e4b

Browse files
mlewandmlewand
committed
Merge branch 't/14856'
2 parents d0960ba + 7b82072 commit eab8e4b

File tree

5 files changed

+115
-109
lines changed

5 files changed

+115
-109
lines changed

‎CHANGES.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ New Features:
99

1010
Fixed Issues:
1111

12+
* [#14856](http://dev.ckeditor.com/ticket/14856): Fixed: Font size and font family reset each other when modified at certain positions.
1213
* [#13818](http://dev.ckeditor.com/ticket/13818): Fixed: Allow to group [Widget](http://ckeditor.com/addon/widget) [style definitions](http://docs.ckeditor.com/#!/guide/dev_styles-section-widget-styles), so applying one style disables the other.
1314
* [#16745](http://dev.ckeditor.com/ticket/16745): [Edge] Fixed: List items are lost when pasted from word.
1415
* [#16682](http://dev.ckeditor.com/ticket/16682): [Edge] Fixed: List gets pasted as a set of paragraphs. Added [`config.pasteFromWord_heuristicsEdgeList`](http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-pasteFromWord_heuristicsEdgeList) option.

‎plugins/font/plugin.js

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -137,11 +137,10 @@
137137
matching.remove();
138138
range.moveToBookmark( bm );
139139

140-
// If we are at the boundary of the style element, just move out.
141-
} else if ( startBoundary ) {
142-
range.moveToPosition( matching, CKEDITOR.POSITION_BEFORE_START );
143-
} else if ( endBoundary ) {
144-
range.moveToPosition( matching, CKEDITOR.POSITION_AFTER_END );
140+
// If we are at the boundary of the style element, move out and copy nested styles/elements.
141+
} else if ( startBoundary || endBoundary ) {
142+
range.moveToPosition( matching, startBoundary ? CKEDITOR.POSITION_BEFORE_START : CKEDITOR.POSITION_AFTER_END );
143+
cloneSubtreeIntoRange( range, path.elements.slice(), matching );
145144
} else {
146145
// Split the element and clone the elements that were in the path
147146
// (between the startContainer and the matching element)

‎tests/plugins/font/font.js

Lines changed: 74 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -51,116 +51,64 @@
5151
var bot = this.editorBot;
5252

5353
bender.tools.selection.setWithHtml( bot.editor, '<p>{foo}</p>' );
54-
bot.combo( 'FontSize', function( combo ) {
55-
combo.onClick( 48 );
56-
assert.isInnerHtmlMatching( '<p><span style="font-size:48px">foo</span>@</p>',
57-
bot.editor.editable().getHtml(), htmlMatchingOpts );
58-
} );
54+
this.assertCombo( 'FontSize', 48, false, bot, '<p><span style="font-size:48px">foo</span>@</p>' );
5955
},
6056

6157
'test apply font size over another font size (collapsed selection)': function() {
62-
var bot = this.editorBot,
63-
editor = bot.editor;
58+
var bot = this.editorBot;
6459

6560
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:48px">f{}oo</span>x</p>' );
66-
bot.combo( 'FontSize', function( combo ) {
67-
combo.onClick( 24 );
68-
69-
this.wait( function() {
70-
// We lose (dunno where) the empty span on IE8, so let's insert something.
71-
editor.insertText( 'bar' );
72-
assert.isInnerHtmlMatching(
73-
'<p>x<span style="font-size:48px">f</span><span style="font-size:24px">bar</span><span style="font-size:48px">oo</span>x@</p>',
74-
editor.editable().getHtml(), htmlMatchingOpts );
75-
}, 0 );
76-
} );
61+
this.assertCombo( 'FontSize', 24, true, bot,
62+
'<p>x<span style="font-size:48px">f</span><span style="font-size:24px">bar</span><span style="font-size:48px">oo</span>x@</p>' );
7763
},
7864

7965
'test apply font size over another font size (collapsed selection in empty span)': function() {
80-
var bot = this.editorBot,
81-
editor = bot.editor;
66+
var bot = this.editorBot;
8267

8368
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:48px"><em>[]</em></span>x</p>' );
84-
bot.combo( 'FontSize', function( combo ) {
85-
combo.onClick( 24 );
86-
87-
this.wait( function() {
88-
// We lose (dunno where) the empty span on IE8, so let's insert something.
89-
editor.insertText( 'bar' );
90-
assert.isInnerHtmlMatching( '<p>x<em><span style="font-size:24px">bar</span></em>x@</p>', editor.editable().getHtml(), htmlMatchingOpts );
91-
assert.areSame( 1, editor.editable().find( 'span' ).count(), 'there is only one span in the editable' );
92-
}, 0 );
93-
} );
69+
this.assertCombo( 'FontSize', 24, true, bot,
70+
'<p>x<em><span style="font-size:24px">bar</span></em>x@</p>',
71+
function( bot ) {
72+
assert.areSame( 1, bot.editor.editable().find( 'span' ).count(), 'there is only one span in the editable' );
73+
} );
9474
},
9575

9676
'test apply font size over another font size (collapsed selection at the existing span boundary)': function() {
97-
var bot = this.editorBot,
98-
editor = bot.editor;
77+
var bot = this.editorBot;
9978

10079
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:48px">{}foo</span>x</p>' );
101-
bot.combo( 'FontSize', function( combo ) {
102-
combo.onClick( 24 );
103-
104-
this.wait( function() {
105-
// We lose (dunno where) the empty span on IE8, so let's insert something.
106-
editor.insertText( 'bar' );
107-
assert.isInnerHtmlMatching(
108-
'<p>x<span style="font-size:24px">bar</span><span style="font-size:48px">foo</span>x@</p>',
109-
editor.editable().getHtml(), htmlMatchingOpts );
110-
}, 0 );
111-
} );
80+
this.assertCombo( 'FontSize', 24, true, bot,
81+
'<p>x<span style="font-size:24px">bar</span><span style="font-size:48px">foo</span>x@</p>' );
11282
},
11383

11484
'test apply font size over another font size (text selection)': function() {
115-
var bot = this.editorBot,
116-
editor = bot.editor;
85+
var bot = this.editorBot;
11786

11887
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:48px">f{o}o</span>x</p>' );
119-
bot.combo( 'FontSize', function( combo ) {
120-
combo.onClick( 24 );
121-
assert.isInnerHtmlMatching(
122-
'<p>x<span style="font-size:48px">f</span><span style="font-size:24px">o</span><span style="font-size:48px">o</span>x@</p>',
123-
editor.editable().getHtml(), htmlMatchingOpts );
124-
} );
88+
this.assertCombo( 'FontSize', 24, false, bot,
89+
'<p>x<span style="font-size:48px">f</span><span style="font-size:24px">o</span><span style="font-size:48px">o</span>x@</p>' );
12590
},
12691

12792
'test apply font size over another font size (the existing span selection)': function() {
128-
var bot = this.editorBot,
129-
editor = bot.editor;
93+
var bot = this.editorBot;
13094

13195
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:48px">{foo}</span>x</p>' );
132-
bot.combo( 'FontSize', function( combo ) {
133-
combo.onClick( 24 );
134-
assert.isInnerHtmlMatching(
135-
'<p>x<span style="font-size:24px">foo</span>x@</p>',
136-
editor.editable().getHtml(), htmlMatchingOpts );
137-
} );
96+
this.assertCombo( 'FontSize', 24, false, bot, '<p>x<span style="font-size:24px">foo</span>x@</p>' );
13897
},
13998

14099
'test apply font size over another font size (selection containing other span)': function() {
141-
var bot = this.editorBot,
142-
editor = bot.editor;
100+
var bot = this.editorBot;
143101

144102
bender.tools.selection.setWithHtml( bot.editor, '<p>x{f<span style="font-size:48px">o</span>o}x</p>' );
145-
bot.combo( 'FontSize', function( combo ) {
146-
combo.onClick( 24 );
147-
assert.isInnerHtmlMatching(
148-
'<p>x<span style="font-size:24px">foo</span>x@</p>',
149-
editor.editable().getHtml(), htmlMatchingOpts );
150-
} );
103+
this.assertCombo( 'FontSize', 24, false, bot, '<p>x<span style="font-size:24px">foo</span>x@</p>' );
151104
},
152105

153106
'test apply font size over another font size (deeply nested text selection)': function() {
154-
var bot = this.editorBot,
155-
editor = bot.editor;
107+
var bot = this.editorBot;
156108

157109
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:48px"><em>f{o}o</em></span>x</p>' );
158-
bot.combo( 'FontSize', function( combo ) {
159-
combo.onClick( 24 );
160-
assert.isInnerHtmlMatching(
161-
'<p>x<span style="font-size:48px"><em>f</em></span><span style="font-size:24px"><em>o</em></span><span style="font-size:48px"><em>o</em></span>x@</p>',
162-
editor.editable().getHtml(), htmlMatchingOpts );
163-
} );
110+
this.assertCombo( 'FontSize', 24, false, bot,
111+
'<p>x<span style="font-size:48px"><em>f</em></span><span style="font-size:24px"><em>o</em></span><span style="font-size:48px"><em>o</em></span>x@</p>' );
164112
},
165113

166114
'test apply font size over another font size (deeply nested collapsed selection)': function() {
@@ -169,47 +117,69 @@
169117
assert.ignore();
170118
}
171119

172-
var bot = this.editorBot,
173-
editor = bot.editor;
120+
var bot = this.editorBot;
174121

175122
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:48px"><em>f<u class="y">{}o</u>o</em></span>x</p>' );
176-
bot.combo( 'FontSize', function( combo ) {
177-
combo.onClick( 24 );
178-
179-
this.wait( function() {
180-
editor.insertText( 'bar' );
181-
assert.isInnerHtmlMatching(
182-
'<p>x<span style="font-size:48px"><em>f</em></span>' +
183-
'<em><u class="y"><span style="font-size:24px">bar</span></u></em>' +
184-
'<span style="font-size:48px"><em><u class="y">o</u>o</em></span>x@</p>',
185-
editor.editable().getHtml(), htmlMatchingOpts );
186-
}, 0 );
187-
} );
123+
this.assertCombo( 'FontSize', 24, true, bot,
124+
'<p>x<span style="font-size:48px"><em>f</em></span><em><u class="y"><span style="font-size:24px">bar</span></u></em>' +
125+
'<span style="font-size:48px"><em><u class="y">o</u>o</em></span>x@</p>' );
188126
},
189127

190128
'test apply font size over font family (check possible false positive match)': function() {
191-
var bot = this.editorBot,
192-
editor = bot.editor;
129+
var bot = this.editorBot;
193130

194131
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="' + ffArial + '">f{o}o</span>x</p>' );
195-
bot.combo( 'FontSize', function( combo ) {
196-
combo.onClick( 24 );
197-
assert.isInnerHtmlMatching(
198-
'<p>x<span style="' + ffArial + '">f<span style="font-size:24px">o</span>o</span>x@</p>',
199-
editor.editable().getHtml(), htmlMatchingOpts );
200-
} );
132+
this.assertCombo( 'FontSize', 24, false, bot, '<p>x<span style="' + ffArial + '">f<span style="font-size:24px">o</span>o</span>x@</p>' );
201133
},
202134

203135
'test apply font family over another font family (text selection)': function() {
204-
var bot = this.editorBot,
205-
editor = bot.editor;
136+
var bot = this.editorBot;
206137

207138
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="' + ffArial + '">f{o}o</span>x</p>' );
208-
bot.combo( 'Font', function( combo ) {
209-
combo.onClick( 'Comic Sans MS' );
210-
assert.isInnerHtmlMatching(
211-
'<p>x<span style="' + ffArial + '">f</span><span style="' + ffCS + '">o</span><span style="' + ffArial + '">o</span>x@</p>',
212-
editor.editable().getHtml(), htmlMatchingOpts );
139+
this.assertCombo( 'Font', 'Comic Sans MS', false, bot,
140+
'<p>x<span style="' + ffArial + '">f</span><span style="' + ffCS + '">o</span><span style="' + ffArial + '">o</span>x@</p>' );
141+
},
142+
143+
// #14856
144+
'test reapply font family on the beginning (collapsed selection)': function() {
145+
if ( CKEDITOR.env.safari ) {
146+
assert.ignore();
147+
}
148+
149+
var bot = this.editorBot;
150+
151+
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="' + ffArial + '"><em>{}foo</em></span>x</p>' );
152+
this.assertCombo( 'Font', 'Comic Sans MS', true, bot,
153+
'<p>x<em><span style="' + ffCS + '">bar</span></em><span style="' + ffArial + '"><em>foo</em></span>x@</p>' );
154+
},
155+
156+
'test reapply font family in the middle (collapsed selection)': function() {
157+
var bot = this.editorBot;
158+
159+
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="' + ffArial + '"><em>fo{}o</em></span>x</p>' );
160+
this.assertCombo( 'Font', 'Comic Sans MS', true, bot,
161+
'<p>x<span style="' + ffArial + '"><em>fo</em></span><em><span style="' + ffCS + '">bar</span></em>' +
162+
'<span style="' + ffArial + '"><em>o</em></span>x@</p>' );
163+
},
164+
165+
'test reapply font size on the end (collapsed selection)': function() {
166+
var bot = this.editorBot;
167+
168+
bender.tools.selection.setWithHtml( bot.editor, '<p>x<span style="font-size:12px"><em>foo{}</em></span>x</p>' );
169+
this.assertCombo( 'FontSize', 24, true, bot,
170+
'<p>x<span style="font-size:12px"><em>foo</em></span><em><span style="font-size:24px">bar</span></em>x@</p>' );
171+
},
172+
173+
assertCombo: function( comboName, comboValue, collapsed, bot, resultHtml, callback ) {
174+
bot.combo( comboName, function( combo ) {
175+
combo.onClick( comboValue );
176+
177+
this.wait( function() {
178+
// The empty span from collapsed selection is lost on FF and IE8, insert something to prevent that.
179+
collapsed && bot.editor.insertText( 'bar' );
180+
assert.isInnerHtmlMatching( resultHtml, bot.editor.editable().getHtml(), htmlMatchingOpts );
181+
callback && callback( bot );
182+
}, 0 );
213183
} );
214184
}
215185
} );

‎tests/plugins/font/manual/reapplystyles.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<div id="editor">
2+
<p><span style="font-family:Georgia,serif;"><span style="font-size:24px;"><strong><em>This is styled text</em></strong></span></span></p>
3+
</div>
4+
5+
<script>
6+
CKEDITOR.replace( 'editor', { height: 400 } );
7+
</script>

‎tests/plugins/font/manual/reapplystyles.md

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
@bender-tags: 4.6.2, tc, 14856
2+
@bender-ui: collapsed
3+
@bender-ckeditor-plugins: wysiwygarea, toolbar, font, enterkey, elementspath, basicstyles
4+
5+
## Scenario 1
6+
7+
1. Place caret at the beginning of the text.
8+
1. Change font family using Font dropdown.
9+
1. Type something.
10+
11+
## Scenario 2
12+
13+
1. Place caret in the middle of the text.
14+
1. Change font family using Font dropdown.
15+
1. Type something.
16+
17+
## Scenario 3
18+
19+
1. Place caret at the end of the text so that existing styles are recognized.
20+
1. Change font size using Size dropdown.
21+
1. Type something.
22+
23+
### Expected:
24+
Styles are preserved and typed text is styled in the same way as the rest of the text (with the exception of the styles that were changed).
25+
26+
### Unexpected:
27+
Some styles are lost after changing font family/size. Typed text is styled differently
28+
(except the one changed style) than the rest of the text.
29+

0 commit comments

Comments
 (0)