How do you debug a whitescreen in wasp/react project?

When I write a code with mistakes, it gives me a whitescreen instead of the problem in the page. How can I debug such cases? I would like debug when there is problem in my code, however react/wasp gives me no error message and my GUI turns white.
4 Replies
kapa.ai
kapa.ai2mo ago
Hi @skyblade2954. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Debugging a white screen issue in a Wasp/React project can be a bit tricky, especially if no error messages are provided. However, there are a few steps you can take to try and identify the problem: 1. Check the browser console: Open the developer tools in your browser (usually by pressing F12 or right-clicking on the page and selecting 'Inspect') and check the console for any error messages. These messages can often provide clues about what's going wrong. 2. Enable more debug messages: A community member on Discord asked about running Wasp with more debug messages. While the response to this question isn't provided in the knowledge sources, it's worth exploring if Wasp has a debug or verbose mode that can provide more detailed output. 3. Check for known issues: There's an open issue on the Wasp GitHub page about a white screen caused by a double React installation. If you recently updated or made changes to your project setup, this could potentially be the cause of your problem. The temporary fix suggested in the issue is to run a script that deletes the redundant React installation and Vite's cache, then restart the app. 4. Reach out to the community: If you're still stuck, consider reaching out to the Wasp community on GitHub or Discord. You can ask for help, share your experience, or see if others have encountered similar problems. Remember, debugging is often a process of elimination. By systematically checking these areas, you're likely to get closer to identifying the issue. Sources: - Discord support thread (https://discord.com/channels/686873244791210014/1215945587841831033) - Github Issue (open): Solve double installation issue in restructuring (https://github.com/wasp-lang/wasp/issues/1640) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @skyblade2954, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
martinsos
martinsos2mo ago
Hey! We do have a Github issue for providing a nicer interface than just whitescreen, so you will see an improvement there in the future versions of Wasp, but right now you can already see errors in the dev console of the browser and/or in the terminal logs!
skyblade2954
skyblade29542mo ago
@martinsos My bad I am new on react.
martinsos
martinsos2mo ago
No worries! This is sometihng we can improve for sure!