Issue #2637💬 RespondidoAbierto el 11 de marzo de 2020por mcottretReacciones 1

Modo de vista previa y desactivación automática de bordes de componentes

Respuesta rápidapor artf1

botón ya estaría desactivado para cuando se ejecutara la partida de Preview, ¿es correcto? Ah, sí, claro 🤦 ♂ Por tu respuesta sobre el problema enlazado, entiendo que este comportamiento es intencionado, así que quizá la solución sea simplemente separar los contextos de los dos botones como sugeriste. Vale, puede que...

Lee la respuesta completa abajo ↓

Pregunta

Hola de nuevo, :)

Nuestro equipo empezó recientemente a personalizar el editor y a eliminar el preajuste de la página web, y puede que hayamos encontrado algunos errores relacionados con el modo de vista previa:

  1. Al salir del modo de previsualización, puede aparecer un error si se ha eliminado el panel predeterminado de 'opciones', o si se ha eliminado el botón 'sw-visibility' (de aquí, si 'editor. Panels.getButton('options', 'sw-visibility')' da 'null', cf. #2589)

Una solución propuesta sería recorrer en bucle la colección de paneles (consultada a través de 'editor. Panels.getPanels') para encontrar el botón 'sw-visibility', así como añadir comprobaciones nulas para evitar errores.


  1. Cuando los botones 'previsualización' y 'visibilidad sw' están en el mismo panel, el comportamiento introducido por el #2589 se rompe, esto parece provenir del 'ButtonView''s active change listener, que desactiva todos los botones activos en el panel. Así que si la vista previa está activada, desactiva el botón de 'visibilidad sw' antes de ejecutar el comando, lo que luego rompe su comprobación activa.

Me temo que no puedo proponer una solución respecto a este punto 2. Debido a mi falta de conocimiento sobre los posibles efectos secundarios al modificar los botones Active Change Listener. Pero podría incluir tus sugerencias en un departamento de relaciones públicas si hace falta.

Estaría encantado de abrir un PR, o como esto está bastante relacionado con el #2636, arreglar ambos problemas en uno.

¡Saludos :)

Respuestas (3)

artf21 de marzo de 2020

botón ya estaría desactivado para cuando se ejecutara la partida de Preview, ¿es correcto?

Ah, sí, claro 🤦 ♂

Por tu respuesta sobre el problema enlazado, entiendo que este comportamiento es intencionado, así que quizá la solución sea simplemente separar los contextos de los dos botones como sugeriste.

Vale, puede que funcione de verdad... al estar en un contexto diferente, no se detendrá con otros botones, y también puedes dejar de depender de los botones por completo (como has dicho, puedo colocarlo en otro panel) y comprobar el estado del comando usando Commands.getActive API '''js si ('SW-visibility' en el editor. Commands.getActive()) { La visibilidad de SW está activa }

artf18 de marzo de 2020

Gracias @mcottret por todas las referencias, el número está realmente bien escrito :)

Cuando los botones de vista previa y de visibilidad de pantalla están en el mismo panel, el comportamiento introducido por el #2589 se rompe, esto parece provenir del escuchador activo de cambio de ButtonView, que desactiva todos los botones activos del panel. Así que si la vista previa está activada, se desactiva el botón de visibilidad de la pantalla de seguridad antes de ejecutar el comando, lo que luego rompe su comprobación activa.

Creo que, en este caso, deberíamos crear una bandera de variable comprobando si la visibilidad de la variable está activa antes de hacer esto: https://github.com/artf/grapesjs/blob/85b7b82103e12fb01a3700b1002a57a7b60ccaf1/src/commands/view/Preview.js#L20 Luego, en 'parar', comprobamos la variable almacenada al iniciar (en lugar del botón)

mcottret20 de marzo de 2020

¡Gracias por la respuesta @artf

Lo siento, pero no estoy seguro de cómo hacer que esto funcione; por lo que tengo entendido, el active change listener se ejecuta antes de la 'ejecución' de 'Preview', así que el botón de 'sw-visibility' ya estaría desactivado para cuando se ejecutara 'Preview', pase lo que pase, ¿es correcto?

Por tu respuesta al problema enlazado, entiendo que este comportamiento es intencionado, así que quizá la solución sea simplemente separar los dos contextos de los botones como sugeriste.


¿Qué opinas del punto 1? ¿Y mi solución propuesta? Ya he añadido la protección por si el botón de 'visibilidad sw' se hubiera eliminado en este PR, pero no gestiona casos en los que el botón de 'sw-visibility' esté presente en otro panel personalizado (con un id distinto a 'opciones').

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.

Explora plugins gratuitos →
Opción premium

Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.

Explora plugins premium →

Explorar categorías de plugins

Ve directamente a las páginas de categorías de plugins en el marketplace.