Hi,
I have an error while loading a page on a mobile app.
This page contains a form with an upload widget accepting image files. The form can be initialed with values from a simple aggregate taking as parameter the id of an entity.
However, opening the page shows an error: Cannot read property of undefined (reading 'value').
Please can you tell me what went wrong and how to correct it?
Hi Hugues,
You don't provide enough information for someone to help you.
Could you share the stack trace, most of the time inspecting it will give you a clue where the error is.
Regards,
Daniel
Hi Daniel,
Thanks for you answer, please how can i get the stack trace?
Hi Hugues Dorine,
You can go to Service Center (https://<hostname>/ServiceCenter), Monitoring section and check the logs for the respective section to do any kind of troubleshooting and to get Stack trace incase of error.
The error thrown looks to be a Java Script error, have you written any JavaScript code in the app that is not working correctly ?
Kindly note that Javascript event listeners should be added once the Page DOM is loaded (added in the On Ready event). In case the error thrown is a Java Script error, then to understand the issue better, will suggest to debug the Javascript using Chrome Dev Tools to identify the root cause.
Below is a link to a video tutorial on how to go about debugging Javascript in Chrome
https://www.youtube.com/watch?v=H0XScE08hy8
Saurabh
Thanks you all for your answers, here is the result of the console .
*******************
TypeError: Cannot read properties of undefined (reading 'value')
at e.UNSAFE_componentWillReceiveProps (Upload.js:94:1)
at rn (react-dom.production.min.js:69:1)
at Jn (react-dom.production.min.js:101:1)
at Es (react-dom.production.min.js:228:1)
at $r (react-dom.production.min.js:152:1)
at Hr (react-dom.production.min.js:152:1)
at Dr (react-dom.production.min.js:146:1)
at react-dom.production.min.js:61:1
at unstable_runWithPriority (react.production.min.js:25:1)
at Lt (react-dom.production.min.js:60:1)
cr @ react-dom.production.min.js:125
Pr.n.payload @ react-dom.production.min.js:138
Jt @ react-dom.production.min.js:66
Jn @ react-dom.production.min.js:101
Es @ react-dom.production.min.js:228
$r @ react-dom.production.min.js:152
Hr @ react-dom.production.min.js:152
Dr @ react-dom.production.min.js:146
(anonymous) @ react-dom.production.min.js:61
unstable_runWithPriority @ react.production.min.js:25
Lt @ react-dom.production.min.js:60
Ft @ react-dom.production.min.js:61
zt @ react-dom.production.min.js:60
Ss @ react-dom.production.min.js:224
enqueueSetState @ react-dom.production.min.js:214
n.setState @ react.production.min.js:20
t.onModelChanged @ BaseView.js:268
(anonymous) @ BaseView.js:208
t.innerFlush @ Model.js:377
t.flush @ Model.js:369
(anonymous) @ Controller.js:637
setTimeout (async)
Promise.then (async)
t.executeDataFetchAction @ Controller.js:632
(anonymous) @ Controller.js:558
a.fetchReadySources @ Controller.js:555
t.innerFetchDataWithDependencies @ Controller.js:655
t.fetchData @ Controller.js:624
(anonymous) @ Controller.js:675
(anonymous) @ Flow.js:79
d @ Flow.js:84
r @ Flow.js:79
then @ Flow.js:95
t.fireInitialize @ Controller.js:675
(anonymous) @ Controller.js:56
f @ Flow.js:56
p @ Flow.js:105
g @ Flow.js:119
e.executeWithNavigationCallbacks @ Controller.js:21
r @ tslib.js:143
(anonymous) @ tslib.js:124
(anonymous) @ tslib.js:117
__awaiter @ tslib.js:113
e.initialize @ Controller.js:24
(anonymous) @ ScreenLoader.js:82
execCb @ require.js:1696
check @ require.js:878
enable @ require.js:1176
init @ require.js:788
(anonymous) @ require.js:1460
req.nextTick @ require.js:1815
o @ require.js:1449
requirejs @ require.js:1797
s @ RequireManager.js:33
(anonymous) @ ScreenLoader.js:42
e.load @ ScreenLoader.js:40
(anonymous) @ createHistory.js:21
getUserConfirmation @ createHistory.js:10
confirmTransitionTo @ BaseNavigationCallbacks.js:52
push @ BaseNavigationCallbacks.js:52
e.push @ BaseNavigationCallbacks.js:20
e.goTo @ BaseNavigationCallbacks.js:31
R @ Navigation.js:339
onClick @ CKiLeBossProviderApp.MainFlow.Products.mvc.js?GhIcT29MK3UB0IISLCQulw:427
n @ Button.js:15
t.executeWithActiveClassOn @ Widget.js:285
e.handleClick @ Button.js:30
onClick @ Button.js:40
Oo @ react-dom.production.min.js:176
r @ react-dom.production.min.js:13
o @ react-dom.production.min.js:13
i @ react-dom.production.min.js:13
Xi @ react-dom.production.min.js:187
J @ react-dom.production.min.js:32
Z @ react-dom.production.min.js:32
oe @ react-dom.production.min.js:34
(anonymous) @ react-dom.production.min.js:236
p @ react-dom.production.min.js:15
xe @ react-dom.production.min.js:42
Ee @ react-dom.production.min.js:41
_s.Events.current @ react-dom.production.min.js:236
we @ react-dom.production.min.js:41
Show 38 more frames
Logger.js:503 [2022-09-04T03:48:00.753Z]: Cannot read properties of undefined (reading 'value')
at e.UNSAFE_componentWillReceiveProps (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactWidgets.js?F4L4YnElUkSMMyG_VcT9qQ:3:12408)
at rn (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:2:9410)
at Jn (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:2:25647)
at Es (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:4:28406)
at $r (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:3:19558)
at Hr (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:3:19483)
at Dr (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:3:16395)
at https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:2:5272
at unstable_runWithPriority (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:1:8420)
at Lt (https://personal-m50ynuw5.outsystemscloud.com/CKiLeBossProviderApp/scripts/OutSystemsReactView.js?1gaqLeQO00n_mqqa9u+opw:2:4982)
Cannot read properties of undefined (reading 'value') . This message usually because javascript cannot identified the element.
Can you try opening in browser, open developer tools, then go to souces tab and check the below message, this should give insight of the problems.
Also if you can, try to create dummy app with the same problem, and post it here.
i tried to read the code of Upload and even used breakpoint in the javascript. It looks like the content of the file is not read.
I will put more details later.
Here is a dummy simple app that i created, same problem.
Thanks again.
just to give more info about the problem.
In my screen, i used the entity variable (GetEntityById). So, the name of the attribute associated to the content of the file is GetEntitybyId.photo (a binary attribute).
If i use a binary attribute declared locally, and if i also use a variable to store the filename, the upload widget seems to work. So the problem might come from the use of the entity variable. I will try to use that as a work around but it looks like there is a real bug.
By using your oml, I not found the error you mentioned ?
Can you explained more, when and how the error occurred ?
Hi @Hugues Dorine,
Thanks for uploading a sample oml.
May we know when are you encountering the error ? Is it during render ? or when changing the image file ?
If it is also possible, create the screen and make it anonymous then send the URL here so that others can also inspect the error :)
Hi, Thanks for you answer :).
Here is the URL related to the oml.
https://personal-m50ynuw5.outsystemscloud.com/Uploadme/Entity1s?_ts=637981079635084026
Seems like there is a problem with your Upload widget. Debugged it and there seems to be a missing attribute nextProps.fileName during loading unlike with my personal version.
This is your version: nextProps.fileName is missing
My version: nextProps.fileName is present
Have you tried refreshing your module ?
Or creating a solution to refresh your modules ?
I agree with Marco answer, the oml that you provide, when tested on my environment, there is no problem.
Upload is Outsystems component, better create a new solution containing all, and publish it
Hi, thanks all for your answers.
I don't think the problem is my module, but more my environment. The module i published with the URL is very basic (made from scratch) and it does not work (similar to my current project). I created one this morning and same problem.
After uninstalling service studio, refreshing some of my outsystems modules, it didn't work.
However, i tried another experience by adding a variable for the filename. And it seems to work.
Maybe there is another module, i need to refresh.