在茉莉花2中处理异步测试的更好方法

A better way to handle async tests in jasmine 2

本文关键字：测试 更好 方法 异步 处理 茉莉花      更新时间：2023-09-26

这是我的三个测试中的一个例子…

  describe('Enabled button (no disabled attribute)', function () {
    var el, clicked = false;
    beforeEach(function (done) {
      // Create the tag
      el = document.createElement('rui-button')
      el.innerHTML = 'Test Button';
      document.body.appendChild(el)
      el.addEventListener('click', function () {
        clicked = true;
        done();
      });
      // Mount the tag
      tag = riot.mount('rui-button')[0]
      expect(tag).toBeDefined();
      expect(tag.isMounted).toBe(true);
      tag.update();
      el.childNodes[0].click();
    });
    it('should be disabled', function () {
      expect(el.getAttribute('data-disabled')).toEqual('false');
      expect(clicked).toEqual(true);
      var style = window.getComputedStyle(el.childNodes[0]);
      expect(style.cursor).toEqual('pointer');
      expect(style.opacity).toEqual('1')
    });
  });
  describe('Enabled button (disabled="{ false }")', function () {
    var el, clicked = false;
    beforeEach(function (done) {
      // Create the tag
      el = document.createElement('rui-button')
      el.innerHTML = 'Test Button';
      el.setAttribute('disabled', '{ false }');
      document.body.appendChild(el)
      el.addEventListener('click', function () {
        clicked = true;
        done();
      });
      // Mount the tag
      tag = riot.mount('rui-button')[0]
      expect(tag).toBeDefined();
      expect(tag.isMounted).toBe(true);
      tag.update();
      el.childNodes[0].click();
    });
    it('should be disabled', function () {
      expect(el.getAttribute('data-disabled')).toEqual('false');
      expect(clicked).toEqual(true);
      var style = window.getComputedStyle(el.childNodes[0]);
      expect(style.cursor).toEqual('pointer');
      expect(style.opacity).toEqual('1')
    });
  });
  describe('Disabled button (disabled)', function () {
    var el, clicked = false;
    beforeEach(function (done) {
      // Create the tag
      el = document.createElement('rui-button')
      el.innerHTML = 'Test Button';
      el.setAttribute('disabled', '');
      document.body.appendChild(el)
      el.addEventListener('click', function () {
        clicked = true;
        done();
      });
      // Mount the tag
      tag = riot.mount('rui-button')[0]
      expect(tag).toBeDefined();
      expect(tag.isMounted).toBe(true);
      tag.update();
      el.childNodes[0].click();
    });
    it('should be disabled', function () {
      expect(el.getAttribute('data-disabled')).toEqual('true');
      expect(clicked).toEqual(false);
      var style = window.getComputedStyle(el.childNodes[0]);
      expect(style.cursor).toEqual('not-allowed');
      expect(style.opacity).not.toEqual('1')
    });
  });

您可以看到，每个测试都由describe, beforeEach和it组成。当测试失败时，我得到一些无用的超时错误。

下面是测试工作时我得到的结果:

Enabled button (no disabled attribute)
  ✓ should be enabled
Enabled button (disabled="{ false }")
  ✓ should be enabled
Disabled button (disabled)
  ✗ should be disabled
Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.

无论如何都失败了，测试通过了，但是超时导致了失败。我在测试click事件是否没有发生。它有6行，每个测试两行。我真的更喜欢这样:

✓ Enabled button (no disabled attribute)
✓ Enabled button (disabled="{ false }")
✓ Disabled button (disabled)

我需要有负测试工作，测试缺乏点击。

当测试确实失败时，我得到这个，相同的超时crud以及有效的失败原因。

  ✗ should be enabled
Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
Expected false to equal true.
    at Object.<anonymous> (ui-button.spec.js:89:23)

是否有一些方法来测试缺少事件?有没有其他更好的方式，我可以写我的规格文件?我在这里只列出了3个测试，但我有更多。

您有两个选择。

  1. 更简单的是添加负测试来描述没有beforeEach的地方，在那里单击处理程序执行done()回调。你显然不能点击禁用的HTML元素。

2。例如，像这样更改beforeEach(关键是在beforeEach的某个点执行done()回调):

beforeEach(function (done) {
  // Create the tag
  el = document.createElement('rui-button')
  el.innerHTML = 'Test Button';
  el.setAttribute('disabled', '');
  document.body.appendChild(el)
  el.addEventListener('click', function () {
    clicked = true;
    done();
  });
  // Mount the tag
  tag = riot.mount('rui-button')[0]
  expect(tag).toBeDefined();
  expect(tag.isMounted).toBe(true);
  tag.update();
  if (el.getAttribute('data-disabled')) {
    done();
  } else {
    el.childNodes[0].click();      
  }
});
相关文章：