//users.test.js

beforeEach(() => {
        container = document.createElement("div");
        document.body.appendChild(container);
        mockStore = store
    })

    afterEach(() => {
        unmountComponentAtNode(container);
        container.remove();
        container = null;
    });

    test('Users components rendering testing', () => {
        act(() => {
            render(<Provider store={mockStore}><Users users={mockProps.users}/></Provider>, container)
        })
        console.log(container.innerHTML)
    })

//users.js
// до этого идут функции, константы и работа со стейтом
return ReactDOM.createPortal(
        <div className={props.usersActive ? CH.darkBackground : CH.darkBackgroundHidden}
        >
            <div className={CH.creatorContainer} ref={domNode}>
                {!userOpen && <div className={CH.chatGrid}>
                    <div className={CH.chatsHeader}>
                        <h1>Пользователи для {props.userRole}</h1>
                    </div>
                    <div className={CH.chats}>
                        {users.map(user => <UserElement id={user.user_id} name={user.user_name} mail={user.user_email}
                                                        deleteUser={deleteUser} openUser={openUser}/>)}
                    </div>
                </div>}
                {userOpen && <User closeUser={closeUser} chatId={userOpen} name={currName} mail={currMail} uid={currId}/>}
            </div>


        </div>,
        document.getElementById("portal")
    )
//user.js
// тут мой подход работает, так как возвращается сразу DOM-элемент
return (
        <div className={AT.adminUser}>
            <div className={AT.adminHeader}><h1>Информация пользователя</h1>
                <div>
                    <button className={AT.saveButton} onClick={saveUserData}> Сохранить</button>
                    <button className={AT.deleteTopicButton} onClick={handleCloseUser}> Назад </button>
                </div>
            </div>

            <label className={AT.userLabel}>Имя пользователя</label>
            <input className={AT.inputCreator} value={userName} onChange={e => setUserName(e.target.value)}/>
            <label className={AT.userLabel}>Email пользователя</label>
            <input className={AT.inputCreator} value={userMail} onChange={e => setUserMail(e.target.value)}/>
            <label className={AT.userLabel}>Пароль пользователя</label>
            <input className={AT.inputCreator} value={userPass} type={'password'} onChange={e => setUserPass(e.target.value)}/>
        </div>
    )