Ember Twiddle Demo: Mirage with Ember Twiddle

README.md

Ember Twiddle Demo: Mirage with Ember Twiddle

Demo

This is a very trivial example of using mirage with Ember Twiddle.

adapter.application.js

import Ember from 'ember'
const {$, deprecate, get, inject} = Ember
import DS from 'ember-data'
const {RESTAdapter} = DS

export default RESTAdapter.extend({
  coalesceFindRequests: true
})

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({

  actions: {
   select () {
    this.send('reloadModel')
 
   }
  }
});

mirage.config.js

import Collection from 'ember-cli-mirage/orm/collection';
let count = 0
export default function() {
  window.server = this;

  this.get('/my-models', function (schema, request) {
    let ex = {name: 'Jane Eyre'}
    if (count === 0){ ex.foo = 'bar'}  
    ++count
    var posts = [{
      id: 1,
      attributes: ex,
      type: 'my-model'
    }, {
      id: 2,
      attributes:  {name: 'Emily Dickinson'},
           type: 'my-model'

    }];
    return {data: posts};
  });
};

models.my-model.js

import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import { belongsTo, hasMany } from 'ember-data/relationships';

export default Model.extend({
  name: attr('string'),
  foo: attr()
});

routes.application.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return this.store.query('my-model', {});
  },
    actions: {
    reloadModel: function() {
      this.refresh()
    }
  }
});

templates.application.hbs

<header>
  <h1>Mirage</h1>
</header>

<ul>
{{#each model as |post|}}
<li>{{post.name}} and {{post.foo}}</li>
{{/each}}
</ul>

<button {{action "select"}}>✓</button>

twiddle.json

{
  "version": "0.11.3",
  "ENV": {
    "ember-cli-mirage": {
      "enabled": true
    }
  },
  "EmberENV": {},
  "options": {
    "use_pods": false,
    "enable-testing": false 
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "3.3.2",
    "ember-template-compiler": "3.3.2"
  },
  "addons": {
    "ember-data": "3.3.2",
    "ember-cli-mirage": "0.2.4"
  }
}