React Testing [Jest] проблема - требуется опция домена - PullRequest
0 голосов
/ 26 февраля 2020

Я создал приложение React, которое использует Auth0 в качестве аутентификации. Я пытаюсь реализовать тестовый костюм, используя Jest для тестирования одной из функций в компоненте.

Я хочу протестировать createProject() функцию в React Component Project, просто чтобы увидеть, вызовет ли эта функция любая ошибка после выполнения.

Вот мой тестовый код:

import Project from '../components/Projects/index'
import { shallow } from 'enzyme'

describe('Project testing', () => {
    it('createProject should be working', () => {
        const wrapper = shallow(<Project />);
        const instance = wrapper.instance();
        instance.createProject();
        expect(instance.createProject()).toHaveBeenCalled();
    })
})

После запуска теста я получил сообщение об ошибке следующего снимка: Снимок сообщения об ошибке

Вот мой Auth. js

import auth0 from 'auth0-js'

class Auth {
    constructor() {
        this.auth0 = new auth0.WebAuth({
            // the following three lines MUST be updated
            domain: process.env.REACT_APP_AUTH0_DOMAIN,
            audience: `https://${process.env.REACT_APP_AUTH0_DOMAIN}/userinfo`,
            clientID: process.env.REACT_APP_AUTH0_CLIENT_ID,
            redirectUri: `${process.env.REACT_APP_BASE_URL}/callback`,
            responseType: 'token id_token',
            scope: 'openid email profile',
        })

        this.getProfile = this.getProfile.bind(this)
        this.handleAuthentication = this.handleAuthentication.bind(this)
        this.isAuthenticated = this.isAuthenticated.bind(this)
        this.signIn = this.signIn.bind(this)
        this.signOut = this.signOut.bind(this)
    }

    getProfile() {
        return this.profile
    }

    getIdToken() {
        return this.idToken
    }

    isAuthenticated() {
        return new Date().getTime() < this.expiresAt
    }

    signIn() {
        this.auth0.authorize({}, (err, authResult) => {
            if (err) this.localLogout()
            else {
                this.localLogin(authResult)
                this.accessToken = authResult.accessToken
            }
        })
    }

    handleAuthentication() {
        return new Promise((resolve, reject) => {
            this.auth0.parseHash((err, authResult) => {
                if (err) {
                    alert(err.errorDescription)
                    this.signOut()
                    return reject(err)
                }
                if (!authResult || !authResult.idToken) {
                    return reject(err)
                }
                this.setSession(authResult)
                resolve()
            })
        })
    }

    setSession(authResult) {
        this.idToken = authResult.idToken
        this.profile = authResult.idTokenPayload
        // set the time that the id token will expire at
        this.expiresAt = authResult.idTokenPayload.exp * 1000
    }

    signOut() {
        // clear id token, profile, and expiration
        this.auth0.logout({
            returnTo: process.env.REACT_APP_BASE_URL,
            clientID: process.env.REACT_APP_AUTH0_CLIENT_ID,
        })
    }

    silentAuth() {
        return new Promise((resolve, reject) => {
            this.auth0.checkSession({}, (err, authResult) => {
                if (err) return reject(err)
                this.setSession(authResult)
                resolve()
            })
        })
    }
}

const auth0Client = new Auth()

export default auth0Client

Мой домен Auth0, идентификатор клиента, ..et c все определены в файле .env.

У кого-нибудь есть идеи, как решить эту проблему при тестировании Jest?

Ответы [ 2 ]

0 голосов
/ 28 апреля 2020

У меня была точно такая же проблема. И, как сказал Майкл, это произошло потому, что переменные среды не были определены в наших тестах. Вы можете решить проблему, используя функцию Jest setupFiles. Этот список файлов запускается один раз перед каждым тестом для настройки среды тестирования.

Я следовал ответу Серхана в этом посте ({ ссылка }), потому что я не хотел показывать наш файл .env, но вы также можете определить переменные окружения в самом файле установки (нет необходимости в пакете dotenv npm).

Вы можете просмотреть этот пост для получения дополнительных ответов: test process.env с Jest

0 голосов
/ 26 февраля 2020

Вам нужно определить свои пользовательские process.env свойства, прежде чем начать создавать экземпляры ваших компонентов:

beforeAll(() => {
  process.env = Object.assign(process.env, {
    REACT_APP_AUTH0_DOMAIN: 'foo',
    REACT_APP_AUTH0_CLIENT_ID: 'bar',
    REACT_APP_BASE_URL: 'baz'
  });
});

(Я не уверен, определен ли REACT_APP_BASE_URL или нет из коробки. Попробуйте без и если он все еще ломается, добавьте его.)

...