New Twiddle

controllers.application.js

import Ember from 'ember';
import { task, timeout, all } from 'ember-concurrency';
import { retryable, DelayPolicy } from 'ember-concurrency-retryable';
import RSVP from 'rsvp';

const delayPolicy = new DelayPolicy({ delay: [100, 100] });

const originalEmberOnError = Ember.onerror;

let defers = [];

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  
  regularWithoutYield: task(function * () {
    return all([
      this.get('unlinkedTask').unlinked().perform(),
      this.get('anotherUnlinkedTask').unlinked().perform(),
      this.get('regularTask').perform(),
      this.get('throwingTask').perform(),
    ]);
  }),
  
  regularWithYield: task(function * () {
    return yield all([
      this.get('unlinkedTask').unlinked().perform(),
      this.get('anotherUnlinkedTask').unlinked().perform(),
      this.get('regularTask').perform(),
      this.get('throwingTask').perform(),
    ]);
  }),
  
  retryableWithoutYield: retryable(task(function * () {
    return all([
      this.get('unlinkedTask').unlinked().perform(),
      this.get('anotherUnlinkedTask').unlinked().perform(),
      this.get('regularTask').perform(),
      this.get('throwingTask').perform(),
    ]);
  }), delayPolicy),
  
  retryableWithYield: retryable(task(function * () {
    return yield all([
      this.get('unlinkedTask').unlinked().perform(),
      this.get('anotherUnlinkedTask').unlinked().perform(),
      this.get('regularTask').perform(),
      this.get('throwingTask').perform(),
    ]);
  }), delayPolicy),

  unlinkedTask: getDeferableTask('unlinkedTask'),
  anotherUnlinkedTask: getDeferableTask('anotherUnlinkedTask'),
  regularTask: getDeferableTask('regularTask'),
  throwingTask: task(function* () {
    throw new Error('This task throws');
  }),
  
  actions: {
    async catchATask(name) {
      this.set(`${name}CaughtError}`, null);
      defers = [];
      
      Ember.run.later(() => {
        defers.shift().resolve('a');
      }, 300);
      Ember.run.later(() => {
        defers.shift().resolve('b');
      }, 700);
      Ember.run.later(() => {
        defers.shift().resolve('c');
      }, 1000);
      Ember.onerror = (e) => {
        console.log(e);
        this.set(`${name}EmberOnError`, true);
      };
      
    	try { 
        await this.get(name).perform();
      } catch (e) {
        this.set(`${name}CaughtError`, true);
      }
    }
  }
});

function getDeferableTask(name) {
  return task(function * () {
    let defer = RSVP.defer();
    defers.push(defer);
    let value = yield defer.promise;
    return value;
  });
}

templates.application.hbs

<p>
  <strong>Regular Task (<code>return all(...)</code>)</strong><br>
  state: {{regularWithoutYield.state}}<br>
  last.value: {{regularWithoutYield.last.value}}<br>
  last.error: {{regularWithoutYield.last.error}}<br>
  caught error in try/catch: {{regularWithoutYieldCaughtError}}<br>
  caught by Ember.onerror: {{regularWithoutYieldEmberOnError}}
</p>

<p>
  <button onclick={{action 'catchATask' 'regularWithoutYield'}}>
    Perform regular task without yield
  </button><br>
</p>

<hr>

<p>
  <strong>Regular Task (<code>return yield all(...)</code>)</strong><br>
  state: {{regularWithYield.state}}<br>
  last.value: {{regularWithYield.last.value}}<br>
  last.error: {{regularWithYield.last.error}}<br>
  caught error in try/catch: {{regularWithYieldCaughtError}}<br>
  caught by Ember.onerror: {{regularWithYieldEmberOnError}}
</p>

<p>
  <button onclick={{action 'catchATask' 'regularWithYield'}}>
    Perform regular task with yield
  </button><br>
</p>

<hr>

<p>
  <strong>Retryable Task (<code>return all(...)</code>)</strong><br>
  state: {{retryableWithoutYield.state}}<br>
  last.value: {{retryableWithoutYield.last.value}}<br>
  last.error: {{retryableWithoutYield.last.error}}<br>
  caught error in try/catch: {{retryableWithoutYieldCaughtError}}<br>
  caught by Ember.onerror: {{retryableWithoutYieldEmberOnError}}
</p>

<p>
  <button onclick={{action 'catchATask' 'retryableWithoutYield'}}>
    Perform retryable task without yield
  </button><br>
</p>

<hr>

<p>
  <strong>Retryable Task (<code>return yield all(...)</code>)</strong><br>
  state: {{retryableWithYield.state}}<br>
  last.value: {{retryableWithYield.last.value}}<br>
  last.error: {{retryableWithYield.last.error}}<br>
  caught error in try/catch: {{retryableWithYieldCaughtError}}<br>
  caught by Ember.onerror: {{retryableWithYieldEmberOnError}}
</p>

<p>
  <button onclick={{action 'catchATask' 'retryableWithYield'}}>
    Perform retryable task with yield
  </button><br>
</p>

twiddle.json

{
  "version": "0.12.1",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "2.16.0",
    "ember-template-compiler": "2.16.0",
    "ember-testing": "2.16.0"
  },
  "addons": {
    "ember-concurrency": "latest",
    "ember-concurrency-retryable": "latest"
  }
}