Сохранение тестовой модели в приемочном тесте Ember.js

Question

Я пытаюсь написать приемочный тест, который подтверждает, что моя регистрационная форма сохраняет модель 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("https://stackoverflow.com/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(); 
    }); 
    }); 
}); 

Answer 1

Вы можете просто использовать Mirage, чтобы обеспечить запрос XHR отправляется. server - глобальный доступный в ваших тестах, который ссылается на ваш сервер Mirage. Таким образом, вы можете сделать что-то вроде этого:

server.post('/users', function(db, request) { 
    let json = JSON.parse(request.requestBody); 
    expect(json.email).to equal('test@example.com'); 
}); 

или что-то вроде синтаксиса мокко. Удостоверьтесь, что вы добавили expect(1) test to be run в начале, начиная с вашей асинхронной земли.

---

Окончательное решение по ОП:

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)'); 
});