Chrome Dev Tools - Workspace mapping mismatch

Question

I have a remote webpage that loads a remote JavaScript file called script.js. I don't have immediate access to the remote filesystem to make changes to test something.

So I copy script.js to my local drive, and in Chrome Dev Tools I add my local folder to the workspace. Then I right-click on my remote script.js file and pick Map to File System Resource.... I pick my local script.js.

So now I would expect my locale changes to script.js to override the remote script.js, right? This way I can make some changes to my local script.js and when I reload the page I can see the changes being reflected on my page.

However in the Sources tab, when selecting my local script.js I see the warning at the top:

Workspace mapping mismatch

The content of this file on the file system:

file:///Users/me/test/script.js

does not match the loaded script: 

http://someserver.com/js/script.js

Possible solutions are:
- Reload inspected page
- Check that your file and script are both loaded from the correct source and their contents match

So is this telling me that my local script.js needs to be exactly the same as the remote script.js? If so, then what is the point of the local resource?

Isn't it there so that you can make changes to it and see those changes reflected in the browser? If it has to match the remote file, then you must already have access to be able to edit the remote file, in which case you would be making your changes there and not on the local file. If that is the case, then what is the point of having the local resource mapped?

Am I missing something here? Is it not possible to make temporary local changes to a file in Chrome Dev Tools and have those changes be reflected when the page is reloaded? I thought that was the purpose of the Local File System Resources.

Answer 1

Workspaces is built to map the same file that's in file and served over the network. (like serving ~/code/app to localhost:8000).

It will not work for serving a local file as a replacement. There are some Chrome extensions for this, I recommend Flip the Script.