Ember.js 验收测试中的测试模型持久性
Test model persistence in Ember.js acceptance test
我正在尝试编写一个验收测试来验证我的注册表单是否将 User
模型保存到商店。
我正在使用 Ember 1.13.6、Mocha、Chai 和 Ember CLI Mirage(为测试伪造后端。)后端是 JSONAPI。
我是 ember 的新手,在寻找测试策略时遇到了一些困难。
我可以使用 Sinon.js 并监视模型并检查是否调用了 .save
方法,或者我应该测试是否发送了正确的 XHR 请求 (POST /api/vi/users
)?
// app/routes/users/new.js
import Ember from 'ember';
export default Ember.Route.extend({
model: function(){
return this.store.createRecord('user');
},
actions: {
registerUser: function(){
var user = this.model();
user.save().then(()=> {
this.transitionTo('/');
}).catch(()=> {
console.log('user save failed.');
});
}
}
});
<!-- app/templates/users/new.hbs -->
<form {{ action "registerUser" on="submit" }}>
<div class="row email">
<label>Email</label>
{{ input type="email" name="email" value=email }}
</div>
<div class="row password">
<label>Password</label>
{{ input type="password" name="password" value=password }}
</div>
<div class="row password_confirmation">
<label>Password Confirmation</label>
{{ input type="password" name="password_confirmation" value=password_confirmation }}
</div>
<button type="submit">Register</button>
</form>
/* jshint expr:true */
import {
describe,
it,
beforeEach,
afterEach
} from "mocha";
import { expect } from "chai";
import Ember from "ember";
import startApp from "tagged/tests/helpers/start-app";
describe("Acceptance: UsersNew", function() {
var application;
function find_input(name){
return find(`input[name="${name}"]`);
}
beforeEach(function() {
application = startApp();
visit("/users/new");
});
afterEach(function() {
Ember.run(application, "destroy");
});
describe("form submission", function(){
const submit = function(){
click('button:contains(Register)');
};
beforeEach(function(){
fillIn('input[name="email"]', 'test@example.com');
fillIn('input[name="password"]', 'p4ssword');
fillIn('input[name="password_confirmation"]', 'p4ssword');
});
it("redirects to root path", function(){
submit();
andThen(function() {
expect(currentURL()).to.eq('/'); // pass
});
});
it("persists the user record", function(){
// this is the part I am struggling with
// expect user.save() to be called.
submit();
});
});
});
您可以只使用 Mirage 来确保发送 xhr 请求。 server
是在您的测试中可用的全局变量,它引用了您的 Mirage 服务器。所以你可以这样做:
server.post('/users', function(db, request) {
let json = JSON.parse(request.requestBody);
expect(json.email).to equal('test@example.com');
});
或者任何 mocha 语法。确保在开头添加一个 expect(1) test to be run
,因为您现在处于异步状态。
OP 的最终解决方案:
it('saves the user', function(){
server.post('/users', function(db, request) {
var json = JSON.parse(request.requestBody);
var attrs = json['data']['attributes'];
expect(attrs['email']).to.eq("test@example.com");
expect(attrs['password']).to.eq("p4ssword");
expect(attrs['password_confirmation']).to.eq("p4ssword");
});
click('button:contains(Register)');
});
我正在尝试编写一个验收测试来验证我的注册表单是否将 User
模型保存到商店。
我正在使用 Ember 1.13.6、Mocha、Chai 和 Ember CLI Mirage(为测试伪造后端。)后端是 JSONAPI。
我是 ember 的新手,在寻找测试策略时遇到了一些困难。
我可以使用 Sinon.js 并监视模型并检查是否调用了 .save
方法,或者我应该测试是否发送了正确的 XHR 请求 (POST /api/vi/users
)?
// app/routes/users/new.js
import Ember from 'ember';
export default Ember.Route.extend({
model: function(){
return this.store.createRecord('user');
},
actions: {
registerUser: function(){
var user = this.model();
user.save().then(()=> {
this.transitionTo('/');
}).catch(()=> {
console.log('user save failed.');
});
}
}
});
<!-- app/templates/users/new.hbs -->
<form {{ action "registerUser" on="submit" }}>
<div class="row email">
<label>Email</label>
{{ input type="email" name="email" value=email }}
</div>
<div class="row password">
<label>Password</label>
{{ input type="password" name="password" value=password }}
</div>
<div class="row password_confirmation">
<label>Password Confirmation</label>
{{ input type="password" name="password_confirmation" value=password_confirmation }}
</div>
<button type="submit">Register</button>
</form>
/* jshint expr:true */
import {
describe,
it,
beforeEach,
afterEach
} from "mocha";
import { expect } from "chai";
import Ember from "ember";
import startApp from "tagged/tests/helpers/start-app";
describe("Acceptance: UsersNew", function() {
var application;
function find_input(name){
return find(`input[name="${name}"]`);
}
beforeEach(function() {
application = startApp();
visit("/users/new");
});
afterEach(function() {
Ember.run(application, "destroy");
});
describe("form submission", function(){
const submit = function(){
click('button:contains(Register)');
};
beforeEach(function(){
fillIn('input[name="email"]', 'test@example.com');
fillIn('input[name="password"]', 'p4ssword');
fillIn('input[name="password_confirmation"]', 'p4ssword');
});
it("redirects to root path", function(){
submit();
andThen(function() {
expect(currentURL()).to.eq('/'); // pass
});
});
it("persists the user record", function(){
// this is the part I am struggling with
// expect user.save() to be called.
submit();
});
});
});
您可以只使用 Mirage 来确保发送 xhr 请求。 server
是在您的测试中可用的全局变量,它引用了您的 Mirage 服务器。所以你可以这样做:
server.post('/users', function(db, request) {
let json = JSON.parse(request.requestBody);
expect(json.email).to equal('test@example.com');
});
或者任何 mocha 语法。确保在开头添加一个 expect(1) test to be run
,因为您现在处于异步状态。
OP 的最终解决方案:
it('saves the user', function(){
server.post('/users', function(db, request) {
var json = JSON.parse(request.requestBody);
var attrs = json['data']['attributes'];
expect(attrs['email']).to.eq("test@example.com");
expect(attrs['password']).to.eq("p4ssword");
expect(attrs['password_confirmation']).to.eq("p4ssword");
});
click('button:contains(Register)');
});