جاوااسکریپت - تست AWS Cognito با Jest شکست میخورد، اما همان کد در یک کامپوننت کار میکند

من سعی می کنم اجزای React خود را به صورت یکپارچه آزمایش کنم. من به یک توکن JWT معتبر نیاز دارم تا بتوانم APIها را فراخوانی کنم و داده ها را برای ارائه جداول برای آزمایش اجزا و تعاملات دریافت کنم. در تئوری، این تقریباً یک میلیون بار سادهcتر از انجام یک تست Jest است که سعی میcکند کل جهان را شبیهcسازی کند، بنابراین من خیلی به شبیهcسازی علاقهcای ندارم. احتمالاً میcتوانم از تست مرورگر استفاده کنم، اما همیشه به نظر میcرسد که نسبتاً ناپایدار هستند، بنابراین ترجیح میcدهم از یک تست Jest یکپارچه استفاده کنم.

مشکل این است که با وجود داشتن همان کد دقیق، وقتی آن را به عنوان یک تست jest اجرا میکنم، خراب میشود، و وقتی آن را در یک کامپوننت react اجرا میکنم، کار میکند. همان مدارک؛ همان کد. من مرتباً دنبال زمینهای هستم که somehow از دست میدهم؛ اما چیزی که برجسته باشد نمیبینم.

من آزمایش زیر را دارم:

    it('calls cognito library', async() => {
        const poolData = {
            UserPoolId: awsconfig.aws_user_pools_id,
            ClientId: awsconfig.aws_user_pools_web_client_id
        };

        const userPool = new CognitoUserPool(poolData);
        const authenticationData = {
            Username: "[email ",
            Password: "mypassword123#",
        };
        const authenticationDetails = new AuthenticationDetails(
            authenticationData
        );
        const userData = {
            Username: "[email ",
            Pool: userPool
        };
        console.log("attempting sign in to ", userData, authenticationData)
        const cognitoUser = new CognitoUser(userData);
        return new Promise<CognitoUserSession>((resolve, reject) => {
            cognitoUser.authenticateUser(authenticationDetails, {
                onSuccess: function (result) {
                    resolve(result)
                },

                newPasswordRequired: () => {
                    reject("NEW PASSWORD REQUIRED");
                },

                onFailure: function (err) {
                    reject(err);
                },
            })
        })
    })

و کامپوننت JSX زیر:

import React, {useEffect} from 'react'
import {useState} from 'react'
import awsconfig from "./conf/aws-exports";
import {AuthenticationDetails, CognitoUser, CognitoUserPool, CognitoUserSession} from "amazon-cognito-identity-js";

export const TestMe = () => {

    const [auth, setAuth] = useState<boolean>(false)

    const poolData = {
        UserPoolId: awsconfig.aws_user_pools_id, 
        ClientId: awsconfig.aws_user_pools_web_client_id
    };

    const userPool = new CognitoUserPool(poolData);
    const authenticationData = {
        Username: "[email ",
        Password: "password123#",
    };
    const authenticationDetails = new AuthenticationDetails(
        authenticationData
    );
    const userData = {
        Username: "[email ",
        Pool: userPool
    };
    const cognitoUser = new CognitoUser(userData);

    useEffect(() => {
        console.log("attempting sign in to ", userData, authenticationData)
        new Promise<CognitoUserSession>((resolve, reject) => {
            cognitoUser.authenticateUser(authenticationDetails, {
                onSuccess: function (result) {
                    resolve(result)
                },

                newPasswordRequired: () => {
                    reject("NEW PASSWORD REQUIRED");
                },

                onFailure: function (err) {
                    reject(err);
                },
            })
        }).then(() => {
            setAuth(true)
        })
    }, [])

    return (
        <div>{auth ? "Yes" : "No"}</div>
    )
}

و فایل index.tsx زیر

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router } from 'react-router-dom';
import 'bootstrap/dist/css/bootstrap.css';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import {TestMe} from "./TestMe";

ReactDOM.render(
    <Router>
        <TestMe />
    </Router>
    , document.getElementById('root'));

serviceWorker.unregister();

من در ابتدا از Amplify استفاده میکردم، اما مشکلات زیادی داشتم، بنابراین آن را کنار گذاشتم و فقط فایل پیکربندی را نگه داشتم. چگونه میتوانم تست Jest را اجرا کنم و احراز هویت انجام دهم؟

پاسخ شماره ۱

من دقیقاً همان مشکل را داشتم و واقعاً اعصابم را خراب کرده بود.

برای رفع آن، شما باید testEnvironment را در پیکربندی jest روی Node تنظیم کنید.

https://jestjs.io/docs/en/configuration#testenvironment-string