Ember.js record.save() is successful, but object has state inflight

Question

I am using a fairly new version of Ember (Ember 3.7.2, Ember Data: 3.7.0)

I create a record in the client (using store.createRecord()) and I give it a GUID as the ID. The record must have an ID in the client because it is not immediately saved to the backend. The user may edit the record before it is saved.

I then save it to the backend with record.save() and I use the JSONAPIAdapter. The backend changes the ID to an integer (An autoincrement in the database) and the payload returned from the server includes the newly saved object with this new ID. The idea is that the ember data framework shall update the record with the new ID from the backend. That does not happen in ember-data 3.7. It did happen in ember-data 3.0.1 before I upgraded to the latest ember version.

The object in the client keeps it GUID and furthermore and it now has the state "isSaving"=true. So, if I later try to delete this object I get this error:

Attempted to handle event deleteRecord on while in state root.loaded.created.inFlight.

I am using a standard version of the JSONAPISerializer. To be able to give the record an client-side ID, I have subclassed the JSONAPIAdapter to include this mehtod:

generateIdForRecord: function(/* store, record */) {
  var d = new Date().getTime();
  var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
    var r = (d + Math.random()*16)%16 | 0;
    d = Math.floor(d/16);
    return (c==='x' ? r : (r&0x3|0x8)).toString(16);
  });
  return uuid;
}

What should I do to save properly and don't get an error when I try to delete the object?

NOTE

I rolled back to ember version 3.0.0 / ember data version 3.0.1. In that version it worked fine. I.e. the ID was updated in the record when the save call returned from the server with the new id.

So there must be a change from ember 3.0.0 to 3.7.0 related to record.save and update of ID and state isSaving/saved.

Don't generate a different ID on the ember side, when you create a new record ember data will assign a temporary random id — Patsy Issa
@PatsyIssa, how dows that work? I tried to remove my generateIdForRecord method from my adapter. Then the id became 'null' and everything broke. — Vilhelm H.
@wuarmin, I have updated the questions with more details about why the GUID. — Vilhelm H.
I'm quite sure that ember data does not support mutating IDs. I would bet that it does not even recognize that the record with client-side generated GUID and record returned with server-side generated ID are the same. Did you checked if you end up with two records in the store? One having client-side generated GUID and one server-side generated ID? — jelhan

Milton Castro Milton Castro · Accepted Answer · 2020-04-28T12:52:26

It seems you where exploring a bug on the ember-data, because it not allows you to change record ids. So I not recommend you to keep generating ids at the frontend and changing it on the backend. You supposed to leave the id null, but if it's not working some how, you should take a look on that code.

As a workaround to do a quick and dirty fix you can use the unloadRecord() instead of the deleteRecord(), and it will not send a request to delete this record for the backend.

Ember.js record.save() is successful, but object has state inflight

1 Answers