Question

我在称为Authorizer的组件中使用react-aad-msal软件包，并且在运行测试时遇到以下错误：

SyntaxError：   意外令牌


从“ react-aad-msal”导入{AzureAD，MsalAuthProviderFactory};

该测试非常基本，删除导入使该测试变为绿色。

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

}）;

使用“ react-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} />

尽管即使我从组件中删除代码，测试也失败了，并且只是“ react-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>
    );
  });
});

关于'react-aad-msal'软件包的笑话测试错误

1 个答案: