twemoji.js - validate data before passing to twemoji.parse

[peterwilsoncc]

Per #32109 passing an null or undefined node to twemoji for parsing throws a fatal JavaScript error.

I propose validating the data before attempting to emojify it. grabAllTextNodes assumes the presence of node.childNodes, so it's worth checking for that too.

Following a discussion with @azaozz, I'll upload two options:

*.1.diff - checks neither node or node.childNodes are null
*.2.diff - checks neither node or node.textContent are null or undefined

[peterwilsoncc]

validate node && node.childNodes

[peterwilsoncc]

validate node && node.textContent

[peterwilsoncc]

After further discussion with azaozz, was considered best to move the validation to wp.emoji.parse.

It's worth unit testing, but I'm not sure how to go about it. I know it works with the following in the console.

wp.emoji.parse( null );
wp.emoji.parse();
wp.emoji.parse( {} );
wp.emoji.parse( [] );
wp.emoji.parse( "" );
wp.emoji.parse( "

[azaozz]

Looking at 32300.3.diff: for an HTML element node.childNodes is an array. It evaluates to true even when empty. We don't need to call twemoji.parse() in these cases, returning early in 32300.4.diff.

[peterwilsoncc]

Thanks Andrew, really vauge moment and forgot that within seconds of talking about it :/

Just noticed trac cuts off emoji and beyond in the unit tests, in full from comment:1

wp.emoji.parse( null );
wp.emoji.parse();
wp.emoji.parse( {} );
wp.emoji.parse( [] );
wp.emoji.parse( "" );
wp.emoji.parse( "\uD83D\uDC3C\uD83C\uDDE8\uD83C\uDDF3" ); //panda, china
wp.emoji.parse( document.body );
wp.emoji.parse( function(){} );
wp.emoji.parse( document.createElement( 'p' ).appendChild( document.createElement( 'strong') ) );
wp.emoji.parse( document.createElement( 'svg' ).appendChild( document.createElement( 'path' ) ) );
wp.emoji.parse( window );

The aim is to just chuck everything at it ensure it passes.

[azaozz]

In 32679:

Emoji: make sure we parse only strings or DOM nodes that have children.
Props peterwilsoncc. Fixes #32300.