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
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

AEM Page Editor error : Handler of component is invalid -> TypeError: Cannot read property 'flow' of undefined

Avatar

Level 4

Hi,

 

When i open my page in edit mode, i am getting the issue as in screenshot. Please provide solution to resolve this issue.

Screenshot 2020-05-09 at 3.33.01 PM.png

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi All 

 

   To anyone who will face this issue in the future, please find below the details how this was fixed in my local. 

 

Root Cause : 

If you click on the last line where the error is occurring from the error trace , it will take you to a JS in the libs. Please check the below screenshots

 

Veena_Vikram_0-1640079611000.png

Veena_Vikram_1-1640079696330.png

 

Click on Pretty Print and it will highlight the error lines 

Veena_Vikram_2-1640079736655.png

If you hover on the clientlibs it will give you the path of the clientlibrary , which is at /libs/cq/gui/components/authoring/editors/clientlibs/core  . I pulled the files under this path and did a search to find the JS which was causing issue and it took me to /libs/cq/gui/components/authoring/editors/clientlibs/core/js/util/util.js 

 

Veena_Vikram_3-1640079790451.png

 

The error is happening at line number 254 of the file , where the argument code , passed to this method is actually passing as undefined.

 

To fix this , we can add an if condition as below

Veena_Vikram_4-1640080079760.png

or you can replace the below line of code in your file from 254 - around 268 

 

ns.util.sanitizeCQHandler = function (code) {
var handler;
if(!code){
try {
handler = eval('(' + code + ')');
} catch (ex) {
handler = $.noop;
$(document).trigger($.Event("error", {
message: "Handler of component is invalid",
exception: ex
}));
}
}
return handler;
};

 

This should ideally fix the issue. Hope this helps.

 

Thanks

Veena

 

 

View solution in original post

10 Replies

Avatar

Employee Advisor

Hi,

 

Can you add some more details.

 

1. Which AEM version ?

2. Did this error happened after any particular action.

 

Core js is the fundamental JS which powers most of the authoring actions. Best options you can try if it just happened is to Invalidate and rebuild your clientlibs from [1]

 

[1] http://localhost:4502/libs/granite/ui/content/dumplibs.rebuild.html

Avatar

Level 4

Thanks @Nirmal_Jose 

 

I am using AEM 6.5

This issue occurs when i build my project.

 

I tried to Invalidate and rebuild clientlibs but this doesn't solve the issue

Avatar

Employee

Hi Santosh,

 

Please try to rebuild the clientlibs by going to the URL[1]

  • First click on Invalidate Cache

 

  • Then click on rebuild clientlibs

Warm Regards,

Nidz


[1] http://<host>:<port>/libs/granite/ui/content/dumplibs.rebuild.html?rebuild=true

Avatar

Level 4
Thanks @Nirmal_Jose I am using AEM 6.5 This issue occurs when i build my project. I tried to Invalidate and rebuild clientlibs but this doesn't solve the issue

Avatar

Level 4

Thanks @nirmaljosehere and @nidhip010816 

 

I am using AEM 6.5

This issue occurs when i build my project.

 

I tried to Invalidate and rebuild clientlibs but this doesn't solve the issue

Avatar

Level 1
I'm facing same issue. This used to occur only in Chrome and worked well in Firefox. But now, I'm getting different errors in different browsers. Chrome show this error and FIrefox shows: Handler of component is invalid -> @http://localhost:4502/libs/cq/gui/components/authoring/editors/clientlibs/core.js line 272 > eval:1:2 tried rebuilding clientlibs but doesn't works...

Avatar

Level 1
I'm facing same issue. This used to occur only in Chrome and worked well in Firefox. But now, I'm getting different errors in different browsers. Chrome show this error and FIrefox shows: Handler of component is invalid -> @http://localhost:4502/libs/cq/gui/components/authoring/editors/clientlibs/core.js line 272 > eval:1:2 tried rebuilding clientlibs but doesn't works... I'm on AEM 6.5.6 with project archetype 24

Avatar

Correct answer by
Community Advisor

Hi All 

 

   To anyone who will face this issue in the future, please find below the details how this was fixed in my local. 

 

Root Cause : 

If you click on the last line where the error is occurring from the error trace , it will take you to a JS in the libs. Please check the below screenshots

 

Veena_Vikram_0-1640079611000.png

Veena_Vikram_1-1640079696330.png

 

Click on Pretty Print and it will highlight the error lines 

Veena_Vikram_2-1640079736655.png

If you hover on the clientlibs it will give you the path of the clientlibrary , which is at /libs/cq/gui/components/authoring/editors/clientlibs/core  . I pulled the files under this path and did a search to find the JS which was causing issue and it took me to /libs/cq/gui/components/authoring/editors/clientlibs/core/js/util/util.js 

 

Veena_Vikram_3-1640079790451.png

 

The error is happening at line number 254 of the file , where the argument code , passed to this method is actually passing as undefined.

 

To fix this , we can add an if condition as below

Veena_Vikram_4-1640080079760.png

or you can replace the below line of code in your file from 254 - around 268 

 

ns.util.sanitizeCQHandler = function (code) {
var handler;
if(!code){
try {
handler = eval('(' + code + ')');
} catch (ex) {
handler = $.noop;
$(document).trigger($.Event("error", {
message: "Handler of component is invalid",
exception: ex
}));
}
}
return handler;
};

 

This should ideally fix the issue. Hope this helps.

 

Thanks

Veena

 

 

Avatar

Level 1

Did some one knows why this happens ?
It is happening for me on specific component which is superResourceType to core component.

I do not want to change anything under /libs.