Automatically refresh browser in response to file system changes?

Question

When doing web development, you frequently make changes and then refresh the browser. Is there an easy way to have a daemon listening for changes in the filesystem, and when there is one, to send a refresh message to Firefox or Safari?

This would really improve your workflow and focus. You could keep your browser running in a separate screen, and when you're working on UI related changes, it would automatically refresh as you're working.

It would be like using autotest when doing TDD. (See http://github.com/svoop/autotest-fsevent)

Has anybody done this?

Answer 1

From the browser no, not really possible as far as I know. You could add a interval javascript to refresh the page every x-seconds. But to be honest, isn't Ctrl+R suitable enough to see changes?

Answer 2

I can think of a way to do this for Firefox. You install the MozRepl plugin. You can then have it start up and telnet to port 4242 (by default) and control the browser via. Javascript commands. Issuing a BrowserReload() will reload the current tab.

Now, add an editor hook to do that when any files in the current project are saved and it'll be taken care of. I believe there are some snippets around that already do this.

• Emacs integration
• Vim integration

I don't use Safari or Chrome too much so I don't know about options there.

Also, I'm not sure this is a good idea really. I don't want my browser to refresh on every file save. I usually make a bunch of changes to the backend, css and maybe even images and then when I'm ready, reload the browser tab. It's not per save. Anyway, this will do what you want.