WordPress.org
Get WordPress

Make WordPress Core

Ticket #44367: docs-emoji.diff

File docs-emoji.diff, 3.8 KB (added by nicollle, 5 years ago)

  • src/js/_enqueues/wp/emoji.js 

    diff --git src/js/_enqueues/wp/emoji.js src/js/_enqueues/wp/emoji.js
index 46cddd02be..b240560b52 100644
     
    11
    22( function( window, settings ) {
     3        /**
     4         * Replaces text with Twitter emojis.
     5         *
     6         * Description. (use period)
     7         *
     8         * @since      4.2.0
     9         * @access     private
     10         *
     11         * @class
     12         *
     13         * @see  Twitter Emoji library
     14         * @link https://github.com/twitter/twemoji
     15         *
     16         * @return {Object} The wpEmoji parse and test functions.
     17         */
    318        function wpEmoji() {
    419                var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver,
    520
    … …  
    3449                /**
    3550                 * Runs when the document load event is fired, so we can do our first parse of the page.
    3651                 *
     52                 * Listens to all the DOM mutations and checks for added nodes that
     53                 * contain emoji characters and replaces those with twitter emoji
     54                 * images.
     55                 *
    3756                 * @since 4.2.0
    3857                 */
    3958                function load() {
    … …  
    4160                                return;
    4261                        }
    4362
     63                        // Ensure twemoji is available on the global window before proceeding.
    4464                        if ( typeof window.twemoji === 'undefined' ) {
    4565                                // Break if waiting for longer than 30 sec.
    4666                                if ( count > 600 ) {
    … …  
    5878                        twemoji = window.twemoji;
    5979                        loaded = true;
    6080
     81                        // Initialize the mutation observer, which checks all added nodes for replaceable emoji characters.
    6182                        if ( MutationObserver ) {
    6283                                new MutationObserver( function( mutationRecords ) {
    6384                                        var i = mutationRecords.length,
    … …  
    6889                                                removedNodes = mutationRecords[ i ].removedNodes;
    6990                                                ii = addedNodes.length;
    7091
     92                                                /*
     93                                                 * Checks if an image has been replaced by a text element
     94                                                 * with the same text as the alternate description of the replaced image.
     95                                                 * (presumably because the image could not be loaded).
     96                                                 * If it is, do absolutely nothing.
     97                                                 *
     98                                                 * Node type 3 is a TEXT_NODE.
     99                                                 * See: https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType
     100                                                 */
    71101                                                if (
    72102                                                        ii === 1 && removedNodes.length === 1 &&
    73103                                                        addedNodes[0].nodeType === 3 &&
    … …  
    78108                                                        return;
    79109                                                }
    80110
     111                                                // Loop through all the added nodes.
    81112                                                while ( ii-- ) {
    82113                                                        node = addedNodes[ ii ];
    83114
     115                                                        // Node type 3 is a TEXT_NODE.
    84116                                                        if ( node.nodeType === 3 ) {
    85117                                                                if ( ! node.parentNode ) {
    86118                                                                        continue;
    … …  
    92124                                                                         * It unnecessarily splits text nodes when it encounters a HTML
    93125                                                                         * template interpolation symbol ( "{{", for example ). So, we
    94126                                                                         * join the text nodes back together as a work-around.
     127                                                                         *
     128                                                                         * Node type 3 is a TEXT_NODE.
    95129                                                                         */
    96130                                                                        while( node.nextSibling && 3 === node.nextSibling.nodeType ) {
    97131                                                                                node.nodeValue = node.nodeValue + node.nextSibling.nodeValue;
    … …  
    102136                                                                node = node.parentNode;
    103137                                                        }
    104138
     139                                                        /*
     140                                                         * If the class name of a non-element node contains 'wp-exclude-emoji' ignore it.
     141                                                         *
     142                                                         * Node type 1 is an ELEMENT_NODE.
     143                                                         */
    105144                                                        if ( ! node || node.nodeType !== 1 ||
    106145                                                                ( node.className && typeof node.className === 'string' && node.className.indexOf( 'wp-exclude-emoji' ) !== -1 ) ) {
    107146
    … …  
    155194                function parse( object, args ) {
    156195                        var params;
    157196
     197                        /*
     198                         * If the browser has full support, twemoji is not loaded or our
     199                         * object is not what was expected, we do not parse anything.
     200                         */
    158201                        if ( settings.supports.everything || ! twemoji || ! object ||
    159202                                ( 'string' !== typeof object && ( ! object.childNodes || ! object.childNodes.length ) ) ) {
    160203
    161204                                return object;
    162205                        }
    163206
     207                        // Compose the params for the twitter emoji library.
    164208                        args = args || {};
    165209                        params = {
    166210                                base: browserSupportsSvgAsImage() ? settings.svgUrl : settings.baseUrl,