All files / app/assets/javascripts/behaviors gl_emoji.js

100% Statements 39/39
92% Branches 23/25
100% Functions 5/5
100% Lines 39/39

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76                      15x     15x 15x 15x   15x 15x 10x   10x 10x 2x 2x   10x 10x   10x 10x   10x         15x 12x   15x 15x 15x   15x   10x 2x 1x 1x 1x 1x 1x     2x 2x 8x 3x 3x   5x 5x 5x             1x 1x      
import {
  initEmojiMap,
  getEmojiInfo,
  emojiFallbackImageSrc,
  emojiImageTag,
  findCustomEmoji,
} from '../emoji';
import isEmojiUnicodeSupported from '../emoji/support';
 
class GlEmoji extends HTMLElement {
  connectedCallback() {
    this.initialize();
  }
  initialize() {
    let emojiUnicode = this.textContent.trim();
    const { fallbackSpriteClass, fallbackSrc } = this.dataset;
    let { name, unicodeVersion } = this.dataset;
 
    return initEmojiMap().then(() => {
      if (!unicodeVersion) {
        const emojiInfo = getEmojiInfo(name);
 
        Eif (emojiInfo) {
          if (name !== emojiInfo.name) {
            ({ name } = emojiInfo);
            this.dataset.name = emojiInfo.name;
          }
          unicodeVersion = emojiInfo.u;
          this.dataset.unicodeVersion = unicodeVersion;
 
          emojiUnicode = emojiInfo.e;
          this.textContent = emojiInfo.e;
 
          this.title = emojiInfo.d;
        }
      }
 
      const isEmojiUnicode =
        this.childNodes &&
        Array.prototype.every.call(this.childNodes, (childNode) => childNode.nodeType === 3);
 
      const customEmoji = findCustomEmoji(name);
      const hasImageFallback = fallbackSrc?.length > 0;
      const hasCssSpriteFallback = fallbackSpriteClass?.length > 0;
 
      if (emojiUnicode && isEmojiUnicode && isEmojiUnicodeSupported(emojiUnicode, unicodeVersion)) {
        // noop
      } else if (hasCssSpriteFallback) {
        if (!gon.emoji_sprites_css_added && gon.emoji_sprites_css_path) {
          const emojiSpriteLinkTag = document.createElement('link');
          emojiSpriteLinkTag.setAttribute('rel', 'stylesheet');
          emojiSpriteLinkTag.setAttribute('href', gon.emoji_sprites_css_path);
          document.head.appendChild(emojiSpriteLinkTag);
          gon.emoji_sprites_css_added = true;
        }
        // IE 11 doesn't like adding multiple at once :(
        this.classList.add('emoji-icon');
        this.classList.add(fallbackSpriteClass);
      } else if (hasImageFallback) {
        this.innerHTML = '';
        this.appendChild(emojiImageTag(name, customEmoji?.src || fallbackSrc));
      } else {
        const src = emojiFallbackImageSrc(name);
        this.innerHTML = '';
        this.appendChild(emojiImageTag(name, src));
      }
    });
  }
}
 
export default function installGlEmojiElement() {
  Eif (!customElements.get('gl-emoji')) {
    customElements.define('gl-emoji', GlEmoji);
  }
}