Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

tabs not clickable on tabs component on edge and Chrome

Avatar

Level 3

Browser details: os=Windows&os_version=11&browser=Edge&browser_version=124.0&resolution=1920*1080

AEM sites. our SDK is "aem-sdk-2023.12.14697.20231215T125030Z-231200.zip"

 

Sorry I am still relatively new to the team here.

 

My QA team says this is intermittent. On Tabs component tabs are not clickable. On Edge and Chrome

 

Console output when it happens:

 

update_URLHash.png

1 Accepted Solution

Avatar

Correct answer by
Level 2

Hi all.

 

Turns out we had an internal cache that was from a previous version of AEM I had no idea about. We have two sites running in tandem. And the dispatcher sometimes grabs from the old one.

 

So there was a conflict. We are working on breaking them apart better.

 

Problem solved. Thanks for the help.

 

-Joel

 

 

View solution in original post

7 Replies

Avatar

Community Advisor

@JoelLucuik 

This looks like a internal code error which might be conflicting with tab component code and causing this issue.

 

Do you see this error in your Publish?

 

 

Avatar

Level 2

yes on publish. Through a uat domain. uat.customerName.com

Avatar

Community Advisor

Hi @JoelLucuik ,

Without the specific console output, it is difficult to determine the exact cause of the issue. However, there are a few common reasons why tabs may not be clickable on the Tabs component in Edge and Chrome:

1. JavaScript Errors: Check the browser console for any JavaScript errors. If there are any errors related to the Tabs component or its dependencies, it could prevent the tabs from being clickable. Fixing these errors should resolve the issue.

2. CSS Issues: Inspect the Tabs component using the browser's developer tools and check if there are any CSS conflicts or issues that may be affecting the clickability of the tabs. Look for any overlapping elements, incorrect z-index values, or other CSS-related problems.

3. Event Handling: Ensure that the event handling for the tabs is properly implemented. Check if the click event listeners are correctly attached to the tabs and if there are any issues with event propagation or event delegation.

4. Third-Party Libraries: If the Tabs component relies on any third-party libraries or dependencies, make sure they are properly loaded and initialized. Check for any errors or conflicts related to these libraries in the browser console.

5. Browser Compatibility: Verify if the issue is specific to certain versions of Edge and Chrome. It's possible that there may be compatibility issues with the Tabs component or its dependencies in certain browser versions. Try testing the component in different versions of Edge and Chrome to see if the issue persists.

To further investigate the issue, it would be helpful to have the specific console output when the problem occurs. The console output may provide more insights into any errors or warnings that could be causing the tabs to be unclickable.

Avatar

Level 2

1. I included the JS output. This is in UAT so unfortunately it's minified. I will see if we can remove that for now.

2. Because it's intermittent I doubt this is an issue. I'lll ask my team about that.

3. This is my guess. I'll investigate this further. 

4: No third party conflicts unless the error I presented is one. Which is why I posted here in case you knew of issues.

5..: I'll see if I can get a non-minified version of the code deployed.

 

-Joel

 

 

 

Avatar

Level 2

Appears as if we have two environments running in tandem (new cloud and old on prem). Our dispatcher appears to be allowing a JS call through to old on prem that should have been kept in the cloud.

Once I confirm this I will update this post.

Avatar

Community Advisor

Hi, 

 

You need to click the link where the error is occurring (clienlib-base.lc-....), then add a breakpoint and refresh the page to check why that is not defined. 

 

Hope this helps.



Esteban Bustamante

Avatar

Correct answer by
Level 2

Hi all.

 

Turns out we had an internal cache that was from a previous version of AEM I had no idea about. We have two sites running in tandem. And the dispatcher sometimes grabs from the old one.

 

So there was a conflict. We are working on breaking them apart better.

 

Problem solved. Thanks for the help.

 

-Joel