Тесты Jest отлично работают из CLI, но не работают в IntelliJ

У меня есть старый угловой проект, который я обновляю и перехожу на nx. (NX — это круто.) Я создал новый проект из учебника и постепенно перемещаю свои файлы.

С модульными тестами nx test отлично запускает все модульные тесты в моем проекте, поэтому кажется, что jest настроен правильно, но когда я запускаю внутри IntelliJ, я получаю:

  console.error
    Error: Error: connect ECONNREFUSED 127.0.0.1:80
            at Object.dispatchError (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/xhr-utils.js:54:19)
        at Request.client.on.err (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:675:20)
        at Request.emit (events.js:203:15)

Error: Uncaught (in promise): Failed to load app.component.html

    at resolvePromise (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:832:39)

Я нашел это, но не уверен, что значит размещать параметры шутки в Jest Run. Выполнить тест Jest в IntelliJ IDEA

Я нашел еще кое-что, но ничего особенно полезного. Большинство, похоже, получают эти ошибки после завершения теста.

Похоже, что конфигурация шутки в последнее время сильно изменилась, потому что многие сообщения, которые я нахожу, относятся к устаревшим файлам.

Обновление:

В комментарии предлагалось перейти на NX 10, что я все равно был рад сделать, поэтому я так и сделал. Теперь я получаю точно такую ​​же ошибку от CLI, что и в IntelliJ. ПРОГРЕСС!!!

Итак, я заметил, что все тесты почти не загружали один и тот же html-файл, поэтому я создал тест только для этого компонента, чтобы попытаться изолировать проблему. Вот ошибка, которую я получаю сейчас.

  console.error
    Error: Error: connect ECONNREFUSED 127.0.0.1:80
        at Object.dispatchError (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/xhr-utils.js:54:19)
        at Request.client.on.err (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:675:20)
        at Request.emit (events.js:203:15)
        at Request.onRequestError (/home/thomas/git/heavyweight-software/node_modules/request/request.js:877:8)
        at ClientRequest.emit (events.js:198:13)
        at Socket.socketErrorListener (_http_client.js:401:9)
        at Socket.emit (events.js:198:13)
        at emitErrorNT (internal/streams/destroy.js:91:8)
        at emitErrorAndCloseNT (internal/streams/destroy.js:59:3)
        at process._tickCallback (internal/process/next_tick.js:63:19) undefined

      at VirtualConsole.on.e (../../node_modules/jsdom/lib/jsdom/virtual-console.js:29:45)
      at Object.dispatchError (../../node_modules/jsdom/lib/jsdom/living/xhr-utils.js:57:53)
      at Request.client.on.err (../../node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:675:20)
      at Request.onRequestError (../../node_modules/request/request.js:877:8)


Error: Uncaught (in promise): Failed to load choose-address.component.html

    at resolvePromise (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:832:39)
    at resolvePromise (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:784:21)
    at /home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:894:21
    at ZoneDelegate.Object.<anonymous>.ZoneDelegate.invokeTask (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:421:35)
    at AsyncTestZoneSpec.Object.<anonymous>.AsyncTestZoneSpec.onInvokeTask (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/async-test.js:86:33)
    at ProxyZoneSpec.Object.<anonymous>.ProxyZoneSpec.onInvokeTask (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/proxy.js:145:43)
    at ZoneDelegate.Object.<anonymous>.ZoneDelegate.invokeTask (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:420:40)
    at Zone.Object.<anonymous>.Zone.runTask (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:188:51)
    at drainMicroTaskQueue (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:601:39)
    at ZoneTask.Object.<anonymous>.ZoneTask.invokeTask [as invoke] (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:507:25)
    at invokeTask (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:1671:18)
    at XMLHttpRequest.globalZoneAwareCallback (/home/thomas/git/heavyweight-software/node_modules/zone.js/dist/zone.js:1697:21)
    at innerInvokeEventListeners (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:316:27)
    at invokeEventListeners (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:267:3)
    at XMLHttpRequestEventTargetImpl._dispatch (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:214:9)
    at fireAnEvent (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/helpers/events.js:17:36)
    at requestErrorSteps (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/xhr-utils.js:121:3)
    at Object.dispatchError (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/xhr-utils.js:51:3)
    at Request.client.on.err (/home/thomas/git/heavyweight-software/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:675:20)
    at Request.emit (events.js:203:15)
    at Request.onRequestError (/home/thomas/git/heavyweight-software/node_modules/request/request.js:877:8)
    at ClientRequest.emit (events.js:198:13)
    at Socket.socketErrorListener (_http_client.js:401:9)
    at Socket.emit (events.js:198:13)
    at emitErrorNT (internal/streams/destroy.js:91:8)
    at emitErrorAndCloseNT (internal/streams/destroy.js:59:3)
    at process._tickCallback (internal/process/next_tick.js:63:19)

Вот HTML-файл:

