2. Methods

Methods

Emoji-Fallback.js provides several methods for handling emoji rendering. Below are detailed descriptions of each method available in the library.

1. emojiSupported()

Checks if the browser supports native emoji rendering.

Returns

• boolean: Returns true if the browser supports emojis natively; otherwise, returns false.

Example

const isSupported = emojiSupported();
console.log(`Native emoji support: ${isSupported}`);

2. parseEmoji(element, cdn, className)

Replaces Unicode emojis with image emojis using Twemoji if native emoji support is not available.

Parameters

• element: Element | DocumentFragment (optional, default: document.body)
  The DOM element to parse for emojis. This can be a specific element or the entire body.

• cdn: string (optional, default: https://cdn.jsdelivr.net/gh/twitter/[email protected]/assets/)
  The CDN URL for Twemoji assets. This should point to where the Twemoji images are hosted.

• className: string (optional, default: emoji)
  The CSS class name to apply to the replaced emoji images, allowing for custom styling.

Returns

• Promise: Resolves when the parsing and replacement are complete.

Throws

• Error: If the provided element, CDN URL, or class name is invalid.

Example

await parseEmoji(document.getElementById('emoji-container'), 
                  'https://your-cdn-url/', 
                  'emoji-class');

3. emojiFallback(element, cdn, className)

Checks if emojis are supported and falls back to Twemoji if they are not.

Parameters

• element: Element | DocumentFragment (optional, default: document.body)
  The DOM element to parse for emojis.

• cdn: string (optional, default: https://cdn.jsdelivr.net/gh/twitter/[email protected]/assets/)
  The CDN URL for Twemoji assets.

• className: string (optional, default: emoji)
  The CSS class name to apply to the replaced emoji images.

Returns

• Promise: Resolves when the fallback to Twemoji is complete.

Throws

• Error: If there is an error during the fallback process.

Example

await emojiFallback(document.getElementById('emoji-container'), 
                     'https://your-cdn-url/', 
                     'emoji-class');