如何修复Angular 7上jest的jsdom问题？_Angular_Unit Testing_Jestjs

如何修复Angular 7上jest的jsdom问题？

angular unit-testing jestjs

如何修复Angular 7上jest的jsdom问题？,angular,unit-testing,jestjs,Angular,Unit Testing,Jestjs,当我在我的angular 7上运行test by jest时，我得到了这个错误 console.error node_modules/jest-environment-jsdom-thirteen/node_modules/jsdom/lib/jsdom/virtual-console.js:29 Error: Error: connect ECONNREFUSED 127.0.0.1:80 at Object.dispatchError (D:\Subin\PR

当我在我的angular 7上运行test by jest时，我得到了这个错误

console.error node_modules/jest-environment-jsdom-thirteen/node_modules/jsdom/lib/jsdom/virtual-console.js:29
      Error: Error: connect ECONNREFUSED 127.0.0.1:80
          at Object.dispatchError (D:\Subin\PROJECTS\angular-project\node_modules\jest-environment-jsdom-thirteen\node_modules\jsdom\lib\jsdom\living\xhr-utils.js:60:19)
          at Request.client.on.err (D:\Subin\PROJECTS\angular-project\node_modules\jest-environment-jsdom-thirteen\node_modules\jsdom\lib\jsdom\living\xmlhttprequest.js:674:20)
          at emitOne (events.js:121:20)
          at Request.emit (events.js:211:7)
          at Request.onRequestError (D:\Subin\PROJECTS\angular-project\node_modules\request\request.js:881:8)
          at emitOne (events.js:116:13)
          at ClientRequest.emit (events.js:211:7)
          at Socket.socketErrorListener (_http_client.js:387:9)
          at emitOne (events.js:116:13)
          at Socket.emit (events.js:211:7) undefined

有没有办法解决这个问题

我的笑话

import 'jest-preset-angular';

Object.defineProperty(window, 'CSS', {value: null});
Object.defineProperty(document, 'doctype', {
  value: '<!DOCTYPE html>'
});
Object.defineProperty(window, 'getComputedStyle', {
  value: () => {
    return {
      display: 'none',
      appearance: ['-webkit-appearance']
    };
  }
});
/**
 * ISSUE: https://github.com/angular/material2/issues/7101
 * Workaround for JSDOM missing transform property
 */
Object.defineProperty(document.body.style, 'transform', {
  value: () => {
    return {
      enumerable: true,
      configurable: true,
    };
  },
});

导入“jest预设角度”；
defineProperty（窗口'CSS'，{value:null}）；
Object.defineProperty（文档“doctype”{
值：“”
});
Object.defineProperty（窗口“getComputedStyle”{
值：（）=>{
返回{
显示：“无”，
外观：['-webkit外观']
};
}
});
/**
*问题:https://github.com/angular/material2/issues/7101
*JSDOM缺少转换属性的解决方法
*/
Object.defineProperty（document.body.style，“transform”{
值：（）=>{
返回{
可枚举：正确，
对,，
};
},
});

package.json

"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "jest",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
"jest": {
    "preset": "jest-preset-angular",
    "setupFilesAfterEnv": [
      "<rootDir>/setupJest.ts"
    ],
    "globals": {
      "ts-jest": {
        "diagnostics": false
      }
    }
  },

“脚本”：{
“ng”：“ng”，
“开始”：“ng发球”，
“构建”：“ng构建”，
“测试”：“玩笑”，
“皮棉”：“ng皮棉”，
“e2e”：“ng e2e”
},
“笑话”：{
“预置”：“开玩笑预置角度”，
“SetupFileAfterEnv”：[
“/setupJest.ts”
],
“全球”：{
“开玩笑”：{
“诊断”：错误
}
}
},

我是从一本书上读到的

运行CLI ng test命令时，这不是问题，因为它在运行测试之前编译应用程序

但是，如果在非CLI环境中运行测试，则此组件的测试可能会失败

我认为这是关于我在非CLI环境中运行测试

我所尝试的：

尝试使用@angular builders/jest在ClI环境中运行测试

试图覆盖我的应用程序组件上的外部文件

我的应用程序组件规范

import { TestBed, async, ComponentFixture } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';

describe('AppComponent', () => {
  let component: AppComponent;
  let fixture: ComponentFixture<AppComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ AppComponent ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(AppComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  test('should create the app', async(() => {
    expect(component).toBeTruthy();
  }));
});

从'@angular/core/testing'导入{TestBed，async，ComponentFixture}；
从“@angular/router/testing”导入{RouterTestingModule}；
从“./app.component”导入{AppComponent}；
描述（'AppComponent'，（）=>{
let组件：AppComponent；
let夹具：组件夹具；
beforeach（异步（（）=>{
TestBed.configureTestingModule({
声明：[AppComponent]
})
.compileComponents（）；
}));
在每个之前（（）=>{
fixture=TestBed.createComponent（AppComponent）；
组件=fixture.componentInstance；
fixture.detectChanges（）；
});
测试（'应该创建应用'，异步（（）=>{
expect（component.toBeTruthy（）；
}));
});

如果测试在非CLI环境中运行，为什么需要在非CLI环境中运行测试？我想使用jest在我的应用程序上实现测试，这样语法将只运行jest

jest

而不运行

ng

命令，这样它就不会在CLI环境中运行。我想是的，这让我想到了这个问题。但是。。。为什么？亲爱的兄弟，你希望你能达到什么目的呢？因为玩笑能带来一些好处，比如说更明智、更快；并行测试运行、快照测试、为我提供丰富的CLI选项等等……thx的回答是，我能够解决这个问题，最后只是将它添加到jest.config.js文件

globals:{ts jest'：{tsConfig:'/tsConfig.spec.json'，stringifyContentPathRegex:'\\.html$'，astTransformers:[require.resolve]（'jest-preset-angular/InlineHtmlStripStylesTransformer'）]}，