Issue with Custom AEM Component Not Rendering on Publish Instance

[AryaBa1]

Hi everyone,
I'm facing an issue in my AEM as a Cloud Service project where a custom component renders correctly on the Author instance (both in Preview and Edit modes), but it does not appear on the Publish instance. There are no errors appear in the browser console or server logs.

[SantoshSai · Accepted solution]

Hi @AryaBa1,

Could you confirm the below steps?

1. Check if the component is allowed in the Template Policy
   Sometimes the component renders on Author because you’re in Edit mode, but on Publish it silently fails because it’s not allowed in the template structure.
2. Ensure the content is published
   This sounds basic, but I’ve seen people (myself included!) forget to publish a component or even the template.
3. Clear dispatcher & CDN cache
   On AEMaaCS, even if everything is set up right, old cache can mess with your head. Akamai or Dispatcher might be serving a stale version of the page.
4. Look for errrors in logs (especially Sling Models)
   Sometimes the component is loading, but something inside it is failing - like a null Sling Model, or an exception thrown silently.
5. Verify ClientLibs are loading
   Client-side rendering issues often come from missing JS or CSS. The component might technically render but look broken or invisible.
6. Check dispatcher rules
   The Dispatcher sometimes blocks resources that it doesn’t recognize or aren’t explicitly allowed.

Other than this, nothing specific is coming to my mind at the moment - but going through the above usually catches the issue.

Hope that helps!

[ShivamKumar]

Hi @AryaBa1 ,

Please ensure the below steps:-

• Content and Assets Are Published

  • The page itself is published.

  • The template associated with the page is published.

  • The custom component node under jcr:content is published.

  • All related client libraries (CSS/JS) used by the component are published.

  • Any referenced content fragments, experience fragments, or images are also published.

• Component Exists on Publish

  • Confirm that the custom component is present under /apps/...  on the Publish instance and deployed correctly via code.

• Template Policy Configuration

  • Verify that the template used by the page allows the custom component via the template policy.

• Client Library Configuration

  • Ensure that the component's cq:ClientLibraryFolder node includes the property allowProxy=true.

• HTL Logic Validity

  • Check the component’s HTL file to confirm there are no conditions that restrict rendering to Edit mode (e.g., wcmmode.edit).

• Preview Using "View as Published"

  • Use the “View as Published” option in Author mode to simulate the Publish environment and verify that the component renders as expected.

[AmitVishwakarma]

Hi @AryaBa1 ,

1. Content Published Properly
  - Confirm the page, component, template, template policy, clientlibs, and any referenced assets are all published.
  - Use the Site Admin > select page > Quick Publish to ensure everything is included.

2. Component Allowed via Template Policy
  - Go to the Template Editor for the page's template.
  - Verify your custom component is allowed in the policy configuration.

3. Component Deployed to Publish
  - SSH into the Publish container (if you have access) or inspect /apps/<your-component> via CRXDE Lite on Publish.
  - Check that the HTL and Java files are included in the deployed build.

Subtle Issues to Look For

4. HTL Conditions (e.g., wcmmode.edit)
Make sure your HTL doesn't have logic like:

<sly data-sly-test="${wcmmode.edit}">
  <!-- visible only in author edit -->
</sly>

This will hide the component on Publish silently.

5. ClientLib Not Loading

In Publish, open browser dev tools > Network tab > refresh the page.
Confirm your component’s JS/CSS is loading. If you see 404s:
  - Add allowProxy=true in the cq:ClientLibraryFolder.
  - Ensure it's placed under a proxied path like /apps/....

6. Dispatcher or CDN Caching
  - Use the “View as Published” option in Author to bypass dispatcher.
  - If it shows up here, then dispatcher cache may be stale.
  - Consider invalidating the cache or checking the dispatcher filters.

7. Sling Model or Backend Errors
Wrap HTL with debug logging or fallback:

<sly data-sly-use.model="com.example.MyModel" />
<p>${model.someProp @ context='text'}</p>
​

Review error.log for Sling Model binding issues, especially null pointer exceptions.

Note: Append ?nocache=true or access the Publish instance directly (bypassing dispatcher) to rule out caching entirely.

Regards,
Amit