解决 Chai 中无法测试 Promise 的 rejected 状态的方法-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，Promise 是非常常见的一种异步编程方式。然而，在使用 Chai 进行单元测试时，我们可能会遇到无法测试 Promise 的 rejected 状态的问题。这篇文章将介绍如何解决这个问题，包括基本的原理和实现方法，并提供示例代码供读者参考。

问题背景

为了方便理解，我们先来了解一下 Promise 的三种状态：

Pending：初始状态，既不是成功也不是失败状态。
Fulfilled：意味着操作成功完成。
Rejected：意味着操作失败。

在 Chai 中，我们可以使用 .eventually 和 .rejected 这两个关键字来测试 Promise 的状态。例如：

it('should return resolved promise', function() {
  return expect(Promise.resolve('hello world')).to.eventually.equal('hello world');
});

it('should return rejected promise', function() {
  return expect(Promise.reject('error')).to.be.rejectedWith('error');
});

上面的代码中，第一个测试用例使用 .eventually 关键字测试 Promise 的 resolved 状态，而第二个测试用例使用 .rejected 关键字测试 Promise 的 rejected 状态。

然而，在某些情况下，我们可能会发现 .rejected 关键字无法测试 Promise 的 rejected 状态，而直接抛出错误，例如：

it('should return rejected promise', function() {
  return expect(Promise.reject('error')).to.be.rejected;
});

在执行上面的测试用例时，Chai 会抛出一个错误，提示我们无法测试 Promise 的 rejected 状态。

原理分析

要理解为什么无法测试 Promise 的 rejected 状态，我们需要了解一下 .rejected 关键字的实现原理。在 Chai 中，.rejected 关键字实际上是基于 .then 方法和 sinon 封装的，如下所示：

// javascriptcn.com 代码示例
to.be.rejected = function() {
  var chain = chainWithinPromise(this);
  var self = this;
  chain.push(function rejected(actual) {
    var handler = function(err) {     // 错误处理函数，在 Promise 被 rejected 时被调用
      if (!err) {
        actual();
      } else if (err instanceof AssertionError) {
        actual(err);
      } else {
        err.chai = true;
        actual(__webpack_amd_options__.loaders[0].substring(37) + err);
      }
    };

    whenStable(actual, function() {
      // 将 rejected 的处理函数传入 Promise 的 then 方法中
      self.then(function() {
        handler(null);
      }, function promiseRejected(err) {
        // 当 Promise 被 rejected 时，执行错误处理函数
        handler(err);
      });
    });
  });
  return chain;
};

从上面的代码可以看出，.rejected 关键字实际上是在 Promise 的 then 方法中注册了一个错误处理函数。当 Promise 被 rejected 时，该函数会被调用，从而执行测试逻辑。然而，如果在 Promise 对象中没有注册错误处理函数，则 .rejected 关键字无法正常工作。

解决方法

针对上面的问题，我们可以采取两种方法来解决。

方法一：手动注册错误处理函数

一种解决方法是在测试代码中手动注册错误处理函数，例如：

it('should return rejected promise', function() {
  return Promise.reject('error').catch(function() {}).then(function() {
    expect.fail(null, null, 'Expected promise to be rejected');
  }, function() {
    expect(true).to.be.true;
  });
});

上面的代码中，我们手动在 Promise 对象上注册错误处理函数，即 catch 方法，从而解决了 .rejected 关键字无法测试 Promise 的 rejected 状态的问题。如果 Promise 对象被 rejected，则手动注册的错误处理函数会被调用，从而执行测试逻辑。

方法二：使用 chai-as-promised 插件

另一种解决方法是使用 chai-as-promised 插件。chai-as-promised 是一个 Chai 插件，提供了更加丰富的 Promise 测试功能，包括测试 resolved 和 rejected 状态的 Promise，以及测试 Promise 是否被 rejected 并返回指定的错误信息等。下面是使用 chai-as-promised 插件的示例代码：

const chai = require('chai');
const chaiAsPromised = require('chai-as-promised');
chai.use(chaiAsPromised);
const expect = chai.expect;

it('should return rejected promise', function() {
  return expect(Promise.reject('error')).to.be.rejectedWith('error');
});

在上面的代码中，我们使用 expect 关键字来测试 Promise 的状态，并链式调用 .to.be.rejectedWith('error') 来测试 Promise 是否被 rejected 并返回指定的错误信息。chai-as-promised 插件会自动注册错误处理函数，从而无需手动注册。

总结

本文介绍了如何解决 Chai 中无法测试 Promise 的 rejected 状态的问题，包括基本的原理和两种解决方法。手动注册错误处理函数是一种简单而有效的处理方法，而使用 chai-as-promised 插件则更加方便和快捷。在实际的开发过程中，要根据具体情况选择合适的解决方法，以提高测试效率和代码质量。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65385e087d4982a6eb11be05