From 28e338e2a08b2e0c6139ce8ba66eedea33848f34 Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Thu, 6 Dec 2018 13:29:43 +0100 Subject: [PATCH 01/22] Tests: added test case. --- tests/plugins/emoji/basic.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/tests/plugins/emoji/basic.js b/tests/plugins/emoji/basic.js index 67a52a2f958..a47554b1e84 100644 --- a/tests/plugins/emoji/basic.js +++ b/tests/plugins/emoji/basic.js @@ -212,6 +212,19 @@ arrayAssert.itemsAreSame( expected, actual ); assert.areSame( '😻 :smiling_cat_face_with_heart-eyes:', autocomplete.view.element.getChild( 0 ).getText(), 'First element in view should start from "smiling".' ); } ); + }, + + // (#2583) + 'test emoji autocomplete panel displays name': function( editor, bot ) { + emojiTools.runAfterInstanceReady( editor, bot, function( editor, bot ) { + bot.setHtmlWithSelection( '

foo :collision:^

' ); + editor.editable().fire( 'keyup', new CKEDITOR.dom.event( {} ) ); + + var element = CKEDITOR.document.findOne( '.cke_emoji-suggestion_item' ); + + assert.areEqual( element.$.innerText, 'πŸ’₯ collision' ); + + } ); } }; From 4ed806dd7a87d917decf952c2d88ec27a61d341b Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Thu, 6 Dec 2018 13:29:51 +0100 Subject: [PATCH 02/22] Tests: added manual test. --- tests/plugins/emoji/manual/emojimatchlabel.html | 12 ++++++++++++ tests/plugins/emoji/manual/emojimatchlabel.md | 15 +++++++++++++++ 2 files changed, 27 insertions(+) create mode 100644 tests/plugins/emoji/manual/emojimatchlabel.html create mode 100644 tests/plugins/emoji/manual/emojimatchlabel.md diff --git a/tests/plugins/emoji/manual/emojimatchlabel.html b/tests/plugins/emoji/manual/emojimatchlabel.html new file mode 100644 index 00000000000..ced478af228 --- /dev/null +++ b/tests/plugins/emoji/manual/emojimatchlabel.html @@ -0,0 +1,12 @@ +

Classic editor

