New Twiddle

controllers.application.js

import Ember from 'ember';

const {
  computed,
  get,
  set
} = Ember;

function makeCP(dependentKey) {
 return computed(dependentKey, function() {
   const value = get(this, dependentKey);
   return `${dependentKey} -> ${value}`;
 });
}

export default Ember.Controller.extend({
  value: 'foo',
                 
  a: makeCP('value'),
  b: makeCP('a'),
  c: makeCP('b'),
  d: makeCP('c'),
  e: makeCP('d'),
  f: makeCP('e'),
  g: makeCP('f'),
  h: makeCP('g'),
  i: makeCP('h'),
  j: makeCP('i'),
  k: makeCP('j'),
  l: makeCP('k'),
  m: makeCP('l'),
  n: makeCP('m'),
  o: makeCP('n'),
  p: makeCP('o'),
  q: makeCP('p'),
  
  actions: {
    setValue(value) {
      set(this, 'value', value);
    }
  }
});

templates.application.hbs

{{input value=value}}

<button {{action "setValue" null}}>
	set null
</button>

<ol type="a">
  <li>{{a}}</li>
</ol>

{{q}}

twiddle.json

{
  "version": "0.10.6",
  "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.9.0",
    "ember-data": "2.9.0",
    "ember-template-compiler": "2.9.0",
    "ember-testing": "2.9.0"
  },
  "addons": {}
}