AEM Core components converted to React Components not rendering first time

[anup75228260]

I have created react components and mapped them to AEM core component but when i drag and drop any core component on the test page , it is not coming up on the page. However when navigating to the content path in CRX, i see that the component is added to the responsive grid and if i am authoring the dialog properties through CRX and reloading the page , the component comes up.

However this is happening only when the component is dragged for the first time, from next time onward component is getting authored on the page itself. It is happening for all the core components like Title, Image , List etc.

[Nupur_Jain · Accepted solution]

Hi @anup75228260 

Could you try adding edit config to refresh page after insert. For this create cq:editConfig node of primary type "cq:EditConfig" under the component.

Once done you need to add cq:listener to refresh page, the cq:editConfig structure will look like this:

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:EditConfig">
    <cq:listeners
        jcr:primaryType="cq:EditListenersConfig"
        afterinsert="REFRESH_PAGE"/>
</jcr:root>

If the component is not rendering properly after edit also, you would also have to refresh page after edit as well. 

You can also refer https://docs.adobe.com/content/help/en/experience-manager-64/developing/components/components-basics... for edit config details.

Thanks,

Nupur