HenryVonfire

Step 1: Launch Google Chrome with Remote Debugging support

• windows: <path to chrome>/chrome.exe --remote-debugging-port=9222
• macOS: /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222
• linux: google-chrome --remote-debugging-port=9222

Step 2: Install "Debugger for Chrome" extension

Step 3: Setup your application

HenryVonfire

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
});

HenryVonfire

import Ember from 'ember';
// it makes the issue of async really simple, in that you just care about the array {{my-component}} yields out
// it may at some times be empty, it may have some stuff later -- you're just binding to it. No promises for you to worry about
// you could do the same thing with the API call currently in your controller, and then break out code that consumes that data into other components.
// to make this even fancier, you could add Ember.run.debounce to avoid race conditions
export default Ember.Component.extend({
  term: '',
  init() {
    this._super(...arguments);
    this.set('results', []);

HenryVonfire

import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';

export default Ember.Component.extend({
  layout: hbs`{{yield sortedItems}}`,
  sortedItems: Ember.computed('data.@each.id', 'sort', function() {
    const sort = this.get('sort');
    const sorted = [...this.get('data')].sort((a, b) => {
    	if (sort === 'up') return a.id - b.id;
      return b.id - a.id;

HenryVonfire

import Adapter from 'ember-data/adapters/json-api';
import Ember from 'ember';
import RSVP from 'rsvp';

const { Promise } = RSVP;
const { get } = Ember;

class Transaction {
  constructor(store, ModelClass, primary, transactionMembers) {
    this.store = store;

HenryVonfire

import Ember from 'ember';

export default Ember.Controller.extend({
  actions: {
  	showText() {
      // this throws an error of exampleFun is not a function
      // in ember > 3.2 when ec-mirage is enabled
    	this.model.exampleFun();
    }
  }

HenryVonfire

if(!("valueAsDate" in HTMLInputElement.prototype)){
  Object.defineProperty(HTMLInputElement.prototype, "valueAsDate", {
    get: function(){
      var d = this.value.split(/\D/);
      return new Date(d[0], --d[1], d[2]);
    },
    set: function(d){
      var day = ("0" + d.getDate()).slice(-2),
          month = ("0" + (d.getMonth() + 1)).slice(-2),
          datestr = d.getFullYear()+"-"+month+"-"+day;

HenryVonfire

import Ember from 'ember';

export default Ember.Controller.extend({
  appName:'Ember Twiddle',
  actions: {
    test() {
      this.model.forEach(person => person.rollbackAttributes());
      this.store.push({
        data: {
          // primary data for single record of type `Person`