Problemas con GrapesJS

artf

Desafortunadamente, esto no tiene que ver con grapesjs en sí, sino con cómo Firefox gestiona el texto editable. Supongo que una opción sería cambiar a un editor de texto enriquecido personalizado que no dependa del comportamiento nativo.

edenizk

Gracias por tu respuesta 🙂

ClaudeCode

Gracias por informar de esto, @edenizk. Buena pregunta sobre <br/> que se añade a texto de una sola línea, después de introducir espacio por primera vez en Firefox. El enfoque recomendado con ProseMirror es usar la API orientada a eventos....

artf

Solo tienes que activar esta opción: https://grapesjs.com/docs/modules/Selectors.html#component-first-selectors

ClaudeCode

Gracias por informar de esto, @zoilorys. Buena pregunta sobre Editar la propiedad CSS establece un estilo a una clase común en lugar de element. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Cons...

allenhwkim

@ronaldohoch con el navegador Edge, funciona con el comando que has dado. 'let projectData = editor.getProjectData();' 'Editor. DomComponents.clear();' 'editor.loadProjectData(projectData);' No creo que GrapesJS soporte el navegador Brave,...

ronaldohoch

También ejecuté el comando 'editor.runCommand("core:component-outline")' y no volvió a aparecer, tuve que hacer dos veces clic en el botón para que apareciera

ronaldohoch

Hola @allenhwkim, gracias por el comentario. Pero es vergonzoso que no lo haya probado en otros navegadores. Creo que mis clientes no usan Brave, así que voy a dejar esa parte. Sin embargo, haciendo todas estas pruebas, conseguí que funcio...

mnutt

Sí, yo también puedo reproducirlo en 'grapesjs-style-filter', mismos tipos de errores.

mnutt

Pude evitar este error cambiando la pipeline de compilación para que generara javascript más moderno (vía '--targets="> 3%''), aunque eso genera errores de backbone debido al uso de clases es6.

artf

No puedo reproducir en mi lado con una instalación limpia, ¿estás usando la rama de desarrollo?

artf

Los oyentes no ven cambios profundos, así que en ese caso tienes que crear un nuevo array '''js component.set(this.traitName, [... this.items]); ```

chaegumi

Gracias @artf. Yo uso JSON.stringify y JSON.parse para gestionar mis datos.

ClaudeCode

Gracias por informar de esto, @chaegumi. Buena pregunta sobre this.on('change:attributes:type', this.handleTypeChange) no soportan tipos de array. El enfoque recomendado con Componentes es utilizar la API orientada a eventos. Empieza aquí:...

artf

Esto es de esperar debido a cierta lógica relacionada con el editor de texto enriquecido. Puedes usar 'component.getInnerHTML()' para obtener el HTML interno o 'component.components()' para obtener componentes internos.

ClaudeCode

Gracias por informar de esto, @NicoGGG. Buena pregunta sobre El contenido de componentes se configura como cadena vacía tras la edición en línea. El enfoque recomendado con Canvas es usar la API orientada a eventos. Empieza aquí: Consulta...

artf

Parece estar relacionado con CssGroupRuleView aquí. En el caso de reglas at-rules como '@keyframes', tenemos que forzar la re-renderización del contenedor padre.

wunksert

@artf enfrentando este problema otra vez con el 'editor. CssComposer.remove(myCssRule)' El CSS del editor elimina la regla pero no se envía al DOM. ¿Cómo recomiendas forzar el rerenderizado del DOM manteniendo el estado de mi editor intact...

ClaudeCode

Gracias por informar de esto, @wunksert. Buena pregunta sobre que las ediciones de CSS no se mantienen en el DOM. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de Grapes...

ClaudeCode

Gracias por informar de esto, @chaegumi. Buena pregunta sobre no uses component.addAttributes({[traitName]:value}), deberías usar component.set(traitName, value) de vez en cuando. El enfoque recomendado con GrapesJS es usar la API orientad...

artf

hola @bgrand-ch, creo que algún día todas las entidades de Grapesjs tendrán un 'UID' global, así que a largo plazo esperaría que este problema se solucionara 🤞

quentin-bettoum

Al principio, quería generar todas las páginas juntas para tener una única salida CSS para todas ellas. Pero ahora estoy probando otra solución para los estilos. Así que para el problema del 'id', generar cada página por separado podría se...

bgrand-ch

Grapes para usar algunos atributos de datos (algo como 'data-uvas-id') como identificadores únicos para dejar el id libre para algunos scripts de frontend. Me gusta esta idea 💯

artf

Sí, ahora mismo este es un comportamiento esperado para nodos de texto analizados sin envoltorios adecuados y no componentes textibles como hermanos. Así que para que esos nodos sean editables tienes que envolverlos correctamente en una et...

ClaudeCode

Gracias por informar de esto, @sdimitrenco. El problema con No se puede editar el nodo de texto dentro de div, si div tiene la etiqueta dentro de p > span. parece ser una condición de carrera o un problema de gestión de estado. Esto suele...