7

I'm using Chrome 65 on Mac. I have set up a workspace in Chrome under the 'Sources > Filesystem' tab. I'm able to edit files and Chrome will save these changes to the actual file on my disk. But I would like to use the live editing capabilities of the 'Elements' tab to alter HTML & CSS and let Chrome save these changes.

I have found many answers, but none work with the current version of Chrome.

user63457
  • 591
  • 2
  • 7
  • 18
  • 1
    There is no solution. – wOxxOm Mar 21 '18 at 22:26
  • 1
    @wOxxOm - You seems to be right. 'Local overrides' allows you to save changes you make in the element/style inspector as virtual branch. Using a 'workspace' you are able to edit files on your disk. All the ingredients are there, but the final touch seems missing. – user63457 Mar 22 '18 at 08:36
  • I made a dirty hack there,everytime you want to save dom tree just paste it to the console:https://stackoverflow.com/a/66978187/10096812 – 傅继晗 Apr 07 '21 at 00:55

2 Answers2

2

You may not be able to save the file locally as you can with you CSS changes (from the "Sources" tab), but you can copy and paste elements using Chrome 65 and above (maybe older versions too). Copying the element also copies all of its children and their children. So, if you copy the <html> element, you will get the entire page - everything between <html> and </html>.

Right click on the element, go to Copy > Copy element. Then paste the clipboard content into your favorite editor or IDE and save. Not as convenient as saving from the Sources tab, but it does allow you to get/save all the changes you've made in the Elements tab.

seveninstl
  • 824
  • 1
  • 9
  • 17
0

Simply saving the website (File > Save Page As...) works for me.

thSoft
  • 21,755
  • 5
  • 88
  • 103