Ember.js Fixtures

Dated December 17th, 2013

If you are using Ember as your client-side web framework, I may just save you a lot of trouble. Ember is still being heavily developed, so I never expected it to work perfectly out of the box, but today's ordeal with setting up fixtures (using Ember Data) was impressively hair-pulling. I will be fair and preface that most of these issues arose from Ember Data itself and not Ember, but I don't consider that a valid excuse.

These were the main points that fucked me today:

1. Not much documentation.

2. Data store adapters handle data differently.

I'll walk you through a few of the pitfalls I faced:

FML #1 If you are using RequireJS because you're sane, don't want to deal with dependency issues while modularizing your code, and overall think not polluting the global namespace is a good thing, then this will screw you over (all code in Coffeescript):

DS.Model.extend
    SOME_ARRAY_OF_OTHER_THINGS: DS.attr 'App.SOME_MODEL'

The reason this screws you is because, if App is not available in the global namespace, Ember will not be able to look up "App.SOME_MODEL". This is an important nuance that I have yet to find documented anywhere. If it is, it's incredibly hard to find. Instead, set the model on your app instance and do this:

DS.Model.extend
    SOME_ARRAY_OF_OTHER_THINGS: DS.attr 'someModelInCamelCase'

FML #2 If you have embedded models of any sort in your fixtures, you are fucked. That is, you must follow the following model of structuring your data:

App.MODEL.FIXTURES = [{
    OTHER_MODELS: ['1', '2', '3', ...],
    // ... other properties
}, ...]

App.OTHER_MODEL.FIXTURES = [{
    id: '1',
    // ... other properties
}, ...]

You might be wondering what I'm talking about at this point. What I mean, is that I figured I would be able to do this:

App.MODEL.FIXTURES = [{
    OTHER_MODELS: [{
        id: '1',
        // ... other properties of this other model
    }, ...],
    // ... other properties
}, ...]

I basically tried everything to make the latter work, and it didn't. My advice is to just manually set all fixtures as I have laid out in the former. If you dig on the interwebz, you will find this StackOverflow question which has an answer that includes a "hasManyEmbedded" shim. This shim does not work with the latest stable (lol stable) Ember Data. Trust me. I wasted my time trying. You see the other answer that says you can get it working by creating explicit maps on the App's serializer? Yeah that doesn't work either.

FML #3 You see how in my previous examples I made the Ids of the fixture models Strings? That wasn't by chance. Apparently, the REST Adapter will normalize Ids to strings, but the Fixture Adapter won't. Yay inconsitencies! Did you click on that link and see the answer on the StackOveflow question? You see how there's a link of the "breaking changes" that's supposed to list the breaking issues for revision 6 of Ember Data? That file doesn't exist in their git tree anymore. The gist is to make sure you make all your Ids in your fixtures Strings. Because God knows the Fixture Adapter won't. Then your shit will break.

All the bitching aside, working with Ember has been pretty cool so far. I also have a lot of respect for Tom Dale based on his interwebz ramblings (besides this post; Tom, if you are reading this, take a look at the r.js optimizer). Most importantly, hopefully I saved y'all some time if you're getting started with Ember and need to get Fixtures working properly.