Notistack works on browser but not on cypress

Question

I am using notistack with mobx,so whenever the state changes ,the toast will be shown using the enqueuesnackbar fucntion.

After upgrading mobx to version 6 it is not working on cypress.

It seems there is no issue with the mobx since other console logs and others work.Except this enqueue function.

But it is working fine on my browser(chrome)

Error:No console errors.

code:

const Toasts = ({ store }) => {
    const { enqueueSnackbar, closeSnackbar } = useSnackbar();
    const classes = useStyles();

    useEffect(() => {
        autorun(() => {
            [...store.events, ...store.volatileGrowls].forEach(event => {
                const key = event.button ? event.id : event.title + event.message;
                if (event.shouldGrowl && !event.hasGrowled) {
                    try {
                        enqueueSnackbar(
                            <div data-test-id="toast-container">
                                <StriimTypography
                                    variant={"h4"}
                                    className={classnames(classes.toastTitle, classes.toastTextDefault)}
                                    data-test-id={"toast-title"}
                                    dangerouslySetInnerHTML={{ __html: xss(event.title) }}
                                />
                                {event.message && (
                                    <div style={{ display: "flex", alignItems: "baseline" }}>
                                        <StriimTypography
                                            variant={"subtitle2"}
                                            className={classnames(classes.toastDescription, classes.toastTextDefault)}
                                            data-test-id={"toast-description"}
                                            dangerouslySetInnerHTML={{ __html: xss(event.message) }}
                                        />
                                        {event.button &&
                                            cloneElement(event.button, {
                                                onClick: () => {
                                                    event.button.props.onClick();
                                                    closeSnackbar(key);
                                                }
                                            })}
                                    </div>
                                )}
                            </div>,
                            {
                                variant: event.severity,
                                key: key,
                                preventDuplicate: false
                            }
                        );
                    } catch (error) {
                        console.log("error:",error)
                    }
                    event.hasGrowled = true;
                    store.persistEvents();
                }
            });
        });
    }, []);
    return <React.Fragment></React.Fragment>;
};

React version: 18 with StrictMode

notistack: 1.0.10

mobx:6