Clear emoji search in awards menu after picking emoji27655-clear-emoji-search-after-selection

Fixes https://gitlab.com/gitlab-org/gitlab-ce/issues/27655

1 files changed, 24 insertions, 4 deletions

diff --git a/spec/javascripts/awards_handler_spec.js b/spec/javascripts/awards_handler_spec.js
index ea7753c7a1d..abb6884fd24 100644
--- a/spec/javascripts/awards_handler_spec.js
+++ b/spec/javascripts/awards_handler_spec.js
@@ -63,7 +63,7 @@ import AwardsHandler from '~/awards_handler';
           $emojiMenu = $('.emoji-menu');
           expect($emojiMenu.length).toBe(1);
           expect($emojiMenu.hasClass('is-visible')).toBe(true);
-          expect($emojiMenu.find('#emoji_search').length).toBe(1);
+          expect($emojiMenu.find('.js-emoji-menu-search').length).toBe(1);
           return expect($('.js-awards-block.current').length).toBe(1);
         });
       });
@@ -194,16 +194,35 @@ import AwardsHandler from '~/awards_handler';
         return expect($thumbsUpEmoji.data("original-title")).toBe('sam');
       });
     });
-    describe('search', function() {
-      return it('should filter the emoji', function(done) {
+    describe('::searchEmojis', () => {
+      it('should filter the emoji', function(done) {
         return openAndWaitForEmojiMenu()
           .then(() => {
             expect($('[data-name=angel]').is(':visible')).toBe(true);
             expect($('[data-name=anger]').is(':visible')).toBe(true);
-            $('#emoji_search').val('ali').trigger('input');
+            awardsHandler.searchEmojis('ali');
             expect($('[data-name=angel]').is(':visible')).toBe(false);
             expect($('[data-name=anger]').is(':visible')).toBe(false);
             expect($('[data-name=alien]').is(':visible')).toBe(true);
+            expect($('.js-emoji-menu-search').val()).toBe('ali');
+          })
+          .then(done)
+          .catch((err) => {
+            done.fail(`Failed to open and build emoji menu: ${err.message}`);
+          });
+      });
+      it('should clear the search when searching for nothing', function(done) {
+        return openAndWaitForEmojiMenu()
+          .then(() => {
+            awardsHandler.searchEmojis('ali');
+            expect($('[data-name=angel]').is(':visible')).toBe(false);
+            expect($('[data-name=anger]').is(':visible')).toBe(false);
+            expect($('[data-name=alien]').is(':visible')).toBe(true);
+            awardsHandler.searchEmojis('');
+            expect($('[data-name=angel]').is(':visible')).toBe(true);
+            expect($('[data-name=anger]').is(':visible')).toBe(true);
+            expect($('[data-name=alien]').is(':visible')).toBe(true);
+            expect($('.js-emoji-menu-search').val()).toBe('');
           })
           .then(done)
           .catch((err) => {
@@ -211,6 +230,7 @@ import AwardsHandler from '~/awards_handler';
           });
       });
     });
+
     describe('emoji menu', function() {
       const emojiSelector = '[data-name="sunglasses"]';
       const openEmojiMenuAndAddEmoji = function() {