search

twitter / twemoji

Emoji for everyone. https://twemoji.twitter.com/
MIT License
16.83k stars 1.85k forks source link

Add exclude callback to bypass replacing emojis in certain HTML elements #587

Open azaozz opened 1 year ago

azaozz commented 1 year ago

When replacing emojis with images in a whole HTML document, there may be areas/elements that need to be excluded from processing. For example: inline editors or elements with contentEditable. Ideally in such elements emoji characters would not be replaced. The replacement should happen when the edited content is displayed.

A nice way to control which HTML elements should be excluded from processing would probably be to have a callback function (that would return true/false) in the while loop in grabAllTextNodes().

I've considered using VS15 (U+FE0E) to force text presentation, however that is not suitable for use in inline editors/contentEditable. The requirement there is for emoji characters to be kept unchanged as the users have entered them.

azaozz commented 1 year ago

There is a (pretty crude) example of how that can be implemented: https://github.com/WordPress/wordpress-develop/pull/3800. Note that the patch there is a "hotfix" to implement the above feature in the built twemoji.js. Can make a proper PR if needed.