Ошибка при шутливом тестировании относительно пакета «response-aad-msal»

Question

Я использую пакетact-aad-msal в компоненте, называемом Authorizer, и когда я запускаю тест, я получаю следующую ошибку:

SyntaxError: Неожиданный токен

import {AzureAD, MsalAuthProviderFactory} из'act-aad-msal ';

тест является базовым, и удаление импорта делает его зеленым.

describe('<Auzthorizer />', () => {
it('should load authorizer without crashing', () => {
    const wrapper = shallow(<Auzthorizer />);
});

});

код для использования пакета «act-aad-msal »:

   <AzureAD
            provider={new MsalAuthProviderFactory({
                clientID: clientId,
                scopes: ['openid'],
                authority: b2cHost,
                type: "Redirect",
                persistLoginPastSession: true
            })}
            unauthenticatedFunction={this.loginCallback}
            authenticatedFunction={this.logoutCallback}
            userInfoCallback={this.printUserInfo} />

Хотя тесты не выполняются даже при удалениикод из компонента, и есть только импорт для "response-aad-msal"

---

Я создал фиктивный компонент только для теста с кодом:

import React, { Component } from 'react';
import {AzureAD, MsalAuthProviderFactory } from 'react-aad-msal';


class Test extends Component {

    render() {
        <div></div>
    }
}

export default Test

и тестовый файл с кодом:

import {shallow} from "enzyme";
import test from "./test";
import React from "react";


describe('<test />', () => {
    it('should load authorizer without crashing', () => {
        const wrapper = shallow(<test />);
    });
});

, и этот тест по-прежнему не выполняется.

Answer 1

С кодом, который у вас есть выше, я не понимаю, как он запускает тест.Вы поверхностно монтируете компонент, но сохраняете его в переменную wrapper, не выполняя никаких тестов.Это пример того, как запустить простой тест.

import React from 'react';
import { shallow } from 'enzyme';
import Test from './test';

describe('Test', () => {
  it('shallow mounts', () => {
    shallow(<Test />);
  });
});

Я имел в виду использование импорта в тестовом файле, если ваш компонент, который вы пытаетесь смонтировать, требует определенной опоры илинеобходимо обернуть конкретным компонентом, а затем импортировать их также в тестовый файл.

Пример необходимости стороннего «момента»

В этом примеревнутри <Test /> есть функция, которая использует moment

import React from 'react';
import { shallow } from 'enzyme';
import Test from './test';
import moment from 'moment';

describe('Test', () => {
  it('mounts without crashing', () => {
    mount(<Test />);
  });
});

Пример необходимого компонента упаковки 'APIProvider'

import React from 'react';
import { shallow } from 'enzyme';
import Test from './test';
import { APIProvider } from './api-context';

describe('Test', () => {
  it('mounts with API Context', () => {
    mount(
      <APIProvider>
          <Test />
      </APIProvider>
    );
  });
});