
Starting to come togetherĮverything was in place. Eventually I discovered they were using Socket.io to achieve this. I started to dig into the Karma source code. I had found something that was able to watch the file system for changes and inform browsers all about it. While testing in IE8 one day, I realized that Karma was automatically re-running the tests on each file save.īingo.

Karma allows you to run tests in multiple browsers. I had my lightbulb moment when using Karma for running unit-tests. This is why there was no support for old IE. The Grunt + LiveReload combination I was using previously relied on Web Sockets.
#Livereload vs browser sync how to
The issue I had to solve was how to communicate a file-system change back to the browsers. I knew from the outset that simply inserting new CSS into browsers is easy enough to do. Most importantly, it works in every browser I’ve been able to test it on. This all happens without reloading the page. It will watch over your files and the moment you make a change, it will inform all connected browsers to reload (inject) the new CSS. It’s also why I built Browser-Syncīrowser-sync is a tool that gives you cross-browser CSS injecting. For the first time in over a year I had to resort to manual page-refreshes every time I made a change to my CSS. The LiveReload plugin I was using simply didn’t support older versions of IE.

It felt like a really nice workflow until I had to work on a project that required IE7 & 8 support. This is exactly what happened to me recently.įor at least the last 12 months I had been using Grunt and the LiveReload browser extension to inject CSS when my files changed.

The ability to inject newly-modified CSS on every file change (without reloading the page) is the type of workflow-enhancement that you never truly appreciate… until you lose it.
