1400856 - [sourcemaps] Sourcemaps defined in inline scripts are not displayed

Status: REOPENED

(DevTools :: Debugger, defect, P3)

Description

[Julien Wajsberg [:julienw]]

Attachment: testcase-inline-sourcemaps.html

STR:
1. Open the attached file.
2. Open the debugger.

Expected:
* we can see the original sources.

Actual:
* we don't see the original sources.


Additional notes:
1. I generated this code with webpack:

  webpack --optimize-minimize --devtool inline-source-map script.js script-bundle.js

from the following code:

  function test(number) {
    const variable = number;
    console.log(variable);
  }

  document.querySelector('button').addEventListener('click', function() {
    test(5);
  });

2. This is happening in an important real-life testcase: https://paul.cx/public/exportify/exportify.html

This example uses JSXTransformer, which is now deprecated, but still used by some beginners. Not seeing the sources when you're a beginner is bad.

3. This works in Chrome. (tm)

4. This works fine when the script is not inline or when it's eval-ed.

Comment 1

[Julien Wajsberg [:julienw]]

Sourcemaps stuff is for :tromey :)

Comment 2

[Tom Tromey :tromey]

Confirmed; adding it to the list.

Comment 3

[Tom Tromey :tromey]

This seems to work but I am not completely confident in it yet.

diff --git a/devtools/server/actors/utils/TabSources.js b/devtools/server/actors/utils/TabSources.js
index d7f697b..ac12488 100644
--- a/devtools/server/actors/utils/TabSources.js
+++ b/devtools/server/actors/utils/TabSources.js
@@ -130,7 +130,7 @@ TabSources.prototype = {
         return this._sourceMappedSourceActors[source.url];
       }
 
-      if (isInlineSource) {
+      if (this._useSourceMaps && isInlineSource) {
         // If it's an inline source, the fake HTML source hasn't been
         // created yet (would have returned above), so flip this source
         // into a sourcemapped state by giving it an `originalUrl` which

Comment 6

[Tom Tromey :tromey]

I don't remember the details here any more, but I don't think that patch in in comment #3 is sufficient.
It might help in some cases but I think deeper changes are needed to make source maps work properly
in <script> and <style> elements.  There's some discussion of this in one of the other bugs, and also
in the source map planning document.

Comment 7

[Tom Tromey :tromey]

:wlach pinged me on irc to ask about the planning document, so I thought I'd post a link here:
https://docs.google.com/document/d/19TKnMJD3CMBzwByNE4aBBVWnl-AEan8Sf4hxi6J-eps/edit?usp=sharing

In particular the "SourceURL Handling" section outlines a possible plan.
I do wonder if there's a simpler way to achieve all this.  I couldn't think of one though.

Comment 8

[Jason Laster [:jlast]]

I believe this now works

Comment 9

[Jason Laster [:jlast]]

Attachment: Screen Shot 2019-05-23 at 4.22.50 PM.png

Comment 10

[Julien Wajsberg [:julienw]]

Hey Jason, this does work for the testcase but not for the other URL.
I'm not sure what the difference is -- maybe that the inline script is dynamically added by JSXTransformer ?