search

GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
BSD 3-Clause "New" or "Revised" License
22.36k stars 4.05k forks source link

[BUG] Quick mouse clicks/movements can cause the editor to freeze #2692

Closed mazuschlag closed 3 years ago

mazuschlag commented 4 years ago

First off thanks for all your hard work on the project! This is a very great project that a lot of people depend upon, so thanks for your effort.

This is a weird one, but the basic gist of it is that moving your mouse quickly as you click on an element can cause the builder to freeze. This isn't always a huge problem but it can be annoying when working quickly. You can reproduce this issue in the GrapesJS website demo page.

To reproduce:

  1. Open GrapesJS and add a variety of content
  2. Click and move the mouse quickly over an element.

It doesn't always reproduce, but when it does the whole builder freezes. This may get worse/easier to reproduce as more content is added to the editor.

artf commented 4 years ago

Hi @mazuschlag and thanks for your kind words. About the issue, can you elaborate better on the click and move behavior? Should I just select one component and only move around the mouse? There was an issue with moving around components that cause a freeze of the application (basically it was possible to drop a component inside its own children causing this an infinite loop) but it was fixed few releases ago.

mazuschlag commented 4 years ago

Hmm that does sort of sound like the problem I was experiencing. This involves holding down the left click on the mouse as you quickly drag a component before releasing it. This happens when working quickly - you click on a component and as you move your mouse away (while still clicking down for a moment) the editor gets "stuck". You can unfreeze it by clicking on the component again and dragging it somewhere.

artf commented 4 years ago

@mazuschlag so, are you using an old version or the latest of grapesjs? I'm not able to reproduce it on the latest

mazuschlag commented 4 years ago

A coworker was able to capture the issue on video: https://www.screencast.com/t/9FKTJed5cLzv It was repro'd in the newsletter demo page, which says is on grapesjs 0.16.3

artf commented 4 years ago

I'm still not able to reproduce it even by doing the same thing... errors in console?

mazuschlag commented 4 years ago

Unfortunately there are no errors in the console.

makkaronis4e commented 4 years ago

Facing the same issue. Its not something new, i've been experiencing it since last summer.

artf commented 4 years ago

@makkaronis4e same behavior for reproduction?

makkaronis4e commented 4 years ago

@artf yep, same behavior. Just fast clicking on blocks. I can easily reproduce it on demo.

Kenny1994 commented 4 years ago

@artf I'm facing the same issue, when you clicking move & click mouse quickly, the whole editor will freeze

artf commented 4 years ago

Ok, I was able to reproduce it somehow, not sure what is exactly the cause but for some reason, the SelectComponent command (which is responsible for a lot of stuff in the canvas) doesn't restart after drag & drop is ended. I'm actually able to reactivate it by enabling D&D on some other component or changing the device view (eg. to mobile). Can you confirm this behavior guys so at least I know we're talking about the same bug?