0

We are using Sitecore 9.3 and facing issues with the experience editor only for some specific page items. We are unable to make any edits to the renderings in the Experience editor (Basically the editor tools are not showing up). Placeholder settings are configured correctly and working for other pages. When inspecting the browser we could see the below console errors. We are facing this issue only for experience editor.

Uncaught TypeError: Sitecore.PageModes.ChromeManager.hoverFrame() is undefined

Note: we are using Vue.js for our front end.

Console errors in Experience editor

9
  • Is there any JS coming on these pages that is creating the issue? Feb 21, 2023 at 12:39
  • Did you add any component that has animation like a slider? Feb 21, 2023 at 12:56
  • @praveensoni we dont have any animations or sliders in this page.
    – Prem2530
    Feb 21, 2023 at 12:59
  • @SumitBhatia the error is coming from "sitecore/shell/Applications/Page Modes/Output/4255514063022039022.JS:3844"
    – Prem2530
    Feb 21, 2023 at 13:00
  • @Prem2530 Did you try with the page without any component? Feb 21, 2023 at 13:01

2 Answers 2

2

As you mentioned that the issue is showing for some specific items, so the issue is looking like any JS is conflicting with the JS of the experience editor. You can do the following.

  1. Check the page by removing all the components and see if it is created by any specific component?
  2. If you find any jquery code, try to use jQuery in your code in the NoConflict mode as jQuery uses the $ sign but Sitecore also, which could cause conflicts.

Use this thread for more details as it looks like a conflict issue to me.

https://stackoverflow.com/questions/16198315/sitecore-page-editor-javascript-error

1

As Sumit mentions, it sounds like one of your components is bringing in conflicting or bad javascript. Which is causing the OTB sitecore scripts to fail to render parts of the experience editor.

My suggestion would be to duplicate the problematic item first. Then remove the components one at a time using the content editor (start doing this with components that are not included in the working pages).

You can do this by going to:

Presentation tab => Details => Final Layout => Controls => Edit *(select component to remove and save)*

Then go again to the experience editor to see if the problem occurs. If it does remove another, and another etc.

Alternatively, what sometimes helps is to create a new Empty Layout. Which is essentially a stripped-down Cshtml view, with just basic HTML and top-level placeholders (maybe add minimal js assets like jquery, etc).

<html>
  <body>
    @Html.Sitecore().Placeholder("Content")
  </body>
</html>

Then set that layout for the duplicated item. That should hopefully restore the EE controls.

Then start looking in the console to see if any errors and again start removing components till you find the culprit.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.