Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(gatsby): improve error messages at runtime #29970

Merged
merged 3 commits into from
Mar 5, 2021

Conversation

wardpeet
Copy link
Contributor

@wardpeet wardpeet commented Mar 3, 2021

Description

Adding some better error messages in our runtime code so people can actually see what's going wrong in their error trackers.
It should help us solve #19618

When you have a runtime error in your page component before React kicks in

if (typeof window === 'undefined') {
  throw new Error('GATSBY');
}

export default function MyPage(){}

image

When Static Query fails we got an unexpected JSON error, now we get:
image

When Page Query fails, it's still the same:
image

Related Issues

Related to #19618

@gatsbot gatsbot bot added the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label Mar 3, 2021
@wardpeet wardpeet removed the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label Mar 3, 2021
@@ -103,6 +78,12 @@ const runSuiteForPage = (label, pagePath) => {
filter: `page-data`,
})
})
describe(`Missing "${label}" static query results`, () => {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We weren't tested static-query blocked

asyncRequires.components[chunkName]()
.then(preferDefault)
// loader will handle the case when component is error
.catch(err => err)
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Return the error instead of throwing

Comment on lines +30 to +32
throw new Error(
`We couldn't find the correct component chunk with the name "${chunkName}"`
)
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We silently fail, now we don't

@wardpeet wardpeet marked this pull request as ready for review March 3, 2021 21:10
@wardpeet
Copy link
Contributor Author

wardpeet commented Mar 4, 2021

Probably good to backport this to v2, it will need small change in the cherry-pick PR. Develop wasn't using async-requires

Copy link
Contributor

@LekoArts LekoArts left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall LGTM. Non blocking (maybe as follow-up): Can we give clearer instructions on how people might solve their issue? We're outputting more detailed errors now, but they are the nitty gritty details. I could imagine a link to a specific docs page for example

@wardpeet
Copy link
Contributor Author

wardpeet commented Mar 4, 2021

I agree but the issue is that I don't know yet why they happen.

@wardpeet wardpeet merged commit d37f275 into master Mar 5, 2021
@wardpeet wardpeet deleted the fix/improve-error-messages branch March 5, 2021 10:57
pieh pushed a commit that referenced this pull request Mar 5, 2021
pieh pushed a commit that referenced this pull request Mar 5, 2021
pieh pushed a commit that referenced this pull request Mar 5, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants