DevTools answers: patching changes from DevTools back to an extension

I was asked if it's possible to patch back Chrome DevTools based changes to a DevTools extension. For example, CSS changes made to the Elements panel. The current solution to this (confirmed with engineering) is onResourceContentCommitted. This is fired whenever a new revision of a resource is committed, such as a user saving an editing version of a resource. A discussion about it can be found on the Chromium bug tracker.

onResourceContentCommitted works for both CSS and JavaScript, provided that these are resources of their own and are not inlined into the main resource. Extensions such as DevTools AutoSave and Tincr have used this approach successfully in the past and if you're an extension author, I recommend looking at their source.

A solution is currently not available for DOM changes as the actual DOM is quite different from what was in the original HTML. Most of the time it doesn't really make sense or you can't apply DOM changes to the original document because the DOM diverged too much.

We plan on documenting common questions and answers to do with the DevTools extensions API in the near future but feel free to ask at any time if you have a nagging question you need help with.