I gave Shane Osbourne’s browser-synchronising testing tool a go and wasn’t disappointed. I had taken a sneak peek at his css-tricks blogpost and had put his github repo in my to-be-tested list.
No disappointment, as i was saying, since the tool does exactly what it says on the tin: scrolls, forms, links, css injecting, live reload and more.
Install it by running:
(sudo) npm install -g browser-sync
go to your dev folder, and run:
browser-sync --files "app/css/*.css, app/*.html"
The terminal will gently ask you to copy and paste a couple of scripts at the bottom of your web page, just before the body-closing tag.
Once those scripts pasted in, and your local server fired up on your browsers, the terminal will state what browsers are connected.
Browser Connected! (Chrome, version: 31.0.1650.63) Browser Connected! (Firefox, version: 25.0)
Off you go, develop away, then scroll, click, and fill in forms. Everything is in sync.
Brilliant.
Note: If you are just using HTML files, you can use the static file built-in server instead of the snippets. Take a closer look at Shane’s detailed repo to know the ins and outs of this great tool.
Give this man some love.
Shane Osbourne on Twitter.
Browser-sync on Github.
My name is Flo Preynat and I am the freelance webdesigner and developer behind shoogle designs. I live in France and specialize in responsive web design. Give me a shoogle or get in touch with me on twitter.
Follow @shoogledesigns
I wish if it could work with Rails app