Não é mais possível editar widgets no editor WYSIWYG

8

Recentemente, a edição de widgets no editor WYSIWYG não funciona mais.

O console do navegador mostra o seguinte erro quando clico em um 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)

E o pop-up para criar um novo widget aparece, em vez daquele para editar o widget existente.

Encontrei o comportamento em diferentes versões do Magento CE 1.xe EE 1.x, no Chrome, independentemente do sistema operacional. Pode estar relacionado ao recente patch de segurança SUPEE-9767?

— Fabian Schmengler
fonte

10

Aparentemente, não está relacionado ao patch, mas à atualização mais recente do Chrome ( Chrome 58 ), lançada na mesma época. O TinyMCE usa recursos obsoletos que foram removidos nessa versão.

O Magento 2.0 e 2.1 também são afetados (consulte: https://github.com/magento/magento2/issues/9518 )

Parece ser um problema com imagens em geral. Aqui está um problema relacionado ao projeto TinyMCE: https://github.com/tinymce/tinymce/issues/3611 O TinyMCE 4.6 corrige o problema.

Agora você tem as seguintes opções:

substitua a versão do TinyMCE incluída na versão 4.6 ou mais recente
espere até o Magento lançar um patch que atualize o TinyMCE e até então use outros navegadores (atualmente apenas o Chrome parece ser um problema) e espere que eles não removam os recursos preteridos tão cedo.

— Fabian Schmengler
fonte

Obrigado pela pesquisa detalhada, tenho sido preguiçoso sobre isso ^^ #

— Raphael no Digital Pianism

3

Uma solução rápida que apliquei foi substituir o arquivo JS tiny_mce pela minha própria versão corrigida.

        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') {

Para um hack preguiçoso. Destaque a imagem com o cursor (como se você estivesse selecionando texto). Uma vez destacado, é clicável.

— TylersSN
fonte

2

Obrigado, TylerSN

No meu caso, o código que teve que ser removido ficou assim:

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

Observe: Era uma versão tiny_mce original (v3.5.4, 06/09/2011), não um favor do Magento . No entanto, deparei-me com essa pergunta enquanto procurava Uncaught DOMException: Failed to execute 'setBaseAndExtent' on 'Selection': There is no child at offset 1. at Editor.<anonymous>e queria adicionar a solução para referência de outras pessoas. Espero que o pouco "fora de tópico" possa ser desculpado nessa circunstância.

— Martin Rüegg
fonte