Vue app dev + production build works great locally, then throws null error when interacting with deploy preview site

Link to deploy preview site: https://deploy-preview-11--pedantic-noether-b86f9d.netlify.app/

Hi, I have been using netlify and decided to try out the deploy-preview option, which basically I just made a separate branch with some new changes (mainly related to integrating with my new backend server on AWS lambda behind API Gateway) and submitted a PR which triggers the deploy-preview.

If you go to that link, everything seems fine, but when you actually proceed by clicking that dropdown in the middle of the page, if you look at the logs in chrome devtools, you can see that it throws some kind of null error, which is really hard to debug. This does not happen locally nor if you build the production vue app (npm run build) and run that built app locally. This only repros in the deploy preview (maybe also the main deployed master branch but I don’t want to find that out lol).

On that click I am doing an axios GET request, so it might have something to do with that, but I have no clue why it would work locally but not in the deploy preview. I’ve also made sure to set all the appropriate environment variables inside the netlify settings, and also selected Deploy without restrictions as the sensitive variable policy hoping that might help things (and redeployed after I changed those things), and still didn’t help.

What is going wrong here? Does anyone know what else I can do to help debug this further? Thanks!

For anyone running into a similar issue, the reason this was happening was because I forgot to update my Google Recaptcha domain whitelist.

1 Like

Hey there, @OmarB97 :wave:

Apologies for the delay in getting you a response here! I am so happy to see that you found the solution for why this issue was happening. Thanks for sharing it here as well! This will help future community members who may encounter a similar question.