checkPropTypes takes a getStack argument that can be used to send the component or error stack.
It then prints the error stack string at the end of the Warning displayed in the console.
Chrome seemingly expects console.error output to begin with Error in order for it to resolve Source Maps correctly, but the checkPropTypes message sent to console.error begins with the text Warning instead.
This makes Chrome resolve the source to the bundled code rather than using the provided Source Maps.
This is a weird issue for sure and I welcome any feedback on other potential causes.
Link to the responsible line of code in the repo
|
var message = 'Warning: ' + text; |
Changing the text from
"Warning: " to
"Error: " solves the issue.
Current result: (with Warning)

Desired result (with Error)

CodeSandBox link with example code:
https://codesandbox.io/s/hungry-snowflake-6qs4v
(Note that it works OK inside CodeSandBox because the way they build the project. It's in localhost where things break down)
Possible solutions:
- Change text "Warning: " to "Error: "
- Make the warning/error prefix configurable.
- Replace Warning with Error when an argument for getStack is provided.
I feel like number 2 is least prone to breaking existing code, as some projects might test for the Warning messages.
I'll be happy to submit a PR for the issue if approved.
checkPropTypes takes a
getStackargument that can be used to send the component or error stack.It then prints the error stack string at the end of the
Warningdisplayed in the console.Chrome seemingly expects
console.erroroutput to begin withErrorin order for it to resolve Source Maps correctly, but the checkPropTypes message sent toconsole.errorbegins with the textWarninginstead.This makes Chrome resolve the source to the bundled code rather than using the provided Source Maps.
This is a weird issue for sure and I welcome any feedback on other potential causes.
Link to the responsible line of code in the repo
prop-types/checkPropTypes.js
Line 18 in 8f89a1c
Changing the text from
"Warning: "to"Error: "solves the issue.Current result: (with Warning)

Desired result (with Error)

CodeSandBox link with example code:
https://codesandbox.io/s/hungry-snowflake-6qs4v
(Note that it works OK inside CodeSandBox because the way they build the project. It's in localhost where things break down)
Possible solutions:
I feel like number 2 is least prone to breaking existing code, as some projects might test for the Warning messages.
I'll be happy to submit a PR for the issue if approved.