Automatically reload Chrome when editing files on OSX

When developing web applications, we often have to switch between a text editor (TextMate in my case) and a web browser (Chrome in my case) for testing purposes. Manually saving your files, switching to the browser and reloading the page can become a pain, as we perform these actions constantly during development.

To automate this process, we can use fswatch to monitor file changes and AppleScript to reload the browser whenever such a file change has been detected. Breaking it down into easy steps, this is what you should do:

1. Download and install fswatch. fswatch is awesome and it will monitor any changes that happen to any file in a specific directory (or any of its sub-directories).

2. Create the following file (I called it reloadActiveChromeTab.applescript) that reloads the active tab of Chrome whenever it is executed as AppleScript:

tell application "Google Chrome"
  reload active tab of window 1
end tell

3. Assuming that the root folder of your web project is located at “/Users/you/Sites/project”, you can now automatically reload Chrome each time you save a file in that project folder by using the following command:

fswatch /Users/you/Sites/project "osascript reloadActiveChromeTab.applescript"

That’s it! Feel free to post a comment if you run into any problems.

Post a comment