+ + + + diff --git a/tests/plugins/emoji/manual/emojimatchlabel.md b/tests/plugins/emoji/manual/emojimatchlabel.md new file mode 100644 index 00000000000..9a529bfbad8 --- /dev/null +++ b/tests/plugins/emoji/manual/emojimatchlabel.md @@ -0,0 +1,15 @@ +@bender-tags: 4.11.2, bug, emoji, 2583 +@bender-ckeditor-plugins: wysiwygarea, toolbar, emoji +@bender-ui: collapsed +@bender-include: ../_helpers/tools.js + +1. Focus editor. +1. Type `:collision:` + +## Expected: + +Panel appears with match: `πŸ’₯ collision` + +## Unexpected: + +Panel appears with match: `πŸ’₯ :collision:` From c63bb93c29525a7a4da10f143f66387dd091bafa Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Thu, 6 Dec 2018 13:34:38 +0100 Subject: [PATCH 03/22] Tests: added manual test. --- plugins/emoji/plugin.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/plugins/emoji/plugin.js b/plugins/emoji/plugin.js index 05e1ec019a8..8731e76a708 100644 --- a/plugins/emoji/plugin.js +++ b/plugins/emoji/plugin.js @@ -599,7 +599,7 @@ editor._.emoji.autocomplete = new CKEDITOR.plugins.autocomplete( editor, { textTestCallback: getTextTestCallback(), dataCallback: dataCallback, - itemTemplate: '
  • {symbol} {id}
  • ', + itemTemplate: '
  • {symbol} {name}
  • ', outputTemplate: '{symbol}' } ); } @@ -641,6 +641,11 @@ return a.id > b.id ? 1 : -1; } } ); + data = arrTools.map( data, function( item ) { + return CKEDITOR.tools.extend( item, { + name: htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ) + } ); + } ); callback( data ); } } ); From b41e529a371f4f4003ad5461a26f34f581efead1 Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Thu, 6 Dec 2018 13:35:28 +0100 Subject: [PATCH 04/22] Emoji: autocomplete panel will show emoji name instead of emoji id. --- plugins/emoji/plugin.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/plugins/emoji/plugin.js b/plugins/emoji/plugin.js index 8731e76a708..9ffafe738d3 100644 --- a/plugins/emoji/plugin.js +++ b/plugins/emoji/plugin.js @@ -382,7 +382,7 @@ return acc + emojiTpl.output( { symbol: htmlEncode( item.symbol ), id: htmlEncode( item.id ), - name: htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ), + name: getEmojiName( item ), group: htmlEncode( item.group ), keywords: htmlEncode( ( item.keywords || [] ).join( ',' ) ) } ); @@ -643,7 +643,7 @@ } ); data = arrTools.map( data, function( item ) { return CKEDITOR.tools.extend( item, { - name: htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ) + name: getEmojiName( item ) } ); } ); callback( data ); @@ -662,6 +662,10 @@ } } ); + + function getEmojiName( item ) { + return htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ); + } } )(); /** From c411f0b9801469b86078cbfc16b72d93d298a56f Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Tue, 18 Dec 2018 14:25:08 +0100 Subject: [PATCH 05/22] Tests: corrected tags. --- tests/plugins/emoji/manual/emojimatchlabel.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/plugins/emoji/manual/emojimatchlabel.md b/tests/plugins/emoji/manual/emojimatchlabel.md index 9a529bfbad8..9f337ef62c1 100644 --- a/tests/plugins/emoji/manual/emojimatchlabel.md +++ b/tests/plugins/emoji/manual/emojimatchlabel.md @@ -1,4 +1,4 @@ -@bender-tags: 4.11.2, bug, emoji, 2583 +@bender-tags: 4.12.0, feature, emoji, 2583 @bender-ckeditor-plugins: wysiwygarea, toolbar, emoji @bender-ui: collapsed @bender-include: ../_helpers/tools.js From 59b8046efabcc94f8171e92d92df22d2d3e90fff Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Tue, 18 Dec 2018 15:35:07 +0100 Subject: [PATCH 06/22] Tests: added test cases for emoji names cache. --- tests/plugins/emoji/basic.js | 15 +++++++++++++++ tests/plugins/emoji/dropdown.js | 16 ++++++++++++++++ 2 files changed, 31 insertions(+) diff --git a/tests/plugins/emoji/basic.js b/tests/plugins/emoji/basic.js index a47554b1e84..9320f6c44ce 100644 --- a/tests/plugins/emoji/basic.js +++ b/tests/plugins/emoji/basic.js @@ -96,6 +96,21 @@ } }, + // This test should be on top of test suite, cause other tests will cache emojis (#2583). + 'test emoji names cache': function( editor, bot ) { + bot.setHtmlWithSelection( '

    foo :collision:^

    ' ); + + var collision = CKEDITOR.tools.array.filter( editor._.emoji.list, function( item ) { + return item.id === ':collision:'; + } )[ 0 ]; + + assert.isUndefined( collision._name, 'Emoji name should be undefined.' ); + + editor.editable().fire( 'keyup', new CKEDITOR.dom.event( {} ) ); + + assert.areEqual( 'collision', collision._name, 'Emoji name should be cached.' ); + }, + 'test emoji objects are added to editor': function( editor ) { emojiTools.runAfterInstanceReady( editor, null, function( editor ) { assert.isObject( editor._.emoji, 'Emoji variable doesn\' exists' ); diff --git a/tests/plugins/emoji/dropdown.js b/tests/plugins/emoji/dropdown.js index 19cccd9c3c6..33862173559 100644 --- a/tests/plugins/emoji/dropdown.js +++ b/tests/plugins/emoji/dropdown.js @@ -28,6 +28,22 @@ setUp: function() { bender.tools.ignoreUnsupportedEnvironment( 'emoji' ); }, + + // This test should be on top of test suite, cause other tests will cache emojis (#2583). + 'test emoji names cache': function() { + var bot = this.editorBot, + collision = CKEDITOR.tools.array.filter( bot.editor._.emoji.list, function( item ) { + return item.id === ':collision:'; + } )[ 0 ]; + + assert.isUndefined( collision._name, 'Emoji name should be undefined.' ); + + bot.panel( 'EmojiPanel', function( panel ) { + panel.hide(); + assert.areEqual( 'collision', collision._name, 'Emoji name should be cached.' ); + } ); + }, + 'test emoji dropdown has proper components': function() { var bot = this.editorBot; From 1a10e1c1aa556f1773e8199794b067fa89894093 Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Tue, 18 Dec 2018 15:11:36 +0100 Subject: [PATCH 07/22] Cached emoji names. Renamed getEmojiName to getEncodedName. --- plugins/emoji/plugin.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/plugins/emoji/plugin.js b/plugins/emoji/plugin.js index 9ffafe738d3..0abe0ae7e09 100644 --- a/plugins/emoji/plugin.js +++ b/plugins/emoji/plugin.js @@ -382,7 +382,7 @@ return acc + emojiTpl.output( { symbol: htmlEncode( item.symbol ), id: htmlEncode( item.id ), - name: getEmojiName( item ), + name: getEncodedName( item ), group: htmlEncode( item.group ), keywords: htmlEncode( ( item.keywords || [] ).join( ',' ) ) } ); @@ -642,8 +642,8 @@ } } ); data = arrTools.map( data, function( item ) { - return CKEDITOR.tools.extend( item, { - name: getEmojiName( item ) + return CKEDITOR.tools.extend( {}, item, { + name: getEncodedName( item ) } ); } ); callback( data ); @@ -663,8 +663,9 @@ } } ); - function getEmojiName( item ) { - return htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ); + function getEncodedName( item ) { + item._name = item._name || htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ); + return item._name; } } )(); From 1bcf633ba73b8071fe0eda56d5bff998492989b5 Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Tue, 18 Dec 2018 17:44:22 +0100 Subject: [PATCH 08/22] Tests: updated test steps, removed redundant editor name. --- tests/plugins/emoji/manual/emojimatchlabel.html | 8 +++----- tests/plugins/emoji/manual/emojimatchlabel.md | 4 ++-- 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/tests/plugins/emoji/manual/emojimatchlabel.html b/tests/plugins/emoji/manual/emojimatchlabel.html index ced478af228..67b860b6eca 100644 --- a/tests/plugins/emoji/manual/emojimatchlabel.html +++ b/tests/plugins/emoji/manual/emojimatchlabel.html @@ -1,12 +1,10 @@ -

    Classic editor

    - - diff --git a/tests/plugins/emoji/manual/emojimatchlabel.md b/tests/plugins/emoji/manual/emojimatchlabel.md index 9f337ef62c1..e0f5f2d90fe 100644 --- a/tests/plugins/emoji/manual/emojimatchlabel.md +++ b/tests/plugins/emoji/manual/emojimatchlabel.md @@ -8,8 +8,8 @@ ## Expected: -Panel appears with match: `πŸ’₯ collision` +Emoji suggestion box appears with match: `πŸ’₯ collision` ## Unexpected: -Panel appears with match: `πŸ’₯ :collision:` +Emoji suggestion box appears with match: `πŸ’₯ :collision:` From 07812c4ae1d7a7a5decd001a56d7cec14b22f7ce Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Tue, 18 Dec 2018 17:44:30 +0100 Subject: [PATCH 09/22] Tests: added manual test. --- tests/plugins/emoji/manual/font.html | 10 ++++++++++ tests/plugins/emoji/manual/font.md | 15 +++++++++++++++ 2 files changed, 25 insertions(+) create mode 100644 tests/plugins/emoji/manual/font.html create mode 100644 tests/plugins/emoji/manual/font.md diff --git a/tests/plugins/emoji/manual/font.html b/tests/plugins/emoji/manual/font.html new file mode 100644 index 00000000000..67b860b6eca --- /dev/null +++ b/tests/plugins/emoji/manual/font.html @@ -0,0 +1,10 @@ + + + diff --git a/tests/plugins/emoji/manual/font.md b/tests/plugins/emoji/manual/font.md new file mode 100644 index 00000000000..0e63cb1b8d1 --- /dev/null +++ b/tests/plugins/emoji/manual/font.md @@ -0,0 +1,15 @@ +@bender-tags: 4.12.0, feature, emoji, 2583 +@bender-ckeditor-plugins: wysiwygarea, toolbar, emoji +@bender-ui: collapsed +@bender-include: ../_helpers/tools.js + +1. Focus editor. +1. Type `:smilling_face:` + +## Expected: + +Nice colored emoji is displayed in emoji suggestion box: ☺ + +## Unexpected: + +Ugly black and white smiley is displayed in emoji suggestion box: ☺ From 4598af0a040a0485f465be7f99e203ca2ce089da Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Tue, 18 Dec 2018 17:45:21 +0100 Subject: [PATCH 10/22] Moved emoji preview to span, added styles to display it correctly. --- plugins/emoji/plugin.js | 2 +- plugins/emoji/skins/default.css | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/plugins/emoji/plugin.js b/plugins/emoji/plugin.js index 0abe0ae7e09..d00736298c6 100644 --- a/plugins/emoji/plugin.js +++ b/plugins/emoji/plugin.js @@ -599,7 +599,7 @@ editor._.emoji.autocomplete = new CKEDITOR.plugins.autocomplete( editor, { textTestCallback: getTextTestCallback(), dataCallback: dataCallback, - itemTemplate: '
  • {symbol} {name}
  • ', + itemTemplate: '
  • {symbol} {name}
  • ', outputTemplate: '{symbol}' } ); } diff --git a/plugins/emoji/skins/default.css b/plugins/emoji/skins/default.css index 5d3e80ae625..c228623fd48 100644 --- a/plugins/emoji/skins/default.css +++ b/plugins/emoji/skins/default.css @@ -10,6 +10,10 @@ font-family: sans-serif, Arial, Verdana, "Trebuchet MS", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } +.cke_emoji-suggestion_item span { + font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; +} + .cke_emoji-panel { width: 310px; height: 300px; From 4f29168faeaec0c1e39016715a286f67c5815c4b Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Wed, 19 Dec 2018 17:42:49 +0100 Subject: [PATCH 11/22] Tests: removed EmojiPanel button. --- tests/plugins/emoji/manual/emojimatchlabel.html | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/tests/plugins/emoji/manual/emojimatchlabel.html b/tests/plugins/emoji/manual/emojimatchlabel.html index 67b860b6eca..222f7f5604c 100644 --- a/tests/plugins/emoji/manual/emojimatchlabel.html +++ b/tests/plugins/emoji/manual/emojimatchlabel.html @@ -6,5 +6,7 @@ if ( emojiTools.notSupportedEnvironment) { bender.ignore(); } - CKEDITOR.replace( 'editor' ); + CKEDITOR.replace( 'editor', { + removeButtons: 'EmojiPanel' + } ); From 3e40cf42a129f45b2c9cc9eea58a14ba5112181d Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Wed, 19 Dec 2018 17:43:16 +0100 Subject: [PATCH 12/22] Tests: changed element.$.innerText to element.getTexT() in assertion. --- tests/plugins/emoji/basic.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/tests/plugins/emoji/basic.js b/tests/plugins/emoji/basic.js index 9320f6c44ce..187280df922 100644 --- a/tests/plugins/emoji/basic.js +++ b/tests/plugins/emoji/basic.js @@ -237,8 +237,7 @@ var element = CKEDITOR.document.findOne( '.cke_emoji-suggestion_item' ); - assert.areEqual( element.$.innerText, 'πŸ’₯ collision' ); - + assert.areEqual( element.getText(), 'πŸ’₯ collision' ); } ); } }; From e15d209aa21a5676b333f2cd2ec76a9e6c0e0e74 Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Wed, 19 Dec 2018 17:45:22 +0100 Subject: [PATCH 13/22] Reworked getEncodedName to addEncodedName, now function only adds missing _name property, but doesn't return anything. --- plugins/emoji/plugin.js | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/plugins/emoji/plugin.js b/plugins/emoji/plugin.js index d00736298c6..41846a93e51 100644 --- a/plugins/emoji/plugin.js +++ b/plugins/emoji/plugin.js @@ -379,10 +379,11 @@ return arrTools.reduce( items, function( acc, item ) { + addEncodedName( item ); return acc + emojiTpl.output( { symbol: htmlEncode( item.symbol ), id: htmlEncode( item.id ), - name: getEncodedName( item ), + name: item._name, group: htmlEncode( item.group ), keywords: htmlEncode( ( item.keywords || [] ).join( ',' ) ) } ); @@ -599,7 +600,7 @@ editor._.emoji.autocomplete = new CKEDITOR.plugins.autocomplete( editor, { textTestCallback: getTextTestCallback(), dataCallback: dataCallback, - itemTemplate: '
  • {symbol} {name}
  • ', + itemTemplate: '
  • {symbol} {_name}
  • ', outputTemplate: '{symbol}' } ); } @@ -642,9 +643,8 @@ } } ); data = arrTools.map( data, function( item ) { - return CKEDITOR.tools.extend( {}, item, { - name: getEncodedName( item ) - } ); + addEncodedName( item ); + return item; } ); callback( data ); } @@ -663,9 +663,10 @@ } } ); - function getEncodedName( item ) { - item._name = item._name || htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ); - return item._name; + function addEncodedName( item ) { + if ( !item._name ) { + item._name = htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ); + } } } )(); From 9a2e4fed3c4e3e8ec9e42369deb6dbf88ca74441 Mon Sep 17 00:00:00 2001 From: Kajetan Litwinowicz Date: Thu, 10 Jan 2019 14:38:23 +0100 Subject: [PATCH 14/22] Tests: corrected codestyle. --- tests/plugins/emoji/manual/emojimatchlabel.html | 2 +- tests/plugins/emoji/manual/font.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/plugins/emoji/manual/emojimatchlabel.html b/tests/plugins/emoji/manual/emojimatchlabel.html index 222f7f5604c..a5fb1bfe9b9 100644 --- a/tests/plugins/emoji/manual/emojimatchlabel.html +++ b/tests/plugins/emoji/manual/emojimatchlabel.html @@ -3,7 +3,7 @@ diff --git a/tests/plugins/emoji/manual/font.md b/tests/plugins/emoji/manual/font.md index 0e63cb1b8d1..bb26e1a5993 100644 --- a/tests/plugins/emoji/manual/font.md +++ b/tests/plugins/emoji/manual/font.md @@ -1,10 +1,10 @@ -@bender-tags: 4.12.0, feature, emoji, 2583 +@bender-tags: 4.14.0, feature, emoji, 2583 @bender-ckeditor-plugins: wysiwygarea, toolbar, emoji @bender-ui: collapsed @bender-include: ../_helpers/tools.js 1. Focus editor. -1. Type `:smilling_face:` +1. Type `:smiling_face:` ## Expected: From a6fb8e864e9c979fc359f06432217ce6cede646a Mon Sep 17 00:00:00 2001 From: Jacek Bogdanski Date: Thu, 14 Nov 2019 12:01:43 +0100 Subject: [PATCH 16/22] Refactoring. --- plugins/emoji/plugin.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/plugins/emoji/plugin.js b/plugins/emoji/plugin.js index 41846a93e51..135e260d362 100644 --- a/plugins/emoji/plugin.js +++ b/plugins/emoji/plugin.js @@ -642,10 +642,7 @@ return a.id > b.id ? 1 : -1; } } ); - data = arrTools.map( data, function( item ) { - addEncodedName( item ); - return item; - } ); + data = arrTools.map( data, addEncodedName ); callback( data ); } } ); @@ -667,6 +664,7 @@ if ( !item._name ) { item._name = htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ); } + return item; } } )(); From 42d9604e2dbc27c9dee0a62bbec6ba24eebc6759 Mon Sep 17 00:00:00 2001 From: Jacek Bogdanski Date: Thu, 14 Nov 2019 12:11:31 +0100 Subject: [PATCH 17/22] Updated test to use name instead of ID. --- tests/plugins/emoji/basic.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/plugins/emoji/basic.js b/tests/plugins/emoji/basic.js index 187280df922..bcadc2dd145 100644 --- a/tests/plugins/emoji/basic.js +++ b/tests/plugins/emoji/basic.js @@ -225,7 +225,7 @@ } ); arrayAssert.itemsAreSame( expected, actual ); - assert.areSame( '😻 :smiling_cat_face_with_heart-eyes:', autocomplete.view.element.getChild( 0 ).getText(), 'First element in view should start from "smiling".' ); + assert.areSame( '😻 smiling cat face with heart-eyes', autocomplete.view.element.getChild( 0 ).getText(), 'First element in view should start from "smiling".' ); } ); }, From 93059e97da5a9aacd09fd897da808bb562cd94b6 Mon Sep 17 00:00:00 2001 From: Jacek Bogdanski Date: Fri, 15 Nov 2019 10:36:20 +0100 Subject: [PATCH 18/22] Updated emoji name. --- plugins/emoji/plugin.js | 8 ++++---- tests/plugins/emoji/basic.js | 10 +++++----- tests/plugins/emoji/dropdown.js | 2 +- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/plugins/emoji/plugin.js b/plugins/emoji/plugin.js index 135e260d362..59bb59df276 100644 --- a/plugins/emoji/plugin.js +++ b/plugins/emoji/plugin.js @@ -383,7 +383,7 @@ return acc + emojiTpl.output( { symbol: htmlEncode( item.symbol ), id: htmlEncode( item.id ), - name: item._name, + name: item.name, group: htmlEncode( item.group ), keywords: htmlEncode( ( item.keywords || [] ).join( ',' ) ) } ); @@ -600,7 +600,7 @@ editor._.emoji.autocomplete = new CKEDITOR.plugins.autocomplete( editor, { textTestCallback: getTextTestCallback(), dataCallback: dataCallback, - itemTemplate: '
  • {symbol} {_name}
  • ', + itemTemplate: '
  • {symbol} {name}
  • ', outputTemplate: '{symbol}' } ); } @@ -661,8 +661,8 @@ } ); function addEncodedName( item ) { - if ( !item._name ) { - item._name = htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ).replace( /_/g, ' ' ) ); + if ( !item.name ) { + item.name = htmlEncode( item.id.replace( /::.*$/, ':' ).replace( /^:|:$/g, '' ) ); } return item; } diff --git a/tests/plugins/emoji/basic.js b/tests/plugins/emoji/basic.js index bcadc2dd145..5ed69123712 100644 --- a/tests/plugins/emoji/basic.js +++ b/tests/plugins/emoji/basic.js @@ -104,11 +104,11 @@ return item.id === ':collision:'; } )[ 0 ]; - assert.isUndefined( collision._name, 'Emoji name should be undefined.' ); + assert.isUndefined( collision.name, 'Emoji name should be undefined.' ); editor.editable().fire( 'keyup', new CKEDITOR.dom.event( {} ) ); - assert.areEqual( 'collision', collision._name, 'Emoji name should be cached.' ); + assert.areEqual( 'collision', collision.name, 'Emoji name should be cached.' ); }, 'test emoji objects are added to editor': function( editor ) { @@ -225,19 +225,19 @@ } ); arrayAssert.itemsAreSame( expected, actual ); - assert.areSame( '😻 smiling cat face with heart-eyes', autocomplete.view.element.getChild( 0 ).getText(), 'First element in view should start from "smiling".' ); + assert.areSame( '😻 smiling_cat_face_with_heart-eyes' , autocomplete.view.element.getChild( 0 ).getText(), 'First element in view should start from "smiling".' ); } ); }, // (#2583) 'test emoji autocomplete panel displays name': function( editor, bot ) { emojiTools.runAfterInstanceReady( editor, bot, function( editor, bot ) { - bot.setHtmlWithSelection( '

    foo :collision:^

    ' ); + bot.setHtmlWithSelection( '

    foo 😻 :smiling_cat_face_with_heart-eyes:^

    ' ); editor.editable().fire( 'keyup', new CKEDITOR.dom.event( {} ) ); var element = CKEDITOR.document.findOne( '.cke_emoji-suggestion_item' ); - assert.areEqual( element.getText(), 'πŸ’₯ collision' ); + assert.areEqual( element.getText(), '😻 smiling_cat_face_with_heart-eyes' ); } ); } }; diff --git a/tests/plugins/emoji/dropdown.js b/tests/plugins/emoji/dropdown.js index 33862173559..b29510a7c4e 100644 --- a/tests/plugins/emoji/dropdown.js +++ b/tests/plugins/emoji/dropdown.js @@ -40,7 +40,7 @@ bot.panel( 'EmojiPanel', function( panel ) { panel.hide(); - assert.areEqual( 'collision', collision._name, 'Emoji name should be cached.' ); + assert.areEqual( 'collision', collision.name, 'Emoji name should be cached.' ); } ); }, From 8b80bf77f0ba8f363b807466509fbb17dc41d237 Mon Sep 17 00:00:00 2001 From: Jacek Bogdanski Date: Fri, 15 Nov 2019 12:00:45 +0100 Subject: [PATCH 19/22] Updated test description to contain underscores. --- tests/plugins/emoji/manual/emojimatchlabel.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/tests/plugins/emoji/manual/emojimatchlabel.md b/tests/plugins/emoji/manual/emojimatchlabel.md index b363f3fbc5a..4c08f84b2ad 100644 --- a/tests/plugins/emoji/manual/emojimatchlabel.md +++ b/tests/plugins/emoji/manual/emojimatchlabel.md @@ -4,12 +4,12 @@ @bender-include: ../_helpers/tools.js 1. Focus editor. -1. Type `:collision:` +1. Type `:smiling_face:` ## Expected: -Emoji suggestion box appears with match: `πŸ’₯ collision` +Emoji suggestion box appears with match: `☺️ smiling_face` ## Unexpected: -Emoji suggestion box appears with match: `πŸ’₯ :collision:` +Emoji suggestion box appears with match: `☺️ :smiling_face:` From fe47c2868dfe43a974c030beaf75e58547af6ae6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jacek=20Bogda=C5=84ski?= Date: Tue, 19 Nov 2019 08:53:40 +0100 Subject: [PATCH 20/22] Rewording. Co-Authored-By: Mateusz Samsel --- tests/plugins/emoji/dropdown.js | 2 +- tests/plugins/emoji/manual/emojimatchlabel.md | 6 +++--- tests/plugins/emoji/manual/font.md | 6 +++--- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/tests/plugins/emoji/dropdown.js b/tests/plugins/emoji/dropdown.js index b29510a7c4e..c92024722a9 100644 --- a/tests/plugins/emoji/dropdown.js +++ b/tests/plugins/emoji/dropdown.js @@ -36,7 +36,7 @@ return item.id === ':collision:'; } )[ 0 ]; - assert.isUndefined( collision._name, 'Emoji name should be undefined.' ); + assert.isUndefined( collision.name, 'Emoji name should be undefined.' ); bot.panel( 'EmojiPanel', function( panel ) { panel.hide(); diff --git a/tests/plugins/emoji/manual/emojimatchlabel.md b/tests/plugins/emoji/manual/emojimatchlabel.md index 4c08f84b2ad..e48a04eec00 100644 --- a/tests/plugins/emoji/manual/emojimatchlabel.md +++ b/tests/plugins/emoji/manual/emojimatchlabel.md @@ -3,13 +3,13 @@ @bender-ui: collapsed @bender-include: ../_helpers/tools.js -1. Focus editor. +1. Focus the editor. 1. Type `:smiling_face:` ## Expected: -Emoji suggestion box appears with match: `☺️ smiling_face` +The emoji suggestion box appears with the match: `☺️ smiling_face`. ## Unexpected: -Emoji suggestion box appears with match: `☺️ :smiling_face:` +The emoji suggestion box appears with the match: `☺️ :smiling_face:`. diff --git a/tests/plugins/emoji/manual/font.md b/tests/plugins/emoji/manual/font.md index bb26e1a5993..64d4c5c067b 100644 --- a/tests/plugins/emoji/manual/font.md +++ b/tests/plugins/emoji/manual/font.md @@ -3,13 +3,13 @@ @bender-ui: collapsed @bender-include: ../_helpers/tools.js -1. Focus editor. +1. Focus the editor. 1. Type `:smiling_face:` ## Expected: -Nice colored emoji is displayed in emoji suggestion box: ☺ +Emoji suggestion box displays a nicely colored emoji symbol like this one: ☺. ## Unexpected: -Ugly black and white smiley is displayed in emoji suggestion box: ☺ +Emoji suggestion box displays an ugly black and white smiley like this one: ☺ From 4de9296cf3d6e81ce1e4a7fc8663f9c72c78cd55 Mon Sep 17 00:00:00 2001 From: Jacek Bogdanski Date: Tue, 19 Nov 2019 09:03:08 +0100 Subject: [PATCH 21/22] Improved tests. --- tests/plugins/emoji/basic.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/tests/plugins/emoji/basic.js b/tests/plugins/emoji/basic.js index 5ed69123712..0074a0672bb 100644 --- a/tests/plugins/emoji/basic.js +++ b/tests/plugins/emoji/basic.js @@ -225,19 +225,19 @@ } ); arrayAssert.itemsAreSame( expected, actual ); - assert.areSame( '😻 smiling_cat_face_with_heart-eyes' , autocomplete.view.element.getChild( 0 ).getText(), 'First element in view should start from "smiling".' ); + assert.areSame( '😻 smiling_cat_face_with_heart-eyes' , autocomplete.view.element.getChild( 0 ).getHtml(), 'First element in view should start from "smiling".' ); } ); }, // (#2583) 'test emoji autocomplete panel displays name': function( editor, bot ) { emojiTools.runAfterInstanceReady( editor, bot, function( editor, bot ) { - bot.setHtmlWithSelection( '

    foo 😻 :smiling_cat_face_with_heart-eyes:^

    ' ); + bot.setHtmlWithSelection( '

    :smiling_cat_face_with_heart-eyes:^

    ' ); editor.editable().fire( 'keyup', new CKEDITOR.dom.event( {} ) ); var element = CKEDITOR.document.findOne( '.cke_emoji-suggestion_item' ); - assert.areEqual( element.getText(), '😻 smiling_cat_face_with_heart-eyes' ); + assert.areEqual( element.getHtml(), '😻 smiling_cat_face_with_heart-eyes' ); } ); } }; From dd62de834caa2ac07a965eb0728e2cb9e837c216 Mon Sep 17 00:00:00 2001 From: Jacek Bogdanski Date: Tue, 19 Nov 2019 13:50:12 +0100 Subject: [PATCH 22/22] Added changelog entry. --- CHANGES.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/CHANGES.md b/CHANGES.md index b315e64d3cf..21a415d914b 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -3,6 +3,10 @@ ## CKEditor 4.14 +New features: + +* [#2583](https://github.com/ckeditor/ckeditor-dev/issues/2583): Changed [Emoji](https://ckeditor.com/cke4/addon/emoji) suggestion box to show matched emoji name instead of an ID. + ## CKEditor 4.13.1 Fixed Issues: