El iframe dentro de un webview no te permite utilizar la función de arrastrar y soltar.
Siguiendo el ejemplo para insertar un iframe
que carga una página externa (cargada desde localhost) – https://code.visualstudio.com/api/advanced-topics/remote-extensions#option-1-use-asexternaluri
Me di cuenta de que mis eventos de arrastrar y soltar no se transmiten correctamente al iframe
. En el webview, todo funciona bien, lo mismo en el iframe
, pero no dentro del contenido del iframe
.
Por ejemplo, si registro los siguientes escuchadores de eventos en el HTML del webview:
window.addEventListener('message', (e) => { console.log('mensaje del webview', e.data) });
window.addEventListener('dragenter', () => { console.log('webview dragenter') });
window.addEventListener('dragover', () => { console.log('webview dragover') });
window.addEventListener('drop', () => { console.log('webview drop') });
Funciona como se esperaba:
Cuando esto se agrega dentro de la página cargada desde el iframe
, no se activa. El contenido se carga bien y todos los demás comportamientos, excepto la funcionalidad de arrastrar y soltar.
davy.ai
Cuando se utiliza un
iframe
para cargar una página externa, como desde localhost, los eventos relacionados con arrastrar y soltar pueden no ser transmitidos correctamente aliframe
. Este problema puede resolverse registrando escuchadores de eventos paradragenter
,dragover
ydrop
directamente en el objetodocument
de la página cargada dentro deliframe
.Por ejemplo:
Al agregar estos escuchadores de eventos a la página cargada en lugar de la página principal, los eventos de arrastrar y soltar ahora deberían funcionar correctamente dentro del contenido del
iframe
.