jContent creates warnings on virtual nodes

[x0h01]

Reproducible with:

• Jahia 8.2.1.0 [Kimchi] - Build: e1f5366
• Jahia 8.2.2.0 [Kimchi] - Build: 5ef0917

JSM:

• javascript-modules-engine 0.6.1
• javascript-modules-engine 0.7.0.SNAPSHOT (Git-last-commit-id: 986d783)

jContent:

• jcontent 3.3.1
• jcontent 3.4.0.SNAPSHOT (Git-last-commit-id: 86cd1856fc5b19d8b0de0f2391c14a3d9c0846e0)

Luxe:

• luxe-jahia-demo 0.7.0.SNAPSHOT
• luxe-prepackaged-website 0.7.0.SNAPSHOT (Git-last-commit-id: 28a390e86f743d09b97384644c8b61e43831436a)

Steps to reproduce:

• install and import luxe
• open luxe demo in jcontent
• open devtools and either refresh the page or scroll it down
• spot a warning in browser's console log:

Couldn't find parent element with jahiatype=module for element
<div class="jahia-template-gxt" jahiatype="module" id="module9f79ab17-b02d-488a-88f5-13947f25c3d5" type="placeholder" path="*" showareabutton="true" style="pointer-events: all;"></div>

DOM Tree:

• happens for jcontent view, not reproducible in preview or live

Expected behaviour:
No errors or warnings in browser's log should appear while exploring Luxe demo

Important:

• not reproducible with Jahia 8.2.1.0 [Kimchi] - Build: e1f5366 using the next flow:
  • update javascript-modules-engine updated to 0.6.1 using corresponding update button in modules manager
  • install and import luxe demo and prepackaged website using Available Modules modules manager
  • as a result, jahia will be running javascript-modules-engine 0.6.1 and luxe 0.6.0
  • upgrade to javascript-modules-engine 0.7.0-SN
  • open luxe in jcontent - NO errors observed

Technical details

After a quick investigation, it seems this issue was introduced by Jahia/luxe-jahia-demo@c7cb5c8:

This commit changes the following in luxe: instead of rendering an absolute area /sites/luxe/home/nav we render a virtual node virtualArea/menu.

This is a workaround until https://github.com/Jahia/jahia-private/pull/3688 is released in Jahia 8.2.2.0

Virtual nodes are a documented practice and should work properly in jContent

Warning comes from https://github.com/Jahia/jcontent/blob/b6932381a952cccaae32e57e145181a4a410efac/src/javascript/JContent/EditFrame/Boxes/Boxes.jsx#L200

[gflores-jahia]

This is due to the fact that this placeholder ([type="placeholder"]) element , typically an html container for 'New component' buttons for area/content list, is not associated with any area/content list (i.e. missing data-jahia-parent attribute or in the html hierarchy).

Either this doesn't need to be generated at all in editframe html if not associated to anything, or more likely is this is a placeholder supposed to be associated with the virtual node container /virtualArea/menu but is currently not linked. Not sure exactly how this is generated on JSM side of things.

Good news is that, as already mentioned above, I don't think this has any negative impact on functionality, other than printing of the warning and that the current html structure for virtual nodes are missing some attributes.

Need to find next steps how to resolve.

[gflores-jahia]

Discussed with @GauBen @jkevan @AKarmanov and conclusion is that we'll probably need to add support, and modify edit templating for this new virtual node in the ModuleTag renderer.

Options

• Completely remove this type="placeholder" element for virtual nodes since it's not editable.
• Establish the relationship between the type="placeholder" element and the virtual node element by, adding data-jahia-parent attribute to it, like all other container nodes to avoid generating this warning. This should then be ignored in jContent given that the virtual path doesn't exist in jcr (path not found error handling already in place)
• Add an attribute that could indicate certain type="placeholder" elements are not editable and use that attribute to exclude this from the current query in jcontent Boxes.