代码之家  ›  专栏  ›  技术社区  ›  max Mike Williams

Ember中的测试模型持久性。js验收测试

  •  2
  • max Mike Williams  · 技术社区  · 10 年前

    我正在尝试编写一个验收测试,以验证我的注册表格是否保存了 User 模型到商店。

    我使用Ember 1.13.6、Mocha、Chai和Ember CLI Mirage(为测试伪造后端)。后端是JSONAPI。

    我对烬很陌生,在寻找测试策略方面有点困难。

    我可以使用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();
        });
      });
    });
    
    1 回复  |  直到 10 年前
        1
  •  3
  •   max Mike Williams    10 年前

    您可以使用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)');
    });