Links/forms in ACF block previews navigate the iframed editor canvas on WP 7.1 (crashes editor when cross-origin)

Abierto
  • ¿Algo no está bien?
#1,046 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
Medio día
Aptitud para principiantes
52/100
Tipo de issue
Error
Claridad
Bastante claro
Estado de actividad
Activo
Stack tecnológico
javascript, php, wordpress
Área
frontend

Línea de trabajo

Start with the existing "Navigation prevented for" handling in the acf-pro-blocks scripts, and look at how .acf-block-preview is rendered. Reproduce by adding a block whose render output contains an a with an external href, then clicking it in the editor. Done means clicks on non-hash a[href] and form submits inside the preview no longer navigate the canvas, while block selection still works.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Environment
WordPress 7.1.3 (post editor canvas always iframed, shouldIframe: true)
ACF PRO 6.8.10
Blocks registered via block.json with no block version declared (so V3 by default since 6.8.9), "acf": { "mode": "edit" }, server-rendered with render_callback

Steps to reproduce
Register an ACF block whose render output contains an (any non-# link).
Add it to a post in the block editor on WP 7.1. The preview renders, which is the V3 default.
Click the link in the preview.

Expected
Clicking a link in a block preview selects the block. It doesn’t navigate.

Actual
The click navigates the editor-canvas iframe to the link’s URL. Core’s iframe only intercepts #hash links (interceptLinkClicks in block-editor).
Same-origin link: the frontend page silently replaces the editor canvas.
Cross-origin link: the canvas window becomes cross-origin. The next time a block unmounts or re-renders, the editor crashes with “The editor has encountered an unexpected error”:

SecurityError: Failed to read a named property 'removeEventListener' from 'Window':
Blocked a frame with origin "https://example.com" from accessing a cross-origin frame.
    at wp-includes/js/dist/compose.min.js (useRefEffect cleanup)
    at $e / Bt (useMergeRefs cleanup)

A

in a preview, such as Gravity Forms, navigates the canvas on submit in the same way.

Why this is new
Before 7.1, V2 blocks disabled the iframe, and mode: edit showed the field form rather than the rendered preview. On WP 7.1 with ACF 6.8.9+, these blocks are V3 and show live, clickable server HTML inside an iframe that core doesn’t guard. ACF already prevents navigation for inline-editing elements (Navigation prevented for … in acf-pro-blocks), but not for the rest of the preview.

Suggested fix
Inside .acf-block-preview, preventDefault() capture-phase click events on non-# a[href] and submit events on forms, while leaving propagation alone so block selection still works.

Workaround we’re using
A small mu-plugin that does exactly that, via an inline script on enqueue_block_assets when is_admin() is true.
Lenguaje dominante
PHP
Estrellas
947
Forks
198
Sin PR fusionados en 30 d

Preparar el entorno

Este proyecto no incluye contenedor de desarrollo, Dockerfile ni guía de contribución, así que la configuración corre por tu cuenta: empieza por su README y consulta nuestra guía para la primera contribución para los pasos generales.

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de AdvancedCustomFields/acf

Todos los issues de AdvancedCustomFields/acf

Issues similares

Más issues de PHP

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.