import React from 'react';
import { describe, it, expect, beforeEach, vi } from 'vitest';
import { render, screen, act } from '../../helpers/render';
import MobileShell from '../../../src/mobile/MobileShell';
import { useAddonStore } from '../../../src/store/addonStore';
import { usePluginStore } from '../../../src/store/pluginStore';
// FE-MOB-MSHELL-001 onwards
beforeEach(() => {
useAddonStore.setState({ addons: [], loaded: true });
usePluginStore.setState({ plugins: [], loaded: true });
});
describe('MobileShell', () => {
it('FE-MOB-MSHELL-001: keeps the legacy wrapper above the phone breakpoint', () => {
const { container } = render(
page body
,
{ initialEntries: ['/dashboard'] },
);
expect(screen.getByText('page body')).toBeInTheDocument();
expect(container.querySelector('.m-root')).toBeNull();
expect(document.getElementById('m-sheet-root')).toBeNull();
});
it('FE-MOB-MSHELL-002: scopes the mobile tokens and mounts the dock plus sheet portal', () => {
const { container } = render(
page body
,
{ initialEntries: ['/dashboard'] },
);
expect(container.querySelector('.m-root')).toBeInTheDocument();
expect(document.getElementById('m-sheet-root')).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'My Trips' })).toBeInTheDocument();
});
it('FE-MOB-MSHELL-003: hides the global dock inside the trip planner', () => {
render(
page body
,
{ initialEntries: ['/trips/7'] },
);
expect(screen.queryByRole('button', { name: 'My Trips' })).not.toBeInTheDocument();
expect(screen.getByText('page body')).toBeInTheDocument();
});
it('FE-MOB-MSHELL-004: the mobile toast presenter takes over the global bridge', () => {
const previous = vi.fn(() => 0);
window.__addToast = previous;
render(page body
, { initialEntries: ['/dashboard'] });
expect(window.__addToast).not.toBe(previous);
act(() => { window.__addToast?.('Saved', 'success'); });
expect(screen.getByText('Saved')).toBeInTheDocument();
delete window.__addToast;
});
});