Clicking Elements Triggers Re-Ordering And New Rows

[dtcblyth]

Related thread: https://discord.com/channels/1041765492907589683/1305760480249249854

The Problem:

I’ve noticed that just clicking elements in the Visual Builder can cause problems:

1. Elements are sometimes re-ordered.
2. New elements are sometimes created.

I have attached two screen recordings:

1. One screen recording shows Sections being re-ordered just by clicking them.
2. The second recording shows a new Row being created just by clicking on a module.

The re-ordering screen recording uses three Sections, each with one Row and a Text module in it. All I have done is click between the Sections.

The Row-creating screen recording uses a single Section with multiple Rows in it. Each individual Row contains a single module. I am using Divi Pricing Tables for the screen recording but was also able to recreate the issue with Blurb modules. I wasn’t able to recreate the issue with Text modules... so maybe it has something to do with the complexity of the module.

Both screen recordings are made on a MacBook Pro using Pub-Alpha 3 in the latest version of Chrome.

Screen Recordings:

[dtcblyth]

Update:

I think I’ve narrowed down the issue. The problem seems to occur more frequently when using a trackpad, rather than a mouse. Further more, the Apple trackpad has two click modes:

1. Tap to Click mode allows you to trgger click events with just a light tap of the finger on the trackpad.
2. Force Click (Haptic Feedback) mode requires you to press the trackpad forcefully with the finger until it clicks.

Anyway, the point is... • When using Tap to Click mode the errors described above do not occur. • When using Mouse Click the errors occur less frequently. • When using Force Click mode the errors occur most frequently.

This suggests that perhaps whatever code you are using to manage click events in the Visual Builder might be too sensitive. It is perhaps detecting the slight pointer movements associated with Mouse and Force clicks as drag events, double-clicks, or something else. When using Tap to Click, there is little to no pointer movement, and therefore the clicks are detected accurately.

I use a laptop almost exclusively, and these errors are a real problem. It’s fine for working on my extensions, but if I was working on website design, the constent layout shifting would make Divi almost unusable.

[ayubadiputra]

@dtcblyth We fixed this and merged the code. It should be available on the next Public Alpha Release. Thanks!