<h2>Address changed by validation.</h2>
<form  [formGroup]="chooseAddressForm">
  <mat-radio-group
      aria-label="Please choose your correct address."
      *ngFor="let address of data.contactPoints; let ix = index"
      name="selectAddress"
      formControlName="selectAddress">
    <mat-radio-button value="{{ix}}">
      {{address.street1}}<br/>
      {{address.city}}, {{address.state}} {{address.postalCode}}<br/>
    </mat-radio-button>
  </mat-radio-group>
</form>

<p><span class="error">{{errorText}}</span></p>

<div class="buttonBar">
  <button mat-raised-button (click)="onButtonClick(true)">Select</button>
  <button mat-raised-button (click)="onButtonClick(false)">Cancel</button>
</div>

И модульный тест:

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

  const chooseAddressData: ChooseAddressDialogData = new ChooseAddressDialogData();
  const matDialogData = {};
  let mockMatDialogRef: MockMatDialogRef;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        ChooseAddressComponent,
      ],
      imports: [
        BrowserAnimationsModule,
        MatButtonModule,
        MatDialogModule,
        MatFormFieldModule,
        MatIconModule,
        MatRadioModule,
      ],
      providers: [
        {provide: ChooseAddressDialogData, useValue: chooseAddressData},
        {provide: MAT_DIALOG_DATA, useValue: matDialogData},
        {provide: MatDialogRef, useClass: MockMatDialogRef},
      ]
    })
      .compileComponents();
  }));

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

    mockMatDialogRef = TestBed.inject(MatDialogRef);
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

И мой компонент:

@Component({
  selector: 'heavyweight-software-app-choose-address',
  templateUrl: './choose-address.component.html',
  styleUrls: ['./choose-address.component.css']
})
export class ChooseAddressComponent implements OnInit {
  chooseAddressForm: FormGroup;
  errorText = '';

  constructor(protected dialogRef: MatDialogRef<ChooseAddressComponent>,
              @Inject(MAT_DIALOG_DATA) public data: ChooseAddressDialogData) { }

  get selectAddress(): AbstractControl { return this.chooseAddressForm.get('selectAddress'); }

  ngOnInit(): void {
    this.createForm();
  }

  private createForm() {
    this.chooseAddressForm = new FormGroup({
      selectAddress: new FormControl(null,
        [ Validators.required])
    } );

    this.selectAddress.patchValue(0);
  }

  onButtonClick(confirmed: boolean): void {
    this.errorText = '';

    if (confirmed) {
      const idx: number = this.selectAddress.value;
      if (idx) {
        this.data.selectedIndex = idx;
        this.dialogRef.close();
      } else {
        this.errorText = 'You must select your address from the list';
      }
    } else {
      this.data.selectedIndex = null;
      this.dialogRef.close();
    }
  }
}

Пожалуйста, поделитесь любыми идеями.


person Thom    schedule 04.07.2020    source источник
comment
Чтобы запускать тесты так же, как nx test IDE, необходимо настроить ту же конфигурацию и параметры Jest, последние показаны в вопросе, который вы связали. Если вы не уверены, не указывайте никаких параметров. Ошибка появляется вне тестов и не приводит к их провалу, очень вероятно, что это происходит и в nx test, но вы этого не заметили. Ошибка означает, что приложение выполняет реальные запросы, что не рекомендуется в тестах.   -  person Estus Flask    schedule 04.07.2020
comment
О, я не подумал о конфигурации запуска. Я установил конфигурацию запуска, параметры Jest на --env=jsdom и перезапустил. Никаких изменений в ошибке.   -  person Thom    schedule 04.07.2020
comment
Проблема, вероятно, связана с github.com/thymikee/jest-preset-angular/ issue/217 и github.com/nrwl/nx/issues/1059 . Проверьте предлагаемые решения. Если вы не используете последнюю версию Jest, вы можете начать с ее обновления.   -  person Estus Flask    schedule 05.07.2020
comment
@EstusFlask это пример гораздо более старой публикации (2018 г.), в которой я обнаружил, что информация о конфигурации очень устарела. Я прошел через ряд из них, прежде чем, наконец, опубликовать здесь.   -  person Thom    schedule 06.07.2020
comment
@Thom, не мог бы ты попробовать с Nx 10? Мы только что выпустили его на прошлой неделе, и он должен иметь полную поддержку запуска тестов Jest в Webstorm.   -  person Juri    schedule 22.07.2020
comment
@Юри Спасибо. Я обновился, но тесты все равно не запускаются.   -  person Thom    schedule 23.07.2020
comment
@Juri Теперь я не могу запускать тесты из CLI после обновления. Это не очень хорошо ... Я попытаюсь переформатировать этот вопрос.   -  person Thom    schedule 25.07.2020


Ответы (1)


Когда я запустил обновление с https://nx.dev/angular/workspace/update, я кажется пропустил команду

nx migrate --run-migrations=migrations.json

поэтому я работал с неполным обновлением. Выполнение этой команды, похоже, устранило проблему с тестом nx, и теперь nx 10 также правильно тестируется с IntelliJ.

Жизнь хороша! Спасибо за помощь.

person Thom    schedule 26.07.2020