A loading indicator addon for EmberJS that blocks user input while your app is busy doing stuff.

Usage no npm install needed!

<script type="module">
  import emberBusyBlocker from 'https://cdn.skypack.dev/ember-busy-blocker';


Ember Busy Blocker

A loading indicator that blocks user input while your app is busy doing stuff. This is intended to be used supplementally with Ember's native loading substates when the application needs to block user input and show a loading indicator while processing information(e.g. when saving a model).

Check out the Test App on Github Pages for a live demo.


ember install ember-busy-blocker


  • Add the {{busy-blocker}} component toward the bottom of the application template.
  • Add styles. Can copy the default sample styles from vendor/ember-busy-blocker.css or use as an example and customize.
  • Use Mixin or inject Service
  • Call Busy service show() and hide() functions
  • Can also trigger busy and free actions if using Mixin



  • git clone this repository
  • npm install
  • bower install


  • ember server
  • Visit your app at http://localhost:4200.

Running Tests

  • npm test (Runs ember try:testall to test your addon against multiple Ember versions)
  • ember test
  • ember test --server


  • ember build

For more information on using ember-cli, visit http://www.ember-cli.com/.


Shout out to ember-cli-loading-slider for inspiration.


MIT License