Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
24
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Avoid interference between username and emoji autocomplete

Browse Source
This commit is contained in:
JC Brand 2019-08-22 14:20:49 +02:00
parent a59510bbf0
commit c01d110501
3 changed files with 49 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
spec/emojis.js
View File

@ -60,7 +60,7 @@
}
view.onKeyDown(tab_event);
await u.waitUntil(() => u.isVisible(view.el.querySelector('.toggle-smiley .emoji-picker__container')));
const picker = await u.waitUntil(() => view.el.querySelector('.toggle-smiley .emoji-picker__container'));
let picker = await u.waitUntil(() => view.el.querySelector('.toggle-smiley .emoji-picker__container'));
const input = picker.querySelector('.emoji-search');
expect(input.value).toBe(':gri');
let visible_emojis = sizzle('.insert-emoji:not(.hidden)', picker);
@ -81,6 +81,28 @@
view.emoji_picker_view.onKeyDown(enter_event);
expect(input.value).toBe('');
expect(textarea.value).toBe(':grimacing: ');
// Test that username starting with : doesn't cause issues
const presence = $pres({
'from': `${muc_jid}/:username`,
'id': '27C55F89-1C6A-459A-9EB5-77690145D624',
'to': _converse.jid
})
.c('x', { 'xmlns': 'http://jabber.org/protocol/muc#user'})
.c('item', {
'jid': 'some1@montague.lit',
'affiliation': 'member',
'role': 'participant'
});
_converse.connection._dataRecv(test_utils.createRequest(presence));
textarea.value = ':use';
view.onKeyDown(tab_event);
await u.waitUntil(() => u.isVisible(view.el.querySelector('.toggle-smiley .emoji-picker__container')));
picker = await u.waitUntil(() => view.el.querySelector('.toggle-smiley .emoji-picker__container'));
expect(input.value).toBe(':use');
visible_emojis = sizzle('.insert-emoji:not(.hidden)', picker);
expect(visible_emojis.length).toBe(0);
done();
}));

4
src/converse-chatview.js
View File

@ -883,8 +883,6 @@ converse.plugins.add('converse-chatview', {
if (ev.keyCode === _converse.keycodes.FORWARD_SLASH) {
// Forward slash is used to run commands. Nothing to do here.
return;
} else if (ev.keyCode === _converse.keycodes.TAB) {
return this.onTabPressed(ev);
} else if (ev.keyCode === _converse.keycodes.ESCAPE) {
return this.onEscapePressed(ev);
} else if (ev.keyCode === _converse.keycodes.ENTER) {
@ -924,8 +922,6 @@ converse.plugins.add('converse-chatview', {
return this.onFormSubmitted(ev);
},
onTabPressed (ev) {}, // noop, overridden in other plugins
onEscapePressed (ev) {
ev.preventDefault();
const idx = this.model.messages.findLastIndex('correcting'),

48
src/converse-emoji-views.js
View File

@ -42,28 +42,6 @@ converse.plugins.add('converse-emoji-views', {
this.emoji_dropdown.toggle();
}
this.__super__.onEnterPressed.apply(this, arguments);
},
async onTabPressed (ev) {
const { _converse } = this.__super__;
const input = ev.target;
const value = u.getCurrentWord(input, null, /(:.*?:)/g);
if (value.startsWith(':')) {
ev.preventDefault();
ev.stopPropagation();
if (this.emoji_dropdown === undefined) {
this.createEmojiDropdown();
}
await _converse.api.waitUntil('emojisInitialized');
this.emoji_picker_view.model.set({
'autocompleting': value,
'position': ev.target.selectionStart
}, {'silent': true});
this.emoji_picker_view.filter(value, true);
this.emoji_dropdown.toggle();
} else {
this.__super__.onTabPressed.apply(this, arguments);
}
}
},
@ -71,6 +49,19 @@ converse.plugins.add('converse-emoji-views', {
events: {
'click .toggle-smiley': 'toggleEmojiMenu'
},
onKeyDown (ev) {
const { _converse } = this.__super__;
if (ev.keyCode === _converse.keycodes.TAB) {
const value = u.getCurrentWord(ev.target, null, /(:.*?:)/g);
if (value.startsWith(':')) {
ev.preventDefault();
ev.stopPropagation();
return this.autocompleteInPicker(ev.target, value);
}
}
return this.__super__.onKeyDown.call(this, ev);
}
}
},
@ -92,6 +83,19 @@ converse.plugins.add('converse-emoji-views', {
const emoji_aware_chat_view = {
async autocompleteInPicker (input, value) {
if (this.emoji_dropdown === undefined) {
this.createEmojiDropdown();
}
await _converse.api.waitUntil('emojisInitialized');
this.emoji_picker_view.model.set({
'autocompleting': value,
'position': input.selectionStart
}, {'silent': true});
this.emoji_picker_view.filter(value, true);
this.emoji_dropdown.toggle();
},
createEmojiPicker () {
if (!_converse.emojipicker) {
const storage = _converse.config.get('storage'),