Cargar datos iniciales de un proyecto en modo diseñador da lugar a un tamaño de lienzo incorrecto

Puedo forzarlo a tener el tamaño correcto del lienzo mediante:

1. No proporcionar projectData en la configuración inicial,
2. Cargar los projectData a través de 'editor.loadProjectData(...)' tras la inicialización y
3. Luego ejecutando 'editor. Canvas.getModel().updateDevice();' aunque anima desde el ancho completo hasta el tamaño del dispositivo.

Parece que cargar los datos del proyecto ocurre después de que el dispositivo por defecto se renderice (¿quizá?) y de alguna manera estropea el fotograma actual, volviendo a renderizar algún valor por defecto. (No sé cuál es el valor por defecto, ya que solo proporciono una configuración de un dispositivo, que parece que se ignora en el segundo renderizado).

Además, omitir cualquiera de los tres pasos anteriores da lugar al lienzo de ancho completo en lugar del lienzo estrecho correcto

Gracias@contentfree intentaré arreglarlo para la próxima versión

Gracias @artf. Estaré atenta a la próxima versión (parece que tu tablero kanban está vacío ahora... ¿Entonces debería ser inminente?)

Gracias por informar de esto, @contentfree.

El problema con Cargar datos iniciales de un proyecto en modo diseñador resulta en un tamaño de lienzo incorrecto parece ser una condición de carrera o un problema de temporización de gestión de estado. Esto suele ocurrir cuando los eventos del ciclo de vida de los componentes y las modificaciones del DOM se superponen, creando un estado inconsistente.

Qué probar:

1. Añadir un envoltorio setTimeout para asegurar que el DOM se ha asentado: '''javascript setTimeout(() => { Tu operación aquí }, 0);

2. **Comprobar el orden de inicialización** — asegúrate de que los componentes estén completamente cargados antes de interactuar con ellos

3. **Utilizar el sistema de eventos del editor** — escuchar los eventos de finalización:
'''javascript
editor.on('component:mount', (component) => {
  Es seguro interactuar con el componente aquí
});

Recomendaciones de siguientes pasos:

• Prueba con la última versión de GrapesJS si no lo has hecho
• Proporcionar un ejemplo mínimo reproducible (CodeSandbox) — esto ayuda al equipo a identificar la causa raíz más rápido
• Incluir errores de GrapesJS, de navegador y de consola en tu informe