Element settings button not working

[davidpede]

In the frontend, clicking the settings buttons in nested elements closes the hover transition instead of opening the settings panel:

Using Chrome & latest master branch as of today

[davidpede]

More strange behavior

[theboxer]

This is for sure not beta2

[davidpede]

This is for sure not beta2

Arg sorry your right - its latest master branch as of today

[rthrash]

Hi David, thanks for the reports. Can you update to the latest-latest master branch (as of a few minutes ago) and force-clear your cached CSS/JS to see if these are still reproducible?

[davidpede]

No difference @rthrash except a slight opacity change on the buttons. Behavior above is still happening

[rthrash]

Hi @davidpede, having trouble reproducing this behavior. Can you supply your Dropzone and Elements templates so we can investigate further? We're considering this the last blocker to beta4 release. Appreciate your digging into this with us. :)

[rthrash]

Also, which browser are you using?

[davidpede]

Using latest Chrome. This problem feels very similar to: https://github.com/modxcms/fred/issues/160

Elements in demos above have bootstrap flex column classes applied like:

<div data-fred-block-class="col-{{ col }} mb-3" data-fred-name="text" data-fred-rte="true">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sit amet justo sit amet augue imperdiet aliquet vitae sed enim. Curabitur nec sem ex. Aenean suscipit ultrices sapien eu euismod. In sit amet massa elit.</p>
</div>

Dropzone in Tpl like:

<!-- Page content -->
<div class="page-content container-fluid">
    <div class="row">
        <!-- Main sidebar -->
        [[$sideBarLeft]]
        <!-- /main sidebar -->
        <!-- Main content -->
        <div class="col-9">
            <div class="outer-dropzone" data-fred-dropzone="content" style="min-height: 250px;">
                [[*content]]
            </div>
        </div>
    </div>
    <!-- /main content -->
</div>
<!-- /page content -->

[davidpede]

@rthrash found how to reproduce, its when you click on editable text. With an element like this:

<div data-fred-block-class="col-{{ col }} mb-3" data-fred-name="text" data-fred-rte="true">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sit amet justo sit amet augue imperdiet aliquet vitae sed enim. Curabitur nec sem ex. Aenean suscipit ultrices sapien eu euismod. In sit amet massa elit.</p>
</div>

1. hover over the element
2. click its setting cog
3. works fine

Now try:

1. hover over the element
2. click/select the editable text
3. click its setting cog
4. closes the toolbar buttons instead of opening settings

Can you reproduce?

[rthrash]

Hi @davidpede we'll work on this one for a future bug release. Thanks for doing the research on repeating it.