Dialog opening error

[HybrisAd]

Hello everyone,
I have a problem with a custom component, I have created a component with sections 1 with a core title component and one with 4 teaser cores, I imported them into the code like this

<div class="aem-Grid aem-Grid--12">

<div class="aem-GridColumn aem-GridColumn--default--6">

<sly

data-sly-resource="${ 'title' @ resourceType='mrll/components/title' }"

></sly>

</div>

<div class="aem-GridColumn aem-GridColumn--default--6">

<div class="aem-Grid aem-Grid--12">

<div class="aem-GridColumn aem-GridColumn--default--6">

<sly

data-sly-resource="${ 'teaser1' @ resourceType='mrll/components/teaser', decoration=true }"

></sly>

</div>

<div class="aem-GridColumn aem-GridColumn--default--6">

<sly

data-sly-resource="${ 'teaser2' @ resourceType='mrll/components/teaser', decoration=true }"

></sly>

</div>

<div class="aem-GridColumn aem-GridColumn--default--6">

<sly

data-sly-resource="${ 'teaser3' @ resourceType='mrll/components/teaser', decoration=true }"

></sly>

</div>

<div class="aem-GridColumn aem-GridColumn--default--6">

<sly

data-sly-resource="${ 'teaser4' @ resourceType='mrll/components/teaser', decoration=true }"

></sly>

</div>

</div>

</div>

</div>

when I try to open the dialogue of the teaser embedded in my custom component, the console fails and does not open the dialogue, even more than the other components.

granite.lc-011c0fc0d0cf131bdff879743a353002-lc.min.js:7


GET http://localhost:4502/mnt/override/libs/core/wcm/components/teaser/v2/teaser/_cq_dialog.html/content... 404 (Not Found)

thank you

[pulkitvashisth]

Hi @HybrisAd 
Please check these : 

1. make sure you have dialog in your component

2.make sure your component name and jcr:title property value are not same

Also this discussion is the same as yours I believe, so check this once:
https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/custom-component-not-visib...

A few more helpful links : 
https://sourcedcode.com/blog/aem/aem-components-are-not-showing-up-on-page-templates
Documentation : https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-wkn...

[HybrisAd]

Hi @pulkitvashisth 
1. Yes, I have a dialogue for this component which is copied from the Hello World Component Core for testing purposes;
2. Nope, the names are different.

thanks

[pulkitvashisth]

@HybrisAd 
I meant the dialog for the teaser component. Can you check if its present? and also check if the resource type path you are using for teaser component is correct.

If both things check out fine, then can you check if Teaser and Title component that you are trying to include, are they allowed in the template policies. If not , allow once and then check.

[HybrisAd]

@pulkitvashisth 

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
    xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:Component"
    jcr:title="Teaser"
    sling:resourceSuperType="core/wcm/components/teaser/v2/teaser"
    componentGroup="MRLL Sites Project - Content"
    imageDelegate="mrll/components/image"/>

 this is the teaser dialog and the recource type is correct; this is the policy and teaser are allowed in the content page

[pulkitvashisth]

Hi @HybrisAd 

The xml you shared is the teaser component content.xml not the cq:dialog. But as I can see you are extending core component, dialog shouldn't be an issue.

Just saw that your component name is also Teaser and jcr:title is also Teaser
Can you try keeping jcr:title something else, like Teaser(MRLL)

I just check above functionality in my custom component with 

<sly data-sly-resource="${ 'teaser3' @ resourceType='mrll/components/teaser', decoration=true }"></sly>

And it worked fine. I am using v1 teaser component with following content.xml

 

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
xmlns:jcr="http://www.jcp.org/jcr/1.0"
jcr:primaryType="cq:Component"
jcr:title="Teaser(Article)"
sling:resourceSuperType="core/wcm/components/teaser/v1/teaser"
componentGroup="Article Template"
imageDelegate="project/components/core/image"/>

[HybrisAd]

Hi @pulkitvashisth 
Sorry, I am sending you all the files more clearly and correctly, This is my custom component that I called Teaser Info:

.html

<div class="aem-Grid aem-Grid--12">
  <div class="aem-GridColumn aem-GridColumn--default--6">
    <div>
      <sly
        data-sly-resource="${ 'title' @ resourceType='mrll/components/title' }"
      ></sly>
    </div>
    <div>
      <sly
        data-sly-resource="${ 'text' @ resourceType='mrll/components/title' }"
      ></sly>
    </div>
  </div>
  <div class="aem-GridColumn aem-GridColumn--default--6">
    <div class="aem-Grid aem-Grid--12">
      <div class="aem-GridColumn aem-GridColumn--default--6">
        <sly
          data-sly-resource="${ 'teaser1' @ resourceType='mrll/components/teaser', decoration=true }"
        ></sly>
      </div>
      <div class="aem-GridColumn aem-GridColumn--default--6">
        <sly
          data-sly-resource="${ 'teaser2' @ resourceType='mrll/components/teaser', decoration=true }"
        ></sly>
      </div>
      <div class="aem-GridColumn aem-GridColumn--default--6">
        <sly
          data-sly-resource="${ 'teaser3' @ resourceType='mrll/components/teaser', decoration=true }"
        ></sly>
      </div>
      <div class="aem-GridColumn aem-GridColumn--default--6">
        <div
          data-sly-resource="${ 'teaser4' @ resourceType='mrll/components/teaser', decoration=true }"
        ></div>
      </div>
    </div>
  </div>
</div>

 .content.xml

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0"
    xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:Component"
    jcr:title="Teaser Info Component"
    jcr:description="A Teaser Info Component."
    componentGroup="MRLL Sites Project - Content" />

_cq_dialog

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0"
    xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
    jcr:primaryType="nt:unstructured"
    jcr:title="Teaser Info Properties"
    sling:resourceType="cq/gui/components/authoring/dialog">
    <content
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
        <items jcr:primaryType="nt:unstructured">
            <column
                jcr:primaryType="nt:unstructured"
                sling:resourceType="granite/ui/components/coral/foundation/container">
                <items jcr:primaryType="nt:unstructured">
                    <text
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                        fieldLabel="Text"
                        name="./text" />
                </items>
            </column>
        </items>
    </content>
</jcr:root>

[pulkitvashisth]

Hi @HybrisAd 
Revisiting this, 
I see you have posted code for your custom component.
Going through it, I don't see any issue.
1. One thing can you try? see if giving absolute path of the teaser component in data-sly-resource works for you.

If that also doesn't work, can you please also share the contents of the teaser component you are using.
Might be there is some issue in it.
Also please share if there are any console errors present in dev console of browser , while you are trying to open the dialog in editor mode.

[kautuk_sahni]

@HybrisAd Did you find the suggestions from users helpful? Please let us know if more information is required. Otherwise, please mark the answer as correct for posterity. If you have found out solution yourself, please share it with the community.

[HybrisAd]

@kautuk_sahni 

Nope I haven't found the solution yet, the component still doesn't work