Closed
Description
Problem
There are multiple issues that have been filed for numerous different reports of source-maps having issues in chrome.
Work Required
Listed is the canonical specification for source-maps:
https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit
We would like help (as we cannot make this a priority with current resources) creating every type of sourcemap, and then either manually (or via unit testing) validate that the source-map types that we have configured in place currently (starting at webpack2.1.0-beta.25) and work in Chrome.
Results
This will allow us to:
- Create unit tests that are sturdier, and a source map validation tool to ensure it works to this specification (if it doesn't already exist).
- Identify if source-map issues are chrome bugs or webpack bugs.
If there is anyone who would like to tackle this, please comment in the issue, then we can be aware of who is working on it, and how
Activity
addyosmani commentedon Oct 20, 2016
Have you looked at https://github.com/mattrobenolt/sourcemap-validator before? I believe in the past they've tried to roughly approximate how well support with the current spec could be captured by their validator.
mattkime commentedon Oct 21, 2016
I made a small (very small) hello world script and passed it through webpack. the resulting sourcemap does not work in chrome.
https://github.com/mattkime/node-test-debuggers
npm install && npm run build && npm run chrome:webpackand you should be able to see the issue - the original 'index.js' file is referenced in the sourcemap but its not displayed in the sources list.TheLarkInn commentedon Oct 21, 2016
@addyosmani thank you so much.
@mattkime are you familiar will all the types of sourcemaps you can generate with webpack?
TheLarkInn commentedon Oct 21, 2016
See https://github.com/webpack/webpack/blob/master/lib/WebpackOptionsApply.js#L200-L232
mattkime commentedon Oct 21, 2016
@TheLarkInn I am. I guess I should iterate through all the options? I was trying to find the simplest starting point and iterate out through there.
TheLarkInn commentedon Oct 21, 2016
Yeah id say just one at a time! I haven't tried out the validator that Addy suggested just yet but I would think that could provide a great way to iterate quickly.
mattkime commentedon Oct 21, 2016
The validator is, um, under documented. I'm not certain what it does or doesn't document.
I gave 'eval-soucre-map' a go and it worked well on my simple test and failed on a complex project.
As mention in the issue description, I'm not sure if i'm looking at webpack or chrome bugs.
While I'm happy to pitch in, I need some guidance to get started on this.
mattkime commentedon Oct 21, 2016
Ideally we'd find someone on the Google Chrome project that could give us some guidance.
found some very helpful stuff -
http://sourcemapper.qfox.nl/
http://www.mattzeunert.com/2016/02/14/how-do-source-maps-work.html
joachimprinzbach commentedon Oct 21, 2016
I did also like this link for some information: http://jlongster.com/On-the-Road-to-Better-Sourcemaps-in-the-Firefox-Developer-Tools
mattkime commentedon Oct 21, 2016
this shows a sourcemap working when loaded via front end and failing when loaded via node
https://github.com/mattkime/chrome-devtools-sourcemap-test
while webpack could certainly use a good sourcemap test suite, i'd hold off on pursuing bugs in webpack's sourcemap production until we're certain that chrome works correctly or we find a better standard.
112 remaining items