How to Edit Source Files Directly in Chrome ?( and keep it after refresh)

Question

After reading this article which suppose to help with my question ( but didn't) - I still have a question .

Ok . My goal is to be able to edit downloaded scripts and keep the edit ! ( for next refresh).

Now i'm aware that it might wont work if a new timestamp is added to the file. but within my testing - the url is the exact name.

Say jQuery.com :

It downloads a script name main.js :

I click to edit it in the right pane , :

Then I save it ( notice the pink background).

I also save it in the desktop ( so it will be saved to a file system , as the article states)

But : when I refresh the page ( f5 , not ctrlf5) - I get a fresh copy without my modifications :

Question

What am I doing wrong ? and how can I make my modifications to stay even after refresh ?

(and besides if it shows the pink background-color as a saved , file .... saved where ? why the changes are not saved ")

nb : chrome ver 35.0.1916.153 m

Answer 1

I think the critical point here is that the site you're editing needs to be served locally. Unless you're actually serving api.jquery.com from your own computer, your saved changes will be lost when you refresh.

You should save the files you're working on to your computer and open them in Chrome. Then follow the article's directions. When you right-click 'Save As', save it to the same place on disk that the file is being served from.

Answer 2

I have achieved a quite similar work flow using this tutorial

You can also use Chrome's extension for autosave

More detailed instructions can be found here: http://github.com/NV/chrome-devtools-autosave

Note that you can edit your own files only, and that a server like setup is required