From fb8b991809bb679d4c6b0bb15c1588e92f854144 Mon Sep 17 00:00:00 2001 From: pento Date: Sat, 14 Nov 2015 09:51:02 +0000 Subject: [PATCH] Emoji: Ensure twemoji kicks in on certain DOM mutations. Twemoji will replace the `img` with the emoji character, in the event that the image fails to load. We deliberately avoid trying to change that emoji character when it's changed back. We do need to replace emoji characters that are changed by something other than Twemoji, which this rectifies. Fixes #34640. git-svn-id: https://develop.svn.wordpress.org/trunk@35637 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-includes/js/twemoji.js | 5 +++-- src/wp-includes/js/wp-emoji.js | 9 ++++++++- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/src/wp-includes/js/twemoji.js b/src/wp-includes/js/twemoji.js index 5874318ed1..6432308507 100644 --- a/src/wp-includes/js/twemoji.js +++ b/src/wp-includes/js/twemoji.js @@ -386,7 +386,7 @@ var twemoji = (function ( ); if (src) { img = new Image(); - img.onerror = twemoji.onerror; + img.onerror = options.onerror; img.setAttribute('draggable', 'false'); attrib = options.attributes(icon, variant); for (attrname in attrib) { @@ -550,7 +550,8 @@ var twemoji = (function ( base: typeof how.base === 'string' ? how.base : twemoji.base, ext: how.ext || twemoji.ext, size: how.folder || toSizeSquaredAsset(how.size || twemoji.size), - className: how.className || twemoji.className + className: how.className || twemoji.className, + onerror: how.onerror || twemoji.onerror }); } diff --git a/src/wp-includes/js/wp-emoji.js b/src/wp-includes/js/wp-emoji.js index 3c0902a5ac..f87e083986 100644 --- a/src/wp-includes/js/wp-emoji.js +++ b/src/wp-includes/js/wp-emoji.js @@ -58,7 +58,8 @@ ii === 1 && removedNodes.length === 1 && addedNodes[0].nodeType === 3 && removedNodes[0].nodeName === 'IMG' && - addedNodes[0].data === removedNodes[0].alt + addedNodes[0].data === removedNodes[0].alt && + 'load-failed' === removedNodes[0].getAttribute( 'data-error' ) ) { return; } @@ -155,6 +156,12 @@ } return ''.concat( options.base, icon, options.ext ); + }, + onerror: function() { + if ( twemoji.parentNode ) { + this.setAttribute( 'data-error', 'load-failed' ); + twemoji.parentNode.replaceChild( document.createTextNode( twemoji.alt ), twemoji ); + } } };