{"id":5766,"date":"2014-04-06T20:17:40","date_gmt":"2014-04-06T20:17:40","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2014\/04\/06\/side-loading-objects-with-non-standard-class-names-in-emberjs-with-railsactive_model_serializers-collection-of-common-programming-errors\/"},"modified":"2014-04-06T20:17:40","modified_gmt":"2014-04-06T20:17:40","slug":"side-loading-objects-with-non-standard-class-names-in-emberjs-with-railsactive_model_serializers-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2014\/04\/06\/side-loading-objects-with-non-standard-class-names-in-emberjs-with-railsactive_model_serializers-collection-of-common-programming-errors\/","title":{"rendered":"Side-loading objects with non-standard class names in EmberJS with Rails+active_model_serializers-Collection of common programming errors"},"content":{"rendered":"

I have a few models in Rails that look something like this:<\/p>\n

class Issue < ActiveRecord::Base\n  belongs_to :reporter, class_name: 'User'\n  belongs_to :assignee, class_name: 'User'\n  has_many :comments\nend\n\nclass User < ActiveRecord::Base\nend\n\nclass Comment < ActiveRecord::Base\nend\n<\/code><\/pre>\n
with serializers like so:<\/p>\n
class IssueSerializer < ActiveModel::Serializer\n  attributes :id\n  embed :ids, include: true\n\n  has_one :reporter, :embed => :ids\n  has_one :assignee, :embed => :ids\nend\n\nclass UserSerializer < ActiveModel::Serializer\n  attributes :id, :name\nend\n\nclass CommentSerializer < ActiveModel::Serializer\n  attributes :id, :body\nend\n<\/code><\/pre>\n
This produces JSON that looks something like the following:<\/p>\n
{\n  \"issues\": [\n    {\n      \"id\": 6,\n      \"reporter_id\": 1,\n      \"assignee_id\": 2,\n      \"comment_ids\": [\n        3\n      ]\n    },\n  ],\n  \"comments\": [\n    {\n      \"id\": 3\n      \"body\": \"Great comment\"\n    }\n  ],\n  \"reporters\": [\n    {\n      \"id\": 1\n      \"name\": \"Ben Burton\"\n    }\n  ],\n  \"assignees\": [\n    {\n      \"id\": 2\n      \"name\": \"Jono Mallanyk\"\n    }\n  ]\n}\n<\/code><\/pre>\n
The problem is that the side-loaded reporters and assignees JSON objects aren’t recognized by Ember as User objects, and I see the following error:<\/p>\n
Uncaught Error: assertion failed: Your server returned a hash with the key reporters but you have no mapping for it\n<\/code><\/pre>\n
I don’t want to remove<\/p>\n
embed :ids, include: true\n<\/code><\/pre>\n
from my IssueSerializer, because then the comments wouldn’t be serialized.<\/p>\n
There are a few potential ways to solve this that I’ve considered:<\/p>\n
    \n
  • If the embed method for ActiveModel::Serializer accepted a list of models in its include option, this could filter the JSON response to only include side-loaded comments.<\/li>\n
  • Ember data’s model could be configured to side load users from “users”, “reporters” and “assignees”… but as far as I can tell from the source it only appears to support one key for sideloadAs.<\/li>\n
  • Somehow ignore\/disable side-loading errors for unknown keys (probably the least sane approach).<\/li>\n<\/ul>\n
    Is there another option I’m missing here? I think I may have to write a fix and submit a pull request to either rails-api\/active_model_serializers, emberjs\/data, or both.<\/p>\n
    EDIT<\/strong>: My temporary workaround for this is to change the IssueSerializer to only serialize the ids for reporter and assignee:<\/p>\n
    class IssueSerializer < ActiveModel::Serializer\n  attributes :id, :reporter_id, :assignee_id\n  embed :ids, include: true\n\n  has_many :comments, :embed => :ids\nend\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"
    I have a few models in Rails that look something like this: class Issue < ActiveRecord::Base belongs_to :reporter, class_name: ‘User’ belongs_to :assignee, class_name: ‘User’ has_many :comments end class User < ActiveRecord::Base end class Comment < ActiveRecord::Base end with serializers like so: class IssueSerializer < ActiveModel::Serializer attributes :id embed :ids, include: true has_one :reporter, :embed => […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-5766","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/5766","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=5766"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/5766\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=5766"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=5766"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=5766"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}