Reputation: 17
When running the test, I'm getting an error: Error: No known conditions for "./browser" specifier in "msw" package
. But nor the test neither the component doesn't use MSW.
The test:
import {render} from "@testing-library/react";
import {ProjectsPage} from "@pages/projects";
describe('page-wrapper', () => {
test('renders', () => {
const {} = render(<ProjectsPage/>);
});
});
The component:
import {useEffect, useReducer} from "react";
import {PageWrapper} from "@shared/ui/page-wrapper";
import {useGetProjectsQuery} from "@entities/project";
import {Actions, initialState, projectsPageReducer, setDataSource, Table} from "@pages/projects";
export function ProjectsPage() {
const {data, isLoading} = useGetProjectsQuery();
const [state, dispatch] = useReducer(projectsPageReducer, initialState);
useEffect(() => {
if (data) {
dispatch(setDataSource(data));
}
}, [data]);
return (
<PageWrapper crumbs={[{title: 'Проекты'}]}>
<Actions state={state} dispatch={dispatch} unfilteredData={data}/>
<Table state={state} isLoading={isLoading}/>
</PageWrapper>
)
}
Running the test result in error:
Error: No known conditions for "./browser" specifier in "msw" package
at e (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:45979:25)
at n (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:45979:646)
at o (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:45979:1297)
at resolveExportsOrImports (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:46600:18)
at resolveDeepImport (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:46623:25)
at tryNodeResolve (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:46388:16)
at ResolveIdContext.resolveId (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:46138:19)
at PluginContainer.resolveId (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:48953:17)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async TransformPluginContext.resolve (file:///home/petr/%D0%94%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B/prog/study/front/project-tracker/node_modules/vite/dist/node/chunks/dep-CDnG8rE7.js:49113:15)
MSW setup:
src/app/mocks/browser.ts
import {setupWorker} from "msw/browser";
export const worker = setupWorker();
src/app/mocks/enable-mocking.ts
export async function enableMocking() {
if (process.env.NODE_ENV === 'production') {
return
}
const {worker} = await import('./browser');
return worker.start();
}
src/app/root.tsx
enableMocking().then(() => {
createRoot(document.getElementById("root")!).render(
<Providers>
<Routes/>
</Providers>
);
});
mockServiceWorker.js
is situated in public/mockServiceWorker.js
How can I fix the problem?
Upvotes: 0
Views: 269