调试模拟 httpbackend 请求答案

【问题标题】：Debug mock httpbackend requests调试模拟 httpbackend 请求
【发布时间】：2023-03-14 03:07:01
【问题描述】：

我的情况是有很多模拟的 http 请求。在进行角度上传时，在我的情况下发生了一些可疑的事情。它总是抛出status:200 success 和html complete body response。

以下是我的角度上传代码：

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。

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

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

以下是状态和响应仅供参考。

【问题讨论】：

不清楚是什么问题。它在“扔”什么？确切的错误是什么？什么是文件上传器？请提供stackoverflow.com/help/mcve
问题来自成功而不是错误。无法调用我的模拟请求并对我的代码产生影响。最近添加的屏幕截图的 PFA
再次，所有相关代码都应该发布。 FileUploader 调用 $http.post 并不明显。目前，您是唯一有机会找出问题所在的人。截图没有.../upload/... url。
由于安全问题，我想到了像测试/上传这样的发布。现在改了。请检查
只是不要使用真正的 FileUpload 。这就是单元测试的完成方式。您正在尝试做的是集成/功能测试，考虑到您无法明确地识别问题（这是任何测试的目标），它在这里完全无效。

标签： javascript angularjs unit-testing mocking angular-file-upload

【解决方案1】：

单元测试假设一个单元是独立测试的。任何其他不是测试单元的东西，即控制器应该被模拟，尤其是第三方单元。

考虑到它是用 Jasmine 测试的，FileUpload 服务应该被存根：

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

然后逐行测试控制器，如：

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-]) 上面的代码中，正则表达式部分只匹配由单个字符组成的 id，这是不正确的。这就是为什么在单元测试中硬编码值更可取，人为错误更容易发现和检测。当测试太松散时，不可能明确地识别问题，这会浪费时间。

【讨论】：