javascript - Ember destroyRecord(或 deleteRecord 然后保存)使用 ember-cli-mirage 失败

Question

我想做的是将 ember-cli-mirage 集成到这个待办事项应用程序中，https://github.com/ember-cli/ember-cli-todos .此应用程序使用 Ember 2.0 或更高版本。设置:

1. 克隆 todo 应用程序，然后 cd 进入应用程序目录。
2. 外壳> npm 安装
3. shell> bower 安装
4. 外壳> Ember 服务

我已验证该应用程序是否按照宣传的方式运行(除了与此处无关的一件小事)。我可以创建、更新和删除待办事项。 todo 应用程序使用 ember-data-fixture-adapter/FIXTURES 为应用程序播种数据。

我集成ember-cli-mirage的步骤是:

1. 注释掉 app/models/todo.js 中的 Todo.reopenClass block (创建 FIXTURES/种子数据的代码)。
2. 删除了 app/adapters 目录(其中仅包含一个文件 application.js(其中仅包含一行“export { default } from 'ember-data-fixture-adapter';”))。我相当确定整个目录只对 FIXTURES 设置有用。
3. shell> ember 安装 ember-cli-mirage
4. 按照此处的说明设置 ember-cli-mirage 部分 (app/mirage/{config.js,factories/post.js,scenarios/default.js}) http://www.ember-cli-mirage.com/docs/v0.1.x/working-with-json-api/ .

如果有人需要查看，我会发布 app/mirage/{config.js,factories/post.js,scenarios/default.js} 的代码，但它基本上只是 ember- cli-mirage 页面(“user”模型名称替换为“post”)。

我重新启动了 ember 服务器。除了删除待办事项外，一切正常。记录删除是通过按下“x”按钮完成的，当您将指针移动到待办事项的右侧时，该按钮将出现。我发现它在记录删除的 save() 部分失败了。删除记录的代码(使用“x”按钮界面)位于 app/components/todo-item/component.js 中，它看起来像这样:

removeTodo() {
  var todo = this.get('todo');

  todo.deleteRecord();
  todo.save();
}

当我尝试删除待办事项时，浏览器控制台打印“请求成功:DELETE/todos/n”(“n”是待办事项 ID)，然后它会打印一条神秘的错误消息以及堆栈跟踪。

我注释掉了“todo.save();”上面的线。当我删除一个待办事项时，删除仍然失败，但在控制台上，“成功请求:DELETE/todos/n”消息后不再有错误消息。

所以我更改了上面的 removeTodo 代码，试图使错误消息更清楚。我把它改成了这样:

todo.save().then(function() {
    console.log('Save OK.');
  }).catch((err) => {
    console.log('Save failed.');
    console.log(err.message);
});

我在这里和那里尝试了各种更改，但始终出现的错误消息是:

Assertion Failed: An adapter cannot assign a new id to a record that already has an id. had id: 3 and you tried to update it with undefined. This likely happened because your server returned data in response to a find or update that had a different id than the one you sent.

我看到一条错误消息，上面有类似“normalizeserializer...”的文本，但我忘记复制整个消息。

我添加了一个适配器:

shell> ember g adapter application

// app/adapters/application.js
import DS from 'ember-data';

export default DS.JSONAPIAdapter.extend({
});

但这并没有解决问题。

顺便说一句，todo 项目的创建，也调用了 todo 项目的保存，是有效的。代码位于 app/components/todos-route/component.js 中:

createTodo() {
  const store = this.get('store');

  // Get the todo title set by the "New Todo" text field
  var title = this.get('newTitle');

  if (title && !title.trim()) {
    this.set('newTitle', '');
    return;
  }

  // Create the new Todo model
  var todo = store.createRecord('todo', {
    title: title
  });

  // Clear the "New Todo" text field
  this.set('newTitle', '');

  // Save the new model
  todo.save();
}

Answer 1

DELETE 到 /todos/:id 的 Mirage 模拟是什么样的？看起来您正在使用包含 id 的 JSON 负载响应 DELETE 请求，这会导致问题。

相反，您可以尝试返回空响应主体的内容，例如

this.del('/todos/:id', (db, request) => {
  let id = request.params.id;
  db.todos.remove(id);

  return new Mirage.Response(204, {}, {});
});

(此代码未经测试，但希望您能理解)。

另一个小问题，模型上有一个 destroyRecord 方法，它基本上同时执行 deleteRecord 和 save。