0

I needed a way to split strings with compound emojis into an array and I found a way to accomplish that (see question Is there still no easy way to split strings with compound emojis into an array?).

The regex I ended up using looks like this:

let regex = /\p{RI}\p{RI}|\p{Emoji}(\p{Emoji_Modifier}|\u{FE0F}\u{20E3}?|[\u{E0020}-\u{E007E}]+\u{E007F})?(\u{200D}\p{Emoji}(\p{Emoji_Modifier}|\u{FE0F}\u{20E3}?|[\u{E0020}-\u{E007E}]+\u{E007F})?)*|./gsu
    words = words.map(word => {
      return word.match(regex)
    })

This worked great until a recent update on the server (on which I have very limited influence). The current package versions are these:

next 12.1.6
react 17.0.2
react-dom 17.0.2
@babel/runtime 7.17.7

This is the mentioned error message:

/node_modules/Sections/Hero/index.js: Failed to recognize value `undefined` for property `Regional_Indicator`.
    at CN (babel.7.12.12.min.js:1:1067100)
    at babel.7.12.12.min.js:1:1067328
    at DN (babel.7.12.12.min.js:1:1067334)
    at e (babel.7.12.12.min.js:1:1068730)
    at babel.7.12.12.min.js:1:1069345
    at Array.map (<anonymous>)
    at e (babel.7.12.12.min.js:1:1069321)
    at babel.7.12.12.min.js:1:1069345
    at Array.map (<anonymous>)
    at e (babel.7.12.12.min.js:1:1069321)

Besides \p{RI} the same error also triggers for \p{Emoji_Modifier} and \p{Emoji}.

Is this a bug in the babel version?
Is there a way to make the Unicode Property Escapes work in this setup?

There are solutions with a (very) long regex [see comment by Wiktor], but if possible I would prefer a way to do it with Unicode Property Escapes. The coverage would be good enough for the use case of this project (https://caniuse.com/?search=Unicode%20property%20escapes).

There is this issue for next that mentions Unicode Property Escapes, but I'm not sure whether this is relevant for next 12.

Here is a minimal example of what the code is supposed to do (the error is not showing here though) https://codesandbox.io/s/beautiful-framework-q4dw1d?file=/src/index.js

jost21
  • 1,084
  • 3
  • 15
  • 29
  • See [this answer](https://stackoverflow.com/a/69115223/3832970), the bottom of it. If you need the Emoji v.14.0 version, please let know, I will update. – Wiktor Stribiżew Aug 23 '22 at 11:51
  • I updated it to v.14.0. – Wiktor Stribiżew Aug 23 '22 at 12:11
  • Thank you:) Your solution works and I will use for now. However I was hoping there is a way to not include a regex that is bigger than the entire rest to the component ;) I do not care about IE too much, so if there is a way to use the Unicode Property Escapes / Emoji Properties, I would prefer that. It worked before after all. – jost21 Aug 23 '22 at 15:23

0 Answers0