1808361 - DevTools JavaScript debugger incorrectly thinks a file is not minified and so won't pretty-print it

Status: NEW

(DevTools :: Debugger, defect, P3)

Description

[Oliver Jensen]

Attachment: Screenshot 2023-01-03 at 10.17.28.png

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:108.0) Gecko/20100101 Firefox/108.0

Steps to reproduce:

1. visit https://app.regrello.com
2. open dev tools
3. navigate to the debugger
4. select the following file:
   /static/node_modules/.pnpm/react-dom@17.0.2_react@17.0.2/node_modules/react-dom/cjs/react-dom.production.min.js
5. click the "{}" pretty-print button under the minified source code

Actual results:

The button cannot be clicked. It is disabled, and on hover, displays the following message:
"Can't pretty-print original sources, file is already readable"

Expected results:

The button should have worked and reformatted the source code.

Note: the file can still be pretty-printed by right-clicking the tab above the debugger with the filename, and then selecting "pretty-print source"

Comment 1

[Oliver Jensen]

Attachment: Screenshot 2023-01-03 at 10.42.36.png

Comment 2

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'DevTools::Debugger' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Comment 3

[Julian Descottes [:jdescottes]]

The message is indeed confusing. If I remember correctly the reason we disable the button is that this source is an "original" source, meaning that we retrieved it from a sourcemap. In this case the website actually uses it packaged in a bundled file called https://app.regrello.com/static/js/3.a16de4ac.chunk.js. Pretty printing an original source can confuse the debugger and create issues with breakpoints.

We should not assume that the file is "readable" and at least update the message.

Comment 4

[Hubert Boma Manilla (:bomsy)]

Attachment: WIP: Bug 1808361 - [devtools] Allow pretty print original sources which are minified

It was incorrectly assumed that original sources are always prettyfied.
In these cases we should enable pretty printing.

Comment 5

[Holger Benl [:hbenl]]

If we want to support pretty-printing original files (coming from a sourcemap) then we'd probably need to merge the sourcemap that contains the original file with the one we generate for the pretty-printing step. There are several libraries that show how to do this: merge-source-map, combine-source-map (both based on our source-map library) and @ampproject/remapping.