About Detecting Emoji in JavaScript

Emojis are quite a beast of Unicode. They might take a varying amount of bytes depending on modifiers (like color and gender), and it's complicated to detect them. Nevertheless, here is one approach to wrap emoji into spans using regular expressions:

const wrapEmoji = (text) => {
    const reEmoji = /\p{RI}\p{RI}|\p{Emoji}(\p{EMod}+|\u{FE0F}\u{20E3}?|[\u{E0020}-\u{E007E}]+\u{E007F})?(\u{200D}\p{Emoji}(\p{EMod}+|\u{FE0F}\u{20E3}?|[\u{E0020}-\u{E007E}]+\u{E007F})?)+|\p{EPres}(\p{EMod}+|\u{FE0F}\u{20E3}?|[\u{E0020}-\u{E007E}]+\u{E007F})?|\p{Emoji}(\p{EMod}+|\u{FE0F}\u{20E3}?|[\u{E0020}-\u{E007E}]+\u{E007F})/gu;
    return text.replace(reEmoji, '<span class="emoji" role="img" aria-hidden="true">$&</span>');
}

Tips and Tricks Programming JavaScript Regular Expressions Unicode

Django/Python Consulting

If you have a specific Django challenge or integration you'd like to solve, I'd be happy to help. Book a free 30-minute call to discuss your project, see if we're a good fit, and explore the best approach for your needs. After the call, you'll receive a tailored cost estimate based on what we discuss.