Estoy creando un bloque de Gutenberg personalizado para WordPress usando @wordpress/create-block, estoy usando el componente MediaUpload React, al que se puede hacer referencia aquí https://github.com/WordPress/gutenberg/blob/HEAD/packages/ bloque-editor/src/components/media-upload/README.md .

El bloque contiene un elemento de video HTML5 actualizable por el usuario. Mi pregunta es: ¿cómo puedo hacer que cuando el usuario cargue el video de su elección lo vea en la vista previa de la pantalla de edición de publicaciones en WordPress? Actualmente, cuando el usuario carga su video y se actualiza el atributo src, no ve el video en la vista previa a menos que publique la publicación y luego actualice la página.

Estoy usando el componente MediaUpload importado de @wordpress/block-editor Cuando el usuario selecciona su imagen, en realidad crea un objeto de imagen, este objeto de imagen tiene una serie de propiedades que incluyen "url" para que podamos pasarlo a una función como un argumento.

Esto actualiza el src usando una función simple. Paso el imageObject y luego actualizo la url usando imageObject.url

Para mayor claridad, así es como se ve el elemento de video en el inspector del navegador antes de que el usuario cargue su video.

Luego usan el botón de carga en el panel lateral y esto los dirige al administrador de medios para seleccionar su archivo.

Cuando se completa este paso y regresan a la pantalla de edición posterior, el atributo src del elemento de video se ha actualizado, pero el DOM no se ha actualizado, por lo que el usuario no ve el cambio en el área de edición posterior de Gutenberg. Si publican o guardan los cambios y luego actualizan la página, verán el video que agregaron, pero esto es confuso para el usuario, necesito que puedan ver el cambio inmediatamente sin guardar ni actualizar. ¿Hay alguna manera de que pueda lograr esto?