javascript - 调试模拟 httpbackend 请求

Question

我遇到的情况是有很多模拟的 http 请求。在进行 Angular 上传时，我的情况发生了一些可疑的事情。它总是抛出 status:200 success 和 html 完整正文响应。

下面是我的 Angular 上传代码:

function fileUploadController(FileUploader) {
    /* jshint validthis: true */
    let vm = this;
    vm.type = this.type;
    vm.clientId = this.client;

    let uploader = new FileUploader({
        url: 'http://localhost:8001/prom-scenario-config/files?clientId=' + vm.clientId,
        data: {type: vm.type}
    });

    vm.uploads = {uploader};
    vm.upload = upload;
    vm.uploads.uploader.queue = [];

    vm.uploads.uploader.onCompleteItem = function (item, response) {
        let type = item.uploader.data.type;
        console.log('response => ', response);
    };
 }

httpbackend 代码的模拟如下所示:

$httpBackend.whenPOST(new RegExp('http://localhost:8001/prom-scenario-config/files\\?clientId=([a-zA-Z0-9-])$$'))
  .respond(function () {
   return [200, 'foo'];
});

但是对此没有影响。

我的正则表达式代码在构建时是否有任何错误？有或没有模拟代码。我收到的回复仍然是 200。

有太多的模拟请求，我很难确定正在调用哪个请求。

是否有任何棘手的方法来识别调用了哪个正则表达式调用？或者强制执行我的模拟请求？

以下是状态和响应的引用仅供引用。

Answer 1

单元测试假设一个单元是单独测试的。任何其他未经过测试的单元(即 Controller )都应该被模拟，尤其是第三方单元。

考虑到它是用 Jasmine 进行测试的，FileUpload 服务应该被 stub :

beforeEach(() => {
  // a spy should be created inside beforeEach to be fresh every time
  module('app', { FileUpload: jasmine.createSpy() });
});

然后逐行测试 Controller ，如下所示:

it('...', inject(($controller, FileUpload) => {

  const ctrl = $controller('fileUploadController');
  ...
  expect(FileUpload).toHaveBeenCalledTimes(1);
  expect(FileUpload).toHaveBeenCalledWith({ url: '...', type: {...} });

  // called with new
  const fileUpload = FileUpload.calls.first().object;
  expect(fileUpload instanceof FileUpload).toBe(true);

  expect(ctrl.fileUpload).toBe(fileUpload);
  expect(fileUpload.onCompleteItem).toEqual(jasmine.any(Function));
  expect(fileUpload.queue).toEqual([]);
  ...
}));

在上面的代码中，clientId=([a-zA-Z0-9-]) regexp 部分仅匹配由单个字符组成的 id，这是不正确的。这就是为什么在单元测试中优于硬编码值的原因，人为错误更容易发现和检测。当测试太松散时，不可能明确地识别问题，这会导致时间的浪费。