Live Editing Remote JavaScript in Chrome Inspector

Question

I'm trying to debug remote javaScript using Google Chrome inspector. I recall in the past being able to:

1) Edit remote javascript using Chrome Inspector

2) 'Save' the change using (cmd + s)

3) Test the effect the the altered javaScript on the page

Now when I try to 'save' the change I get a yellow warning icon in the 'tab' that says

"Changes to this file were not saved to the file system"

Can anyone help me with this, please bear in mind that I'm working with remote code (not trying to alter local files) and I do have the developer tools extension installed.

Answer 1

The changes were not saved to disk because you obviously can't access the remote js file, but they will take effect when javascript will reach to these lines of code.

You can add a breakpoint before the place you want to dynamically add your code, reload the page, add the code you want, click ctrl-s. Ignore the warning you mention about the file system and enjoy.

So you can follow these steps and just ignore the warning.

Answer 2

For anyone who stumbles across this, as I did...

For Local Files

You may need to run chrome as Administrator. Or in my case (Ubuntu) as root user.

sudo google-chrome --no-sandbox

Then you can save the files within devtools.

Answer 3

UPDATE : Per the link below, the docs have moved here .

You have to have Workspaces set up in order to do this. Read the docs on how to use Workspaces: https://developer.chrome.com/devtools/docs/workspaces