Impossible de modifier les widgets dans l'éditeur WYSIWYG

Récemment, la modification des widgets dans l'éditeur WYSIWYG ne fonctionne plus.

La console du navigateur affiche l'erreur suivante lorsque je clique sur un widget:

Uncaught DOMException: Failed to execute 'setBaseAndExtent' on 'Selection': There is no child at offset 1.
    at Editor.<anonymous> (http://example.com/js/tiny_mce/tiny_mce.js:1:15327)
    at Dispatcher.dispatch (http://example.com/js/tiny_mce/tiny_mce.js:1:6000)
    at DOMUtils.c (http://example.com/js/tiny_mce/tiny_mce.js:1:184650)
    at j (http://example.com/js/tiny_mce/tiny_mce.js:1:58627)
    at HTMLDocument.y (http://example.com/js/tiny_mce/tiny_mce.js:1:58785)
(anonymous) @ tiny_mce.js:1
dispatch @ tiny_mce.js:1
c @ tiny_mce.js:1
j @ tiny_mce.js:1
y @ tiny_mce.js:1
tiny_mce.js:1 Uncaught DOMException: Failed to execute 'setBaseAndExtent' on 'Selection': There is no child at offset 1.
    at Editor.<anonymous> (http://example.com/js/tiny_mce/tiny_mce.js:1:15327)
    at Dispatcher.dispatch (http://example.com/js/tiny_mce/tiny_mce.js:1:6000)
    at DOMUtils.c (http://example.com/js/tiny_mce/tiny_mce.js:1:184650)
    at j (http://example.com/js/tiny_mce/tiny_mce.js:1:58627)
    at HTMLDocument.y (http://example.com/js/tiny_mce/tiny_mce.js:1:58785)

Et la fenêtre contextuelle pour créer un nouveau widget apparaît, au lieu de celle pour modifier le widget existant.

J'ai trouvé le comportement sur différentes versions de Magento CE 1.x et EE 1.x, dans Chrome, quel que soit le système d'exploitation. Peut-il être lié au récent correctif de sécurité SUPEE-9767?

Apparemment, il n'est pas lié au correctif, mais à la dernière mise à jour de Chrome ( Chrome 58 ) qui a été déployée à la même époque. TinyMCE utilise des fonctionnalités obsolètes qui ont été supprimées dans cette version.

Magento 2.0 et 2.1 sont également affectés (voir: https://github.com/magento/magento2/issues/9518 )

Cela semble être un problème avec les images en général, voici un problème lié au projet TinyMCE: https://github.com/tinymce/tinymce/issues/3611 TinyMCE 4.6 résout le problème.

Vous disposez maintenant des options suivantes:

• remplacer la version TinyMCE fournie par 4.6 ou plus récente
• attendez que Magento publie un correctif qui met à jour TinyMCE et utilisez ensuite d'autres navigateurs (actuellement, seul Chrome semble être un problème) et espérez qu'ils ne supprimeront pas les fonctionnalités obsolètes aussi rapidement.

Une solution rapide que j'ai appliquée consistait à remplacer le fichier JS tiny_mce par ma propre version corrigée.

        editor.onClick.add(function(editor, e) {
            e = e.target;

-           // Workaround for bug, http://bugs.webkit.org/show_bug.cgi?id=12250
-           // WebKit can't even do simple things like selecting an image
-           // Needs tobe the setBaseAndExtend or it will fail to select floated images
            if (/^(IMG|HR)$/.test(e.nodeName)) {
-               selection.getSel().setBaseAndExtent(e, 0, e, 1);
+               /** Removed webkit bug fix - it breaks in Chrome 58 */
+                selection.select(e);
            }

            if (e.nodeName == 'A' && dom.hasClass(e, 'mceItemAnchor') {

Pour un hack paresseux. Mettez l'image en surbrillance avec votre curseur (comme si vous sélectionniez du texte). Une fois mis en évidence, il est cliquable.

Merci, TylerSN

Dans mon cas, le code qui devait être supprimé ressemblait à ceci:

if (tinymce.isWebKit && e.nodeName == 'IMG')
    t.selection.getSel().setBaseAndExtent(e, 0, e, 1);

Remarque: il s'agissait d'une version originale de tiny_mce (v3.5.4, 2011-09-06), pas une faveur de Magento . Cependant, je suis tombé sur cette question lors de la recherche Uncaught DOMException: Failed to execute 'setBaseAndExtent' on 'Selection': There is no child at offset 1. at Editor.<anonymous>et j'ai voulu ajouter la solution pour la référence d'autres personnes. J'espère que le légèrement «hors sujet» peut être excusé dans cette circonstance.