I've been having a problem for 3 days now, and I don't really understand what can cause this bug, can you help me?
Here is the problem, I have created a small game(react.js) where 5 cards are displayed at each reload, these 5 cards have a score of points each which are cumulated each time, which gives a score of all the cards, then the score of each "hand" which is cumulated.
In development mode, everything works correctly, but if I build and put it on a cdn (netlify), the score logic doesn't work...
Prod link (bug) : https://are-you-lucky-game.netlify.app/
Github repo link (dev mode work fine) : https://github.com/rodolphe37/random-playing-card-tuto/tree/step-3-final
I think the problem may be coming from over here:
In my console on render (in dev)
score: undefined
classment from ScoreForm {pts: 0, name: ''}
scoreArray (5) [3, 7, 10, 15, 2]
classment from center Page {pts: 0, name: ''}
classment from state {pts: 0, name: ''}
classment from session {pts: 0, name: ''}
score: undefined
classment from ScoreForm {pts: 0, name: ''}
scoreArray (5) [3, 7, 10, 15, 2]
classment from center Page {pts: 0, name: ''}
classment from state {pts: 0, name: ''}
classment from session {pts: 0, name: ''}
score: 0
classment from ScoreForm {pts: 37, name: ''}
score: 37
in dev, my component is rendered several times (3 or 4 i think), and at the last render, the info is there.
In my Console (prod mode)
score: undefined
classment from ScoreForm {pts: 0, name: ''}
scoreArray (5) [5, 25, 3, 6, 1]
classment from center Page {pts: 0, name: ''}
classment from state {pts: 0, name: ''}
classment from session {pts: 0, name: ''}
score: 0
classment from ScoreForm {pts: 0, name: ''}``
In production, my component is rendered two time I think, so my values are not there.
How can I make sure that my info (it comes from sessionStorage) is present at the first render of each component?
If you have ever encountered this kind of bug, or if you think you have a solution for me, I'm interested.
Thanks in advance!