React not updating the attribute for an HTML element
I've done all the sanity checks. I'm passing a placeholder to an
<input />
element.
console.log
? prop is changing
React dev tools? prop is changing
Production? prop is not changing (the above two still show the change)
Any ideas what else I can do to debug?10 Replies
Can you show us some code
width is being set correctly, within that
...
i've tested a console log
it's just not changing the domAh sorry i missed the part where is only happening in prod. How odd.
is the text always the same if your viewport is > 1200 and you refresh vs < 1200 and refresh? or does it show the correct text?
in dev, it shows the correct text for the correct screen width
in prod, you need to move it to the correct zone, and then back to fix it
IE: if the width is 1100, 'Search items' is showing, I need to move past 1200, then back under to get the change to show
we make an educated guess at the width for SSR, since, well, i don't have the client. that guess is 1300 (hence why 'Search items') is visible
but, then the prop updates (correctly, again, verified multitude of ways), and the component just doesn't update
where's 'useWindowWidth()' from?
i'd suggest moving it to a state and update it using effect ?
made it myself, it's nothing fancy
i'll pseudo code it, it's almost exactly this
Have you verified that production reflects your latest code and there wasn't an issue with deploy or maybe caching that file so it's a stale version?
yep!
running
build
then start
is also reproducing the error
so I can directly compare it to running dev
I jerry rigged a small test using a code I yanked from stackoverflow. Seems to be working fine in prod as well, at least on my machine. Hope it helps.
we just decided to double render both versions and hide em with CSS instead
super wild though
i'll mark it as complete