diff options
Diffstat (limited to 'spec')
-rw-r--r-- | spec/javascripts/awards_handler_spec.js | 11 | ||||
-rw-r--r-- | spec/javascripts/emoji_spec.js | 189 | ||||
-rw-r--r-- | spec/javascripts/fixtures/emojis.rb | 16 | ||||
-rw-r--r-- | spec/lib/gitlab/path_regex_spec.rb | 2 |
4 files changed, 145 insertions, 73 deletions
diff --git a/spec/javascripts/awards_handler_spec.js b/spec/javascripts/awards_handler_spec.js index ce5d2022441..e5b5707dcef 100644 --- a/spec/javascripts/awards_handler_spec.js +++ b/spec/javascripts/awards_handler_spec.js @@ -1,12 +1,16 @@ import $ from 'jquery'; import Cookies from 'js-cookie'; +import MockAdapter from 'axios-mock-adapter'; +import axios from '~/lib/utils/axios_utils'; import loadAwardsHandler from '~/awards_handler'; import '~/lib/utils/common_utils'; +import { EMOJI_VERSION } from '~/emoji'; window.gl = window.gl || {}; window.gon = window.gon || {}; let openAndWaitForEmojiMenu; +let mock; let awardsHandler = null; const urlRoot = gon.relative_url_root; @@ -19,8 +23,13 @@ const lazyAssert = function(done, assertFn) { }; describe('AwardsHandler', function() { + const emojiData = getJSONFixture('emojis/emojis.json'); preloadFixtures('snippets/show.html.raw'); + beforeEach(function(done) { + mock = new MockAdapter(axios); + mock.onGet(`/-/emojis/${EMOJI_VERSION}/emojis.json`).reply(200, emojiData); + loadFixtures('snippets/show.html.raw'); loadAwardsHandler(true) .then(obj => { @@ -53,6 +62,8 @@ describe('AwardsHandler', function() { // restore original url root value gon.relative_url_root = urlRoot; + mock.restore(); + // Undo what we did to the shared <body> $('body').removeAttr('data-page'); diff --git a/spec/javascripts/emoji_spec.js b/spec/javascripts/emoji_spec.js index 3db4d9800f1..0ac375145be 100644 --- a/spec/javascripts/emoji_spec.js +++ b/spec/javascripts/emoji_spec.js @@ -1,4 +1,6 @@ -import { glEmojiTag } from '~/emoji'; +import MockAdapter from 'axios-mock-adapter'; +import axios from '~/lib/utils/axios_utils'; +import { initEmojiMap, glEmojiTag, EMOJI_VERSION } from '~/emoji'; import isEmojiUnicodeSupported, { isFlagEmoji, isRainbowFlagEmoji, @@ -7,6 +9,7 @@ import isEmojiUnicodeSupported, { isHorceRacingSkinToneComboEmoji, isPersonZwjEmoji, } from '~/emoji/support/is_emoji_unicode_supported'; +import installGlEmojiElement from '~/behaviors/gl_emoji'; const emptySupportMap = { personZwj: false, @@ -31,34 +34,35 @@ const emojiFixtureMap = { bomb: { name: 'bomb', moji: '💣', - unicodeVersion: '6.0', + uni: '6.0', }, construction_worker_tone5: { name: 'construction_worker_tone5', moji: '👷🏿', - unicodeVersion: '8.0', + uni: '8.0', }, five: { name: 'five', moji: '5️⃣', - unicodeVersion: '3.0', + uni: '3.0', }, grey_question: { name: 'grey_question', moji: '❔', - unicodeVersion: '6.0', + uni: '6.0', }, }; function markupToDomElement(markup) { const div = document.createElement('div'); div.innerHTML = markup; + document.body.appendChild(div); return div.firstElementChild; } -function testGlEmojiImageFallback(element, name, src) { +function testGlEmojiImageFallback(element, name) { expect(element.tagName.toLowerCase()).toBe('img'); - expect(element.getAttribute('src')).toBe(src); + expect(element.getAttribute('src')).toBe(`/-/emojis/${EMOJI_VERSION}/${name}.png`); expect(element.getAttribute('title')).toBe(`:${name}:`); expect(element.getAttribute('alt')).toBe(`:${name}:`); } @@ -68,12 +72,11 @@ const defaults = { sprite: false, }; -function testGlEmojiElement(element, name, unicodeVersion, unicodeMoji, options = {}) { +function testGlEmojiElement(element, name, uni, unicodeMoji, options = {}) { const opts = Object.assign({}, defaults, options); expect(element.tagName.toLowerCase()).toBe('gl-emoji'); expect(element.dataset.name).toBe(name); - expect(element.dataset.fallbackSrc.length).toBeGreaterThan(0); - expect(element.dataset.unicodeVersion).toBe(unicodeVersion); + expect(element.dataset.uni).toBe(uni); const fallbackSpriteClass = `emoji-${name}`; if (opts.sprite) { @@ -86,7 +89,7 @@ function testGlEmojiElement(element, name, unicodeVersion, unicodeMoji, options if (opts.forceFallback && !opts.sprite) { // Check for image fallback - testGlEmojiImageFallback(element.firstElementChild, name, element.dataset.fallbackSrc); + testGlEmojiImageFallback(element.firstElementChild, name); } else { // Otherwise make sure things are still unicode text expect(element.textContent.trim()).toBe(unicodeMoji); @@ -94,101 +97,143 @@ function testGlEmojiElement(element, name, unicodeVersion, unicodeMoji, options } describe('gl_emoji', () => { + beforeAll(() => { + installGlEmojiElement(); + }); + + let mock; + const emojiData = getJSONFixture('emojis/emojis.json'); + + beforeEach(function(done) { + mock = new MockAdapter(axios); + mock.onGet(`/-/emojis/${EMOJI_VERSION}/emojis.json`).reply(200, emojiData); + + initEmojiMap() + .then(() => { + done(); + }) + .catch(() => { + done(); + }); + }); + + afterEach(function() { + mock.restore(); + }); + describe('glEmojiTag', () => { - it('bomb emoji', () => { + it('bomb emoji', done => { const emojiKey = 'bomb'; const markup = glEmojiTag(emojiFixtureMap[emojiKey].name); const glEmojiElement = markupToDomElement(markup); - testGlEmojiElement( - glEmojiElement, - emojiFixtureMap[emojiKey].name, - emojiFixtureMap[emojiKey].unicodeVersion, - emojiFixtureMap[emojiKey].moji, - ); + setTimeout(() => { + testGlEmojiElement( + glEmojiElement, + emojiFixtureMap[emojiKey].name, + emojiFixtureMap[emojiKey].uni, + emojiFixtureMap[emojiKey].moji, + ); + done(); + }); }); - it('bomb emoji with image fallback', () => { + it('bomb emoji with image fallback', done => { const emojiKey = 'bomb'; const markup = glEmojiTag(emojiFixtureMap[emojiKey].name, { forceFallback: true, }); const glEmojiElement = markupToDomElement(markup); - testGlEmojiElement( - glEmojiElement, - emojiFixtureMap[emojiKey].name, - emojiFixtureMap[emojiKey].unicodeVersion, - emojiFixtureMap[emojiKey].moji, - { - forceFallback: true, - }, - ); + setTimeout(() => { + testGlEmojiElement( + glEmojiElement, + emojiFixtureMap[emojiKey].name, + emojiFixtureMap[emojiKey].uni, + emojiFixtureMap[emojiKey].moji, + { + forceFallback: true, + }, + ); + done(); + }); }); - it('bomb emoji with sprite fallback readiness', () => { + it('bomb emoji with sprite fallback readiness', done => { const emojiKey = 'bomb'; const markup = glEmojiTag(emojiFixtureMap[emojiKey].name, { sprite: true, }); const glEmojiElement = markupToDomElement(markup); - testGlEmojiElement( - glEmojiElement, - emojiFixtureMap[emojiKey].name, - emojiFixtureMap[emojiKey].unicodeVersion, - emojiFixtureMap[emojiKey].moji, - { - sprite: true, - }, - ); + setTimeout(() => { + testGlEmojiElement( + glEmojiElement, + emojiFixtureMap[emojiKey].name, + emojiFixtureMap[emojiKey].uni, + emojiFixtureMap[emojiKey].moji, + { + sprite: true, + }, + ); + done(); + }); }); - it('bomb emoji with sprite fallback', () => { + it('bomb emoji with sprite fallback', done => { const emojiKey = 'bomb'; const markup = glEmojiTag(emojiFixtureMap[emojiKey].name, { forceFallback: true, sprite: true, }); const glEmojiElement = markupToDomElement(markup); - testGlEmojiElement( - glEmojiElement, - emojiFixtureMap[emojiKey].name, - emojiFixtureMap[emojiKey].unicodeVersion, - emojiFixtureMap[emojiKey].moji, - { - forceFallback: true, - sprite: true, - }, - ); + setTimeout(() => { + testGlEmojiElement( + glEmojiElement, + emojiFixtureMap[emojiKey].name, + emojiFixtureMap[emojiKey].uni, + emojiFixtureMap[emojiKey].moji, + { + forceFallback: true, + sprite: true, + }, + ); + done(); + }); }); - it('question mark when invalid emoji name given', () => { + it('question mark when invalid emoji name given', done => { const name = 'invalid_emoji'; const emojiKey = 'grey_question'; const markup = glEmojiTag(name); const glEmojiElement = markupToDomElement(markup); - testGlEmojiElement( - glEmojiElement, - emojiFixtureMap[emojiKey].name, - emojiFixtureMap[emojiKey].unicodeVersion, - emojiFixtureMap[emojiKey].moji, - ); + setTimeout(() => { + testGlEmojiElement( + glEmojiElement, + emojiFixtureMap[emojiKey].name, + emojiFixtureMap[emojiKey].uni, + emojiFixtureMap[emojiKey].moji, + ); + done(); + }); }); - it('question mark with image fallback when invalid emoji name given', () => { + it('question mark with image fallback when invalid emoji name given', done => { const name = 'invalid_emoji'; const emojiKey = 'grey_question'; const markup = glEmojiTag(name, { forceFallback: true, }); const glEmojiElement = markupToDomElement(markup); - testGlEmojiElement( - glEmojiElement, - emojiFixtureMap[emojiKey].name, - emojiFixtureMap[emojiKey].unicodeVersion, - emojiFixtureMap[emojiKey].moji, - { - forceFallback: true, - }, - ); + setTimeout(() => { + testGlEmojiElement( + glEmojiElement, + emojiFixtureMap[emojiKey].name, + emojiFixtureMap[emojiKey].uni, + emojiFixtureMap[emojiKey].moji, + { + forceFallback: true, + }, + ); + done(); + }); }); }); @@ -389,7 +434,7 @@ describe('gl_emoji', () => { const isSupported = isEmojiUnicodeSupported( unicodeSupportMap, emojiFixtureMap[emojiKey].moji, - emojiFixtureMap[emojiKey].unicodeVersion, + emojiFixtureMap[emojiKey].uni, ); expect(isSupported).toBeTruthy(); @@ -401,7 +446,7 @@ describe('gl_emoji', () => { const isSupported = isEmojiUnicodeSupported( unicodeSupportMap, emojiFixtureMap[emojiKey].moji, - emojiFixtureMap[emojiKey].unicodeVersion, + emojiFixtureMap[emojiKey].uni, ); expect(isSupported).toBeFalsy(); @@ -415,7 +460,7 @@ describe('gl_emoji', () => { const isSupported = isEmojiUnicodeSupported( unicodeSupportMap, emojiFixtureMap[emojiKey].moji, - emojiFixtureMap[emojiKey].unicodeVersion, + emojiFixtureMap[emojiKey].uni, ); expect(isSupported).toBeFalsy(); @@ -441,7 +486,7 @@ describe('gl_emoji', () => { const isSupported = isEmojiUnicodeSupported( unicodeSupportMap, emojiFixtureMap[emojiKey].moji, - emojiFixtureMap[emojiKey].unicodeVersion, + emojiFixtureMap[emojiKey].uni, ); expect(isSupported).toBeFalsy(); @@ -459,7 +504,7 @@ describe('gl_emoji', () => { const isSupported = isEmojiUnicodeSupported( unicodeSupportMap, emojiFixtureMap[emojiKey].moji, - emojiFixtureMap[emojiKey].unicodeVersion, + emojiFixtureMap[emojiKey].uni, ); expect(isSupported).toBeTruthy(); @@ -477,7 +522,7 @@ describe('gl_emoji', () => { const isSupported = isEmojiUnicodeSupported( unicodeSupportMap, emojiFixtureMap[emojiKey].moji, - emojiFixtureMap[emojiKey].unicodeVersion, + emojiFixtureMap[emojiKey].uni, ); expect(isSupported).toBeFalsy(); diff --git a/spec/javascripts/fixtures/emojis.rb b/spec/javascripts/fixtures/emojis.rb new file mode 100644 index 00000000000..0e7257ee681 --- /dev/null +++ b/spec/javascripts/fixtures/emojis.rb @@ -0,0 +1,16 @@ +require 'spec_helper' + +describe 'Emojis (JavaScript fixtures)' do + include JavaScriptFixturesHelpers + + before(:all) do + clean_frontend_fixtures('emojis/') + end + + it 'emojis/emojis.json' do |example| + # Copying the emojis.json from the public folder + fixture_file_name = File.expand_path('emojis/emojis.json', JavaScriptFixturesHelpers::FIXTURE_PATH) + FileUtils.mkdir_p(File.dirname(fixture_file_name)) + FileUtils.cp(Rails.root.join('public/-/emojis/1/emojis.json'), fixture_file_name) + end +end diff --git a/spec/lib/gitlab/path_regex_spec.rb b/spec/lib/gitlab/path_regex_spec.rb index e90e0aba0a4..312e5e55af8 100644 --- a/spec/lib/gitlab/path_regex_spec.rb +++ b/spec/lib/gitlab/path_regex_spec.rb @@ -107,7 +107,7 @@ describe Gitlab::PathRegex do git = Gitlab.config.git.bin_path tracked = `cd #{Rails.root} && #{git} ls-files public` .split("\n") - .map { |entry| entry.gsub('public/', '') } + .map { |entry| entry.start_with?('public/-/') ? '-' : entry.gsub('public/', '') } .uniq tracked + %w(assets uploads) end |