Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

JS doesn't render properly in Preview mode

Avatar

Avatar
Validate 1
Level 1
lucywang129
Level 1

Likes

0 likes

Total Posts

10 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
View profile

Avatar
Validate 1
Level 1
lucywang129
Level 1

Likes

0 likes

Total Posts

10 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
View profile
lucywang129
Level 1

06-05-2020

Hi everyone, 

 

I experienced a few instances of the issue like this. I developed an image slider component in AEM. As you click on the pre and next button, the images are supposed to scroll to the left or the right. However the functionality doesn't work in the Preview mode. When I publish the page, the component works fine. Another problem is with the sticky menu effect on the client side. I put the code in the client lib. It doesn't work in Preview mode but it works fine when I publish the page. I was wondering if anyone knows this issue or knows if it is possible to fix it.

 

Any insight would be greatly appreciated. 

 

Lucy 

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Validate 1
MVP
Theo_Pendle
MVP

Likes

236 likes

Total Posts

251 posts

Correct Reply

105 solutions
Top badges earned
Validate 1
Ignite 5
Ignite 3
Ignite 10
Ignite 1
View profile

Avatar
Validate 1
MVP
Theo_Pendle
MVP

Likes

236 likes

Total Posts

251 posts

Correct Reply

105 solutions
Top badges earned
Validate 1
Ignite 5
Ignite 3
Ignite 10
Ignite 1
View profile
Theo_Pendle
MVP

08-05-2020

Hi Lucy,

I can't give you a straight-up answer based on the information provided (send us some console logs! 🙂) but here are a few things to check:

  1. Are you 100% certain that the same code if deployed to your Author and Publisher instances?
  2. If the same clientlibs are deployed, it may be worth checking your browser cache. Clear it and retry (perhaps the Author instance is fetching a deprecated clientlib form cache?)
  3. Invalidate the AEM clientlib cache: http://localhost:4502/libs/granite/ui/content/dumplibs.rebuild.html
  4. Do your Author and Publisher instances implement the same code minification policies? You can check this by finding and comparing the com.adobe.granite.ui.clientlibs.impl.HtmlLibraryManagerImpl config on each instance. I've had the issue before where my code was being minified on one instance and not the other and it was causing issues (due to conflict between Webpack minification and GCC minification).

Answers (3)

Answers (3)

Avatar

Avatar
Validate 1
Level 1
lucywang129
Level 1

Likes

0 likes

Total Posts

10 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
View profile

Avatar
Validate 1
Level 1
lucywang129
Level 1

Likes

0 likes

Total Posts

10 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
View profile
lucywang129
Level 1

09-05-2020

Thank you everyone for the replies. After digging the code thoroughly. I eventually found out it was due to CSS. Our internal developer wrote two sets of css for both author and publish so the component looks ok in both views. However, he didn't account for preview mode which has caused a rendering issue. 

Avatar

Avatar
Ignite 1
MVP
Ankur_Khare
MVP

Likes

152 likes

Total Posts

363 posts

Correct Reply

56 solutions
Top badges earned
Ignite 1
Validate 10
Validate 1
Give Back 50
Give Back 5
View profile

Avatar
Ignite 1
MVP
Ankur_Khare
MVP

Likes

152 likes

Total Posts

363 posts

Correct Reply

56 solutions
Top badges earned
Ignite 1
Validate 10
Validate 1
Give Back 50
Give Back 5
View profile
Ankur_Khare
MVP

08-05-2020

Could you please check how it behaves ehen u see the page as view as published mode.

And in preview mode any console errors?

Avatar

Avatar
Give Back 5
Employee
sunjot16
Employee

Likes

103 likes

Total Posts

164 posts

Correct Reply

50 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back 25
Give Back 10
Give Back
View profile

Avatar
Give Back 5
Employee
sunjot16
Employee

Likes

103 likes

Total Posts

164 posts

Correct Reply

50 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back 25
Give Back 10
Give Back
View profile
sunjot16
Employee

06-05-2020

 Do you see any Console errors when you see that the functionality isn't working in Preview mode?