Question

我正在为我的vue应用程序编写单元测试，因为在beforeCreate方法中调用了session.exists函数，所以我遇到了问题。那我怎么能模拟生命周期函数或vue。$ session.exists。我试图用sinon嘲笑它，但我没有设法完成它？

代码：

beforeCreate: function() {
  if (!this.$session.exists()) {
    this.$router.push('/')
  }
}

错误信息是：

TypeError：＆＃34;无法读取属性＆＃39;存在＆＃39;未定义＆＃34;

Answer 1

您可以在operator=()：

时模拟$session

mount()

演示如下。

＆＃13;

const $session = { exists() { return true; } };
const component = mount(MyComponent, {
  mocks: {
    $session
  }
});

＆＃13;

var MyComponent = Vue.component('MyComponent', {
  template: '<div> Hello </div>',
  beforeCreate() { console.log('this.$session.exists() -->', this.$session.exists()); },
});

// specs code ///////////////////////////////////////////////////////////
var mount = vueTestUtils.mount;
describe('MyComponent', () => {
  it("mocks $session successfully", () => {
    const $session = { exists() { return true; } }
    const parent = mount(MyComponent, {
      mocks: {
        $session
      }
    });

    expect(parent.vm.$session).not.toBe(undefined);
  });
});

// load jasmine htmlReporter
(function() {
  var env = jasmine.getEnv()
  env.addReporter(new jasmine.HtmlReporter())
  env.execute()
}())

＆＃13;

模拟Vue生命周期方法

1 个答案: