diff options
Diffstat (limited to 'spec/javascripts/awards_handler_spec.js')
| -rw-r--r-- | spec/javascripts/awards_handler_spec.js | 691 |
1 files changed, 335 insertions, 356 deletions
diff --git a/spec/javascripts/awards_handler_spec.js b/spec/javascripts/awards_handler_spec.js index 0bc4021f05f..b0689fc7cfe 100644 --- a/spec/javascripts/awards_handler_spec.js +++ b/spec/javascripts/awards_handler_spec.js @@ -1,421 +1,400 @@ -/* eslint-disable no-var, one-var, no-unused-expressions, no-unused-vars, prefer-template */ - import $ from 'jquery'; import Cookies from 'js-cookie'; import loadAwardsHandler from '~/awards_handler'; - import '~/lib/utils/common_utils'; -(function() { - var awardsHandler, lazyAssert, urlRoot, openAndWaitForEmojiMenu; +window.gl = window.gl || {}; +window.gon = window.gon || {}; + +let openAndWaitForEmojiMenu; +let awardsHandler = null; +const urlRoot = gon.relative_url_root; + +const lazyAssert = function(done, assertFn) { + setTimeout(function() { + assertFn(); + done(); + // Maybe jasmine.clock here? + }, 333); +}; + +describe('AwardsHandler', function() { + preloadFixtures('snippets/show.html.raw'); + beforeEach(function(done) { + loadFixtures('snippets/show.html.raw'); + loadAwardsHandler(true) + .then(obj => { + awardsHandler = obj; + spyOn(awardsHandler, 'postEmoji').and.callFake((button, url, emoji, cb) => cb()); + done(); + }) + .catch(fail); + + let isEmojiMenuBuilt = false; + openAndWaitForEmojiMenu = function() { + return new Promise(resolve => { + if (isEmojiMenuBuilt) { + resolve(); + } else { + $('.js-add-award') + .eq(0) + .click(); + const $menu = $('.emoji-menu'); + $menu.one('build-emoji-menu-finish', () => { + isEmojiMenuBuilt = true; + resolve(); + }); + } + }); + }; + }); - awardsHandler = null; + afterEach(function() { + // restore original url root value + gon.relative_url_root = urlRoot; - window.gl || (window.gl = {}); + // Undo what we did to the shared <body> + $('body').removeAttr('data-page'); - window.gon || (window.gon = {}); + awardsHandler.destroy(); + }); - urlRoot = gon.relative_url_root; + describe('::showEmojiMenu', function() { + it('should show emoji menu when Add emoji button clicked', function(done) { + $('.js-add-award') + .eq(0) + .click(); + lazyAssert(done, function() { + const $emojiMenu = $('.emoji-menu'); + + expect($emojiMenu.length).toBe(1); + expect($emojiMenu.hasClass('is-visible')).toBe(true); + expect($emojiMenu.find('.js-emoji-menu-search').length).toBe(1); + expect($('.js-awards-block.current').length).toBe(1); + }); + }); - lazyAssert = function(done, assertFn) { - return setTimeout(function() { - assertFn(); - return done(); - // Maybe jasmine.clock here? - }, 333); - }; + it('should also show emoji menu for the smiley icon in notes', function(done) { + $('.js-add-award.note-action-button').click(); + lazyAssert(done, function() { + const $emojiMenu = $('.emoji-menu'); - describe('AwardsHandler', function() { - preloadFixtures('snippets/show.html.raw'); - beforeEach(function(done) { - loadFixtures('snippets/show.html.raw'); - loadAwardsHandler(true) - .then(obj => { - awardsHandler = obj; - spyOn(awardsHandler, 'postEmoji').and.callFake((button, url, emoji, cb) => cb()); - done(); - }) - .catch(fail); + expect($emojiMenu.length).toBe(1); + }); + }); - let isEmojiMenuBuilt = false; - openAndWaitForEmojiMenu = function() { - return new Promise((resolve, reject) => { - if (isEmojiMenuBuilt) { - resolve(); - } else { - $('.js-add-award') - .eq(0) - .click(); - const $menu = $('.emoji-menu'); - $menu.one('build-emoji-menu-finish', () => { - isEmojiMenuBuilt = true; - resolve(); - }); - } - }); - }; + it('should remove emoji menu when body is clicked', function(done) { + $('.js-add-award') + .eq(0) + .click(); + lazyAssert(done, function() { + const $emojiMenu = $('.emoji-menu'); + $('body').click(); + + expect($emojiMenu.length).toBe(1); + expect($emojiMenu.hasClass('is-visible')).toBe(false); + expect($('.js-awards-block.current').length).toBe(0); + }); }); - afterEach(function() { - // restore original url root value - gon.relative_url_root = urlRoot; + it('should not remove emoji menu when search is clicked', function(done) { + $('.js-add-award') + .eq(0) + .click(); + lazyAssert(done, function() { + const $emojiMenu = $('.emoji-menu'); + $('.emoji-search').click(); + + expect($emojiMenu.length).toBe(1); + expect($emojiMenu.hasClass('is-visible')).toBe(true); + expect($('.js-awards-block.current').length).toBe(1); + }); + }); + }); - // Undo what we did to the shared <body> - $('body').removeAttr('data-page'); + describe('::addAwardToEmojiBar', function() { + it('should add emoji to votes block', function() { + const $votesBlock = $('.js-awards-block').eq(0); + awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); + const $emojiButton = $votesBlock.find('[data-name=heart]'); - awardsHandler.destroy(); + expect($emojiButton.length).toBe(1); + expect($emojiButton.next('.js-counter').text()).toBe('1'); + expect($votesBlock.hasClass('hidden')).toBe(false); }); - describe('::showEmojiMenu', function() { - it('should show emoji menu when Add emoji button clicked', function(done) { - $('.js-add-award') - .eq(0) - .click(); - return lazyAssert(done, function() { - var $emojiMenu; - $emojiMenu = $('.emoji-menu'); - - expect($emojiMenu.length).toBe(1); - expect($emojiMenu.hasClass('is-visible')).toBe(true); - expect($emojiMenu.find('.js-emoji-menu-search').length).toBe(1); - return expect($('.js-awards-block.current').length).toBe(1); - }); - }); + it('should remove the emoji when we click again', function() { + const $votesBlock = $('.js-awards-block').eq(0); + awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); + awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); + const $emojiButton = $votesBlock.find('[data-name=heart]'); - it('should also show emoji menu for the smiley icon in notes', function(done) { - $('.js-add-award.note-action-button').click(); - return lazyAssert(done, function() { - var $emojiMenu = $('.emoji-menu'); + expect($emojiButton.length).toBe(0); + }); - expect($emojiMenu.length).toBe(1); - }); - }); + it('should decrement the emoji counter', function() { + const $votesBlock = $('.js-awards-block').eq(0); + awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); + const $emojiButton = $votesBlock.find('[data-name=heart]'); + $emojiButton.next('.js-counter').text(5); + awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); - it('should remove emoji menu when body is clicked', function(done) { - $('.js-add-award') - .eq(0) - .click(); - return lazyAssert(done, function() { - var $emojiMenu; - $emojiMenu = $('.emoji-menu'); - $('body').click(); - - expect($emojiMenu.length).toBe(1); - expect($emojiMenu.hasClass('is-visible')).toBe(false); - return expect($('.js-awards-block.current').length).toBe(0); - }); - }); + expect($emojiButton.length).toBe(1); + expect($emojiButton.next('.js-counter').text()).toBe('4'); + }); + }); - it('should not remove emoji menu when search is clicked', function(done) { - $('.js-add-award') - .eq(0) - .click(); - return lazyAssert(done, function() { - var $emojiMenu; - $emojiMenu = $('.emoji-menu'); - $('.emoji-search').click(); - - expect($emojiMenu.length).toBe(1); - expect($emojiMenu.hasClass('is-visible')).toBe(true); - return expect($('.js-awards-block.current').length).toBe(1); - }); - }); + describe('::userAuthored', function() { + it('should update tooltip to user authored title', function() { + const $votesBlock = $('.js-awards-block').eq(0); + const $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); + $thumbsUpEmoji.attr('data-title', 'sam'); + awardsHandler.userAuthored($thumbsUpEmoji); + + expect($thumbsUpEmoji.data('originalTitle')).toBe( + 'You cannot vote on your own issue, MR and note', + ); }); - describe('::addAwardToEmojiBar', function() { - it('should add emoji to votes block', function() { - var $emojiButton, $votesBlock; - $votesBlock = $('.js-awards-block').eq(0); - awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); - $emojiButton = $votesBlock.find('[data-name=heart]'); + it('should restore tooltip back to initial vote list', function() { + jasmine.clock().install(); + const $votesBlock = $('.js-awards-block').eq(0); + const $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); + $thumbsUpEmoji.attr('data-title', 'sam'); + awardsHandler.userAuthored($thumbsUpEmoji); + jasmine.clock().tick(2801); + jasmine.clock().uninstall(); - expect($emojiButton.length).toBe(1); - expect($emojiButton.next('.js-counter').text()).toBe('1'); - return expect($votesBlock.hasClass('hidden')).toBe(false); - }); + expect($thumbsUpEmoji.data('originalTitle')).toBe('sam'); + }); + }); - it('should remove the emoji when we click again', function() { - var $emojiButton, $votesBlock; - $votesBlock = $('.js-awards-block').eq(0); - awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); - awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); - $emojiButton = $votesBlock.find('[data-name=heart]'); + describe('::getAwardUrl', function() { + it('returns the url for request', function() { + expect(awardsHandler.getAwardUrl()).toBe('http://test.host/snippets/1/toggle_award_emoji'); + }); + }); - expect($emojiButton.length).toBe(0); - }); - return it('should decrement the emoji counter', function() { - var $emojiButton, $votesBlock; - $votesBlock = $('.js-awards-block').eq(0); - awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); - $emojiButton = $votesBlock.find('[data-name=heart]'); - $emojiButton.next('.js-counter').text(5); - awardsHandler.addAwardToEmojiBar($votesBlock, 'heart', false); - - expect($emojiButton.length).toBe(1); - return expect($emojiButton.next('.js-counter').text()).toBe('4'); - }); + describe('::addAward and ::checkMutuality', function() { + it('should handle :+1: and :-1: mutuality', function() { + const awardUrl = awardsHandler.getAwardUrl(); + const $votesBlock = $('.js-awards-block').eq(0); + const $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); + const $thumbsDownEmoji = $votesBlock.find('[data-name=thumbsdown]').parent(); + awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); + + expect($thumbsUpEmoji.hasClass('active')).toBe(true); + expect($thumbsDownEmoji.hasClass('active')).toBe(false); + $thumbsUpEmoji.tooltip(); + $thumbsDownEmoji.tooltip(); + awardsHandler.addAward($votesBlock, awardUrl, 'thumbsdown', true); + + expect($thumbsUpEmoji.hasClass('active')).toBe(false); + expect($thumbsDownEmoji.hasClass('active')).toBe(true); }); + }); - describe('::userAuthored', function() { - it('should update tooltip to user authored title', function() { - var $thumbsUpEmoji, $votesBlock; - $votesBlock = $('.js-awards-block').eq(0); - $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); - $thumbsUpEmoji.attr('data-title', 'sam'); - awardsHandler.userAuthored($thumbsUpEmoji); - - expect($thumbsUpEmoji.data('originalTitle')).toBe( - 'You cannot vote on your own issue, MR and note', - ); - }); + describe('::removeEmoji', function() { + it('should remove emoji', function() { + const awardUrl = awardsHandler.getAwardUrl(); + const $votesBlock = $('.js-awards-block').eq(0); + awardsHandler.addAward($votesBlock, awardUrl, 'fire', false); - it('should restore tooltip back to initial vote list', function() { - var $thumbsUpEmoji, $votesBlock; - jasmine.clock().install(); - $votesBlock = $('.js-awards-block').eq(0); - $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); - $thumbsUpEmoji.attr('data-title', 'sam'); - awardsHandler.userAuthored($thumbsUpEmoji); - jasmine.clock().tick(2801); - jasmine.clock().uninstall(); - - expect($thumbsUpEmoji.data('originalTitle')).toBe('sam'); - }); + expect($votesBlock.find('[data-name=fire]').length).toBe(1); + awardsHandler.removeEmoji($votesBlock.find('[data-name=fire]').closest('button')); + + expect($votesBlock.find('[data-name=fire]').length).toBe(0); }); + }); - describe('::getAwardUrl', function() { - return it('returns the url for request', function() { + describe('::addYouToUserList', function() { + it('should prepend "You" to the award tooltip', function() { + const awardUrl = awardsHandler.getAwardUrl(); + const $votesBlock = $('.js-awards-block').eq(0); + const $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); + $thumbsUpEmoji.attr('data-title', 'sam, jerry, max, and andy'); + awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); + $thumbsUpEmoji.tooltip(); - expect(awardsHandler.getAwardUrl()).toBe( - 'http://test.host/snippets/1/toggle_award_emoji', - ); - }); + expect($thumbsUpEmoji.data('originalTitle')).toBe('You, sam, jerry, max, and andy'); }); - describe('::addAward and ::checkMutuality', function() { - return it('should handle :+1: and :-1: mutuality', function() { - var $thumbsDownEmoji, $thumbsUpEmoji, $votesBlock, awardUrl; - awardUrl = awardsHandler.getAwardUrl(); - $votesBlock = $('.js-awards-block').eq(0); - $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); - $thumbsDownEmoji = $votesBlock.find('[data-name=thumbsdown]').parent(); - awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); - - expect($thumbsUpEmoji.hasClass('active')).toBe(true); - expect($thumbsDownEmoji.hasClass('active')).toBe(false); - $thumbsUpEmoji.tooltip(); - $thumbsDownEmoji.tooltip(); - awardsHandler.addAward($votesBlock, awardUrl, 'thumbsdown', true); - - expect($thumbsUpEmoji.hasClass('active')).toBe(false); - return expect($thumbsDownEmoji.hasClass('active')).toBe(true); - }); + it('handles the special case where "You" is not cleanly comma seperated', function() { + const awardUrl = awardsHandler.getAwardUrl(); + const $votesBlock = $('.js-awards-block').eq(0); + const $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); + $thumbsUpEmoji.attr('data-title', 'sam'); + awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); + $thumbsUpEmoji.tooltip(); + + expect($thumbsUpEmoji.data('originalTitle')).toBe('You and sam'); }); + }); - describe('::removeEmoji', function() { - return it('should remove emoji', function() { - var $votesBlock, awardUrl; - awardUrl = awardsHandler.getAwardUrl(); - $votesBlock = $('.js-awards-block').eq(0); - awardsHandler.addAward($votesBlock, awardUrl, 'fire', false); + describe('::removeYouToUserList', function() { + it('removes "You" from the front of the tooltip', function() { + const awardUrl = awardsHandler.getAwardUrl(); + const $votesBlock = $('.js-awards-block').eq(0); + const $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); + $thumbsUpEmoji.attr('data-title', 'You, sam, jerry, max, and andy'); + $thumbsUpEmoji.addClass('active'); + awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); + $thumbsUpEmoji.tooltip(); + + expect($thumbsUpEmoji.data('originalTitle')).toBe('sam, jerry, max, and andy'); + }); - expect($votesBlock.find('[data-name=fire]').length).toBe(1); - awardsHandler.removeEmoji($votesBlock.find('[data-name=fire]').closest('button')); + it('handles the special case where "You" is not cleanly comma seperated', function() { + const awardUrl = awardsHandler.getAwardUrl(); + const $votesBlock = $('.js-awards-block').eq(0); + const $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); + $thumbsUpEmoji.attr('data-title', 'You and sam'); + $thumbsUpEmoji.addClass('active'); + awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); + $thumbsUpEmoji.tooltip(); - expect($votesBlock.find('[data-name=fire]').length).toBe(0); - }); + expect($thumbsUpEmoji.data('originalTitle')).toBe('sam'); }); + }); - describe('::addYouToUserList', function() { - it('should prepend "You" to the award tooltip', function() { - var $thumbsUpEmoji, $votesBlock, awardUrl; - awardUrl = awardsHandler.getAwardUrl(); - $votesBlock = $('.js-awards-block').eq(0); - $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); - $thumbsUpEmoji.attr('data-title', 'sam, jerry, max, and andy'); - awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); - $thumbsUpEmoji.tooltip(); - - expect($thumbsUpEmoji.data('originalTitle')).toBe('You, sam, jerry, max, and andy'); - }); - return it('handles the special case where "You" is not cleanly comma seperated', function() { - var $thumbsUpEmoji, $votesBlock, awardUrl; - awardUrl = awardsHandler.getAwardUrl(); - $votesBlock = $('.js-awards-block').eq(0); - $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); - $thumbsUpEmoji.attr('data-title', 'sam'); - awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); - $thumbsUpEmoji.tooltip(); - - expect($thumbsUpEmoji.data('originalTitle')).toBe('You and sam'); - }); + describe('::searchEmojis', () => { + it('should filter the emoji', function(done) { + openAndWaitForEmojiMenu() + .then(() => { + expect($('[data-name=angel]').is(':visible')).toBe(true); + expect($('[data-name=anger]').is(':visible')).toBe(true); + 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}`); + }); }); - describe('::removeYouToUserList', function() { - it('removes "You" from the front of the tooltip', function() { - var $thumbsUpEmoji, $votesBlock, awardUrl; - awardUrl = awardsHandler.getAwardUrl(); - $votesBlock = $('.js-awards-block').eq(0); - $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); - $thumbsUpEmoji.attr('data-title', 'You, sam, jerry, max, and andy'); - $thumbsUpEmoji.addClass('active'); - awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); - $thumbsUpEmoji.tooltip(); - - expect($thumbsUpEmoji.data('originalTitle')).toBe('sam, jerry, max, and andy'); - }); - return it('handles the special case where "You" is not cleanly comma seperated', function() { - var $thumbsUpEmoji, $votesBlock, awardUrl; - awardUrl = awardsHandler.getAwardUrl(); - $votesBlock = $('.js-awards-block').eq(0); - $thumbsUpEmoji = $votesBlock.find('[data-name=thumbsup]').parent(); - $thumbsUpEmoji.attr('data-title', 'You and sam'); - $thumbsUpEmoji.addClass('active'); - awardsHandler.addAward($votesBlock, awardUrl, 'thumbsup', false); - $thumbsUpEmoji.tooltip(); - - expect($thumbsUpEmoji.data('originalTitle')).toBe('sam'); - }); + it('should clear the search when searching for nothing', function(done) { + 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 => { + done.fail(`Failed to open and build emoji menu: ${err.message}`); + }); }); + }); - 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); - 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}`); - }); - }); + describe('emoji menu', function() { + const emojiSelector = '[data-name="sunglasses"]'; + const openEmojiMenuAndAddEmoji = function() { + return openAndWaitForEmojiMenu().then(() => { + const $menu = $('.emoji-menu'); + const $block = $('.js-awards-block'); + const $emoji = $menu.find(`.emoji-menu-list:not(.frequent-emojis) ${emojiSelector}`); - 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 => { - done.fail(`Failed to open and build emoji menu: ${err.message}`); - }); + expect($emoji.length).toBe(1); + expect($block.find(emojiSelector).length).toBe(0); + $emoji.click(); + + expect($menu.hasClass('.is-visible')).toBe(false); + expect($block.find(emojiSelector).length).toBe(1); }); + }; + + it('should add selected emoji to awards block', function(done) { + openEmojiMenuAndAddEmoji() + .then(done) + .catch(err => { + done.fail(`Failed to open and build emoji menu: ${err.message}`); + }); }); - describe('emoji menu', function() { - const emojiSelector = '[data-name="sunglasses"]'; - const openEmojiMenuAndAddEmoji = function() { - return openAndWaitForEmojiMenu().then(() => { - const $menu = $('.emoji-menu'); + it('should remove already selected emoji', function(done) { + openEmojiMenuAndAddEmoji() + .then(() => { + $('.js-add-award') + .eq(0) + .click(); const $block = $('.js-awards-block'); - const $emoji = $menu.find('.emoji-menu-list:not(.frequent-emojis) ' + emojiSelector); - - expect($emoji.length).toBe(1); - expect($block.find(emojiSelector).length).toBe(0); + const $emoji = $('.emoji-menu').find( + `.emoji-menu-list:not(.frequent-emojis) ${emojiSelector}`, + ); $emoji.click(); - expect($menu.hasClass('.is-visible')).toBe(false); - expect($block.find(emojiSelector).length).toBe(1); + expect($block.find(emojiSelector).length).toBe(0); + }) + .then(done) + .catch(err => { + done.fail(`Failed to open and build emoji menu: ${err.message}`); }); - }; - it('should add selected emoji to awards block', function(done) { - return openEmojiMenuAndAddEmoji() - .then(done) - .catch(err => { - done.fail(`Failed to open and build emoji menu: ${err.message}`); - }); - }); + }); + }); + + describe('frequently used emojis', function() { + beforeEach(() => { + // Clear it out + Cookies.set('frequently_used_emojis', ''); + }); - it('should remove already selected emoji', function(done) { - return openEmojiMenuAndAddEmoji() - .then(() => { - $('.js-add-award') - .eq(0) - .click(); - const $block = $('.js-awards-block'); - const $emoji = $('.emoji-menu').find( - `.emoji-menu-list:not(.frequent-emojis) ${emojiSelector}`, - ); - $emoji.click(); - - expect($block.find(emojiSelector).length).toBe(0); - }) - .then(done) - .catch(err => { - done.fail(`Failed to open and build emoji menu: ${err.message}`); + it('shouldn\'t have any "Frequently used" heading if no frequently used emojis', function(done) { + return openAndWaitForEmojiMenu() + .then(() => { + const emojiMenu = document.querySelector('.emoji-menu'); + Array.prototype.forEach.call(emojiMenu.querySelectorAll('.emoji-menu-title'), title => { + expect(title.textContent.trim().toLowerCase()).not.toBe('frequently used'); }); - }); + }) + .then(done) + .catch(err => { + done.fail(`Failed to open and build emoji menu: ${err.message}`); + }); }); - describe('frequently used emojis', function() { - beforeEach(() => { - // Clear it out - Cookies.set('frequently_used_emojis', ''); - }); + it('should have any frequently used section when there are frequently used emojis', function(done) { + awardsHandler.addEmojiToFrequentlyUsedList('8ball'); - it('shouldn\'t have any "Frequently used" heading if no frequently used emojis', function(done) { - return openAndWaitForEmojiMenu() - .then(() => { - const emojiMenu = document.querySelector('.emoji-menu'); - Array.prototype.forEach.call(emojiMenu.querySelectorAll('.emoji-menu-title'), title => { - expect(title.textContent.trim().toLowerCase()).not.toBe('frequently used'); - }); - }) - .then(done) - .catch(err => { - done.fail(`Failed to open and build emoji menu: ${err.message}`); - }); - }); + return openAndWaitForEmojiMenu() + .then(() => { + const emojiMenu = document.querySelector('.emoji-menu'); + const hasFrequentlyUsedHeading = Array.prototype.some.call( + emojiMenu.querySelectorAll('.emoji-menu-title'), + title => title.textContent.trim().toLowerCase() === 'frequently used', + ); - it('should have any frequently used section when there are frequently used emojis', function(done) { - awardsHandler.addEmojiToFrequentlyUsedList('8ball'); - - return openAndWaitForEmojiMenu() - .then(() => { - const emojiMenu = document.querySelector('.emoji-menu'); - const hasFrequentlyUsedHeading = Array.prototype.some.call( - emojiMenu.querySelectorAll('.emoji-menu-title'), - title => title.textContent.trim().toLowerCase() === 'frequently used', - ); - - expect(hasFrequentlyUsedHeading).toBe(true); - }) - .then(done) - .catch(err => { - done.fail(`Failed to open and build emoji menu: ${err.message}`); - }); - }); + expect(hasFrequentlyUsedHeading).toBe(true); + }) + .then(done) + .catch(err => { + done.fail(`Failed to open and build emoji menu: ${err.message}`); + }); + }); - it('should disregard invalid frequently used emoji that are being attempted to be added', function() { - awardsHandler.addEmojiToFrequentlyUsedList('8ball'); - awardsHandler.addEmojiToFrequentlyUsedList('invalid_emoji'); - awardsHandler.addEmojiToFrequentlyUsedList('grinning'); + it('should disregard invalid frequently used emoji that are being attempted to be added', function() { + awardsHandler.addEmojiToFrequentlyUsedList('8ball'); + awardsHandler.addEmojiToFrequentlyUsedList('invalid_emoji'); + awardsHandler.addEmojiToFrequentlyUsedList('grinning'); - expect(awardsHandler.getFrequentlyUsedEmojis()).toEqual(['8ball', 'grinning']); - }); + expect(awardsHandler.getFrequentlyUsedEmojis()).toEqual(['8ball', 'grinning']); + }); - it('should disregard invalid frequently used emoji already set in cookie', function() { - Cookies.set('frequently_used_emojis', '8ball,invalid_emoji,grinning'); + it('should disregard invalid frequently used emoji already set in cookie', function() { + Cookies.set('frequently_used_emojis', '8ball,invalid_emoji,grinning'); - expect(awardsHandler.getFrequentlyUsedEmojis()).toEqual(['8ball', 'grinning']); - }); + expect(awardsHandler.getFrequentlyUsedEmojis()).toEqual(['8ball', 'grinning']); }); }); -}.call(window)); +}); |