Error while trying to test React app that uses Mobx

I am trying to write tests on my React app and receiving an error from the context. The error I receive is :Cannot read property 'Provider' of undefined My test looks like that:

 import { render, screen } from "@testing-library/react"
import userEvent from "@testing-library/user-event";
import EmailLoginForm from "../features/users/EmailLoginForm";



test('if no email and no password, button disabled', async () =>{

    render(<EmailLoginForm/>);  

    expect(await screen.findByRole('button', {  name: /login/i})).toBeDisabled();

      userEvent.type(screen.getByPlaceholderText(/email id/i),"test@test.com");
      userEvent.type(screen.getByPlaceholderText(/password/i),"testpw");

      expect(await screen.findByRole('button',{name :/login/i})).toBeEnabled();
})

My main store looks like that:

   import {createContext, useContext} from "react";
//..some imports that are not relevant


interface Store{
    // .. interface of which stores
}

export const store: Store = {
    //.. store declerations
    
}

export const StoreContext = createContext(store);

export function useStore(){
    return useContext(StoreContext);
}

My EmailLoginForm is an observer.

The index.tsx looks like that:

  import React from 'react';
import ReactDOM from 'react-dom';
import '../src/app/layout/App';
import App from '../src/app/layout/App';
import reportWebVitals from './reportWebVitals';
import { createBrowserHistory } from 'history';
import { Router } from 'react-router-dom';
import './app/layout/index.css'
import { store, StoreContext } from "./app/stores/store"
import ScrollToTop from './app/layout/ScrollToTop';

export const history = createBrowserHistory();



ReactDOM.render(
  <StoreContext.Provider value={store}>
    <Router history={history}>
      <ScrollToTop />

          <App />

    </Router>
  </StoreContext.Provider>,
  document.getElementById('root')
);

I am pretty lost here and don't know where is the issue and how to fix it. Any help would be appreciated.