Data: Error: The adapter operation was aborted after 201 created

[nesrual]

Ember 3.0.0
Ember Data 3.0.2
Ruby on Rails 5.2.0

When using Ember and Ember Data to create a new record on a backend server using the default adapter (JSON_API) I get the following weird scenario:

The data is posted correctly to the backend and the backend replies with a 201 Created reply along with the new record rendered as JSON_API. I have used cUrl to simulate a POST to the backend and the reply is correct. However the adapter still rejects the operation.

When storing the record I use:

newAccount.save().then(allIsOk).catch(failure);

Even though the record is saved correctly and the backend server replies with a 201 Created the allIsOk is never called - only the .catch(failure) is triggered.

I have tried to change the reply from the backend server to 204 No content but the problem persists.

The CORS config for the backend server is as follows:

Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins '*'

    resource '*',
             headers: :any,
             methods: %i[get post put patch delete options head]
  end
end

We have developed a lot of apps in the past using the 2.x branch of Ember without any problems. I am really not sure where the error could be. The backend seems to be working correctly returning the correct data so I assume that the problem is with Ember / Ember Data or just me missing a tiny detail somewhere.

[runspired]

@nesrual what is the error you are catching?

[nesrual]

function failure(e) {
  console.error(e);
}

Gives me

ErrorClass {isAdapterError: true, stack: "Error: The adapter operation was aborted↵    at Er… (http://localhost:4200/assets/vendor.js:9881:10)", description: undefined, fileName: undefined, lineNumber: undefined, …}

Are there any better way to get the exception/error?

[runspired]

I would set a debugger and walk back to where it was thrown and see why it is being thrown.

[nesrual]

Adding a debugger; call inside the createUser() action and using Step over next function call (F10) actually results in the AllIsOk function to be called. Running the code without stepping through each call (Using the Resume script execution (F8) results in the failure function to be called.

Can it be some timing problem?

createUser() {
  debugger;
  .
  .
  .
}

[runspired]

Stack Overflow discussion https://stackoverflow.com/questions/49913238/ember-ember-data-error-the-adapter-operation-was-aborted-after-201-created

[nesrual]

@runspired I posted my question on Stackoverflow as well (see above link)

[runspired]

I saw, linked it for the book-keeping.

[runspired]

@nesrual a timing problem seems likely, although there's an easy way to go backwards to see.

Where the assertion is thrown, add a debugger, walk back on the stack to where the error was generated and inspect the state at that point.

See this for using the debugger in this way: https://developers.google.com/web/tools/chrome-devtools/javascript/, you'll want to "set a line of code breakpoint".

You can get to the line of code the error was thrown on simply by clicking the line number next to the error message printed in the console.

[runspired]

(I'm also happy to hop on a screen sharing session via hangouts)

[nesrual]

Does this help?

[runspired]

@nesrual yep! if you look in that call stack you'll see that hash.error was called from your rest adapter. Walk back to there (just click there) and investigate the local scope and associated code to see why it threw the error it did.

[nesrual]

(anonymous) (rsvp.js:925)
tryCatcher (rsvp.js:215)
invokeCallback (rsvp.js:393)
(anonymous) (rsvp.js:457)
(anonymous) (rsvp.js:14)
invoke (backburner.js:205)
flush (backburner.js:125)
flush (backburner.js:278)
end (backburner.js:410)
_run (backburner.js:760)
_join (backburner.js:736)
join (backburner.js:477)
run.join (ember-metal.js:4366)
hash.error (rest.js:971)
fire (jquery.js:3268)
fireWith (jquery.js:3398)
done (jquery.js:9307)
(anonymous) (jquery.js:9540)
XMLHttpRequest.send (async)
send (jquery.js:9600)
ajax (jquery.js:9206)
_ajaxRequest (rest.js:984)
(anonymous) (rest.js:974)
initializePromise (rsvp.js:418)
Promise (rsvp.js:897)
ajax (rest.js:957)
createRecord (rest.js:701)
_commit (-private.js:12280)
flushPendingSave (-private.js:11342)
invoke (backburner.js:205)
flush (backburner.js:125)
flush (backburner.js:278)
end (backburner.js:410)
_run (backburner.js:760)
_join (backburner.js:736)
join (backburner.js:477)
run.join (ember-metal.js:4366)
(anonymous) (action.js:364)
exports.flaggedInstrument (ember-metal.js:3920)
(anonymous) (action.js:363)

It seems like it catches some kind of error in the ajax call?

[runspired]

On the panel on the right (where the call stack is) if you scroll down you will be able to see variables in scope. You can also interact with anything in scope via the console while you are paused here. Likely textStatus and errorThrown will give you enough information to see what went wrong. If not, I'd poke around at the jqXHR object, requestData, and responseData to see why it generated the error that it did.

[nesrual]

The Scope section is blank.

[runspired]

click the 971 line number to add a debugger on the line and retrigger the error to pause sooner and be in the right place.

[nesrual]

I am kind of stuck (being a backend developer) - sorry. Could I send you a copy of the app so you can have a look at it?

[runspired]

@nesrual that would be acceptable. Closing this ticket as I feel fairly confident this will turn out to be an issue with user-land code, but will re-open it if not.

[nesrual]

Do you have an email/etc. where I can contact you?

[runspired]

my handle is my contact information pretty much everywhere, including gmail :)

[nesrual]

I found the solution to the problem. It's actually related to to this:

• https://github.com/machty/ember-concurrency/issues/38

Changing the template solved the problem. A big thanks to @runspired for having time to look into this. It's appreciated.