When I was working on a simple extension for Chrome a couple of days ago I encountered a problem that the browser does not reload the extension’s source code automatically after I change something. This makes the development harder because after every change you have to press the “Reload” button on the extensions list and then you have to refresh the page to restart content scripts.

After a short research, it turned out that Chrome offers all required APIs in order to implement the hot reload functionality for extensions.

The final solution is available on Github and in the remaining part of the post I will explain how it works.

The reloading of the tab happens before runtime.reload. Otherwise it won’t work because runtime.reload stops execution of the script. But due to the fact that tab reloading is asynchronous everything gets reloaded in the right order — although it looks illogical in the code.

And the final step — the extension starts the watchdog targeting the directory with the extension’s code. This has to be done only if the extension is loaded in the developer mode (i.e. via “Load unpacked extension”):