Don't miss out Virtual Happy Hour this Friday (April 26).

Try our conversational search powered by Generative AI!

Opening legacy dialog removes overlays

Fixed in

EPiServer.CMS.UI 11.11.0

(Or a related package)

Created

Oct 15, 2018

Updated

Oct 29, 2018

Area

CMS UI

State

Closed, Fixed and tested


Description

Note: All SPA features are marked as beta, and so require the EpiBetaUsers group.

Steps to reproduce:
1. Add the following code at the end of the body tag i _Root.cshtml in the Alloy templates:

    <script>
        window.addEventListener("load", function () {
            // Wait one second, so the DOM changes will trigger a domUpdated event
 
            setTimeout(function () {
                // Create an element with the attributes, then add it to the DOM. This will trigger a domUpdated and create an overlay
                var element = document.createElement("h2");
                element.innerText = "Element added dynamically";
                element.setAttribute("data-epi-property-name", "mainbody");
                element.setAttribute("data-epi-property-render", "none");
                element.setAttribute("data-epi-property-edittype", "floating");
                document.body.appendChild(element);
            }, 1000);
        });
    </script>
    </body>

2. Edit any page with a mainbody property in OPE-mode. For example, the product pages (Alloy track).
3. Scroll up using the mouse wheel to reveal the upper properties.
4. On the "Visible to" property, click the Manage button.
5. Close the dialog.

Expected:
To see the overlay on the dynamically-added element at the bottom of the page.

Actual:
The overlays disappears from the dynamically-added element.