Skip to content

Commit f94dac6

Browse files
MearmanMearman
committed
fix(web): add StorageProviderWrapper to integration tests
- Wrap test components with StorageProviderWrapper and InMemoryStorageProvider - EntityDetailLayout now uses useGraphList hook which requires storage context - Fixes test failures: topics, institutions, sources, works, keywords - All tests now properly initialize storage with InMemoryStorageProvider
1 parent 090e0d6 commit f94dac6

File tree

5 files changed

+185
-155
lines changed

5 files changed

+185
-155
lines changed

‎apps/web/src/test/component/keywords.component.test.tsx‎

Lines changed: 37 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
import { cachedOpenAlex } from '@bibgraph/client';
2+
import { InMemoryStorageProvider } from '@bibgraph/utils';
23
import { MantineProvider } from '@mantine/core';
34
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
45
import { useParams, useSearch } from '@tanstack/react-router';
56
import { cleanup,render, screen, waitFor } from '@testing-library/react';
7+
import type { ReactNode } from 'react';
68
import { afterEach,beforeEach, describe, expect, it, vi } from 'vitest';
79

10+
import { StorageProviderWrapper } from '@/contexts/storage-provider-context';
11+
812
// Mock cachedOpenAlex client
913
vi.mock('@bibgraph/client', async (importOriginal) => {
1014
const actual = await importOriginal<typeof import('@bibgraph/client')>();
@@ -103,15 +107,19 @@ const mockKeyword = {
103107

104108
describe('Keywords Route - EntityDetailLayout Migration', () => {
105109
let queryClient: QueryClient;
110+
let storage: InMemoryStorageProvider;
106111

107-
beforeEach(() => {
112+
beforeEach(async () => {
108113
queryClient = new QueryClient({
109114
defaultOptions: {
110115
queries: { retry: false, staleTime: Infinity },
111116
mutations: { retry: false },
112117
},
113118
});
114119

120+
storage = new InMemoryStorageProvider();
121+
await storage.initializeSpecialLists();
122+
115123
// Mock useParams
116124
vi.mocked(useParams).mockReturnValue({ keywordId: 'artificial-intelligence' });
117125

@@ -124,6 +132,16 @@ describe('Keywords Route - EntityDetailLayout Migration', () => {
124132
);
125133
});
126134

135+
const TestWrapper = ({ children }: { children: ReactNode }) => (
136+
<QueryClientProvider client={queryClient}>
137+
<StorageProviderWrapper provider={storage}>
138+
<MantineProvider>
139+
{children}
140+
</MantineProvider>
141+
</StorageProviderWrapper>
142+
</QueryClientProvider>
143+
);
144+
127145
afterEach(() => {
128146
cleanup();
129147
queryClient.clear();
@@ -133,11 +151,9 @@ describe('Keywords Route - EntityDetailLayout Migration', () => {
133151
describe('T003: EntityDetailLayout Component', () => {
134152
it('should use EntityDetailLayout component', async () => {
135153
render(
136-
<QueryClientProvider client={queryClient}>
137-
<MantineProvider>
138-
<KeywordRoute />
139-
</MantineProvider>
140-
</QueryClientProvider>
154+
<TestWrapper>
155+
<KeywordRoute />
156+
</TestWrapper>
141157
);
142158

143159
// Wait for data to load
@@ -157,11 +173,9 @@ describe('Keywords Route - EntityDetailLayout Migration', () => {
157173
);
158174

159175
render(
160-
<QueryClientProvider client={queryClient}>
161-
<MantineProvider>
162-
<KeywordRoute />
163-
</MantineProvider>
164-
</QueryClientProvider>
176+
<TestWrapper>
177+
<KeywordRoute />
178+
</TestWrapper>
165179
);
166180

167181
// Expect LoadingState component to be rendered
@@ -176,11 +190,9 @@ describe('Keywords Route - EntityDetailLayout Migration', () => {
176190
);
177191

178192
render(
179-
<QueryClientProvider client={queryClient}>
180-
<MantineProvider>
181-
<KeywordRoute />
182-
</MantineProvider>
183-
</QueryClientProvider>
193+
<TestWrapper>
194+
<KeywordRoute />
195+
</TestWrapper>
184196
);
185197

186198
// Wait for error to be handled
@@ -194,11 +206,9 @@ describe('Keywords Route - EntityDetailLayout Migration', () => {
194206

195207
it('should render RelationshipCounts component', async () => {
196208
render(
197-
<QueryClientProvider client={queryClient}>
198-
<MantineProvider>
199-
<KeywordRoute />
200-
</MantineProvider>
201-
</QueryClientProvider>
209+
<TestWrapper>
210+
<KeywordRoute />
211+
</TestWrapper>
202212
);
203213

204214
await waitFor(() => {
@@ -214,11 +224,9 @@ describe('Keywords Route - EntityDetailLayout Migration', () => {
214224

215225
it('should render IncomingRelationships component', async () => {
216226
render(
217-
<QueryClientProvider client={queryClient}>
218-
<MantineProvider>
219-
<KeywordRoute />
220-
</MantineProvider>
221-
</QueryClientProvider>
227+
<TestWrapper>
228+
<KeywordRoute />
229+
</TestWrapper>
222230
);
223231

224232
await waitFor(() => {
@@ -233,11 +241,9 @@ describe('Keywords Route - EntityDetailLayout Migration', () => {
233241

234242
it('should render OutgoingRelationships component', async () => {
235243
render(
236-
<QueryClientProvider client={queryClient}>
237-
<MantineProvider>
238-
<KeywordRoute />
239-
</MantineProvider>
240-
</QueryClientProvider>
244+
<TestWrapper>
245+
<KeywordRoute />
246+
</TestWrapper>
241247
);
242248

243249
await waitFor(() => {

‎apps/web/src/test/integration/institutions.integration.test.tsx‎

Lines changed: 37 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
import { cachedOpenAlex } from "@bibgraph/client";
2+
import { InMemoryStorageProvider } from "@bibgraph/utils";
23
import { MantineProvider } from "@mantine/core";
34
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
45
import { useParams, useSearch } from "@tanstack/react-router";
56
import { cleanup,fireEvent, render, screen, waitFor } from "@testing-library/react";
7+
import type { ReactNode } from "react";
68
import { afterEach,beforeEach, describe, expect, it, vi } from "vitest";
79

10+
import { StorageProviderWrapper } from "@/contexts/storage-provider-context";
11+
812
// Mock cachedOpenAlex client
913
vi.mock("@bibgraph/client", async (importOriginal) => {
1014
const actual = await importOriginal<typeof import("@bibgraph/client")>();
@@ -48,15 +52,19 @@ const mockInstitutionData = {
4852

4953
describe("InstitutionRoute Integration Tests", () => {
5054
let queryClient: QueryClient;
55+
let storage: InMemoryStorageProvider;
5156

52-
beforeEach(() => {
57+
beforeEach(async () => {
5358
queryClient = new QueryClient({
5459
defaultOptions: {
5560
queries: { retry: false, staleTime: Infinity },
5661
mutations: { retry: false },
5762
},
5863
});
5964

65+
storage = new InMemoryStorageProvider();
66+
await storage.initializeSpecialLists();
67+
6068
// Mock useParams
6169
vi.mocked(useParams).mockReturnValue({ _splat: "I123" });
6270

@@ -69,6 +77,16 @@ describe("InstitutionRoute Integration Tests", () => {
6977
);
7078
});
7179

80+
const TestWrapper = ({ children }: { children: ReactNode }) => (
81+
<QueryClientProvider client={queryClient}>
82+
<StorageProviderWrapper provider={storage}>
83+
<MantineProvider>
84+
{children}
85+
</MantineProvider>
86+
</StorageProviderWrapper>
87+
</QueryClientProvider>
88+
);
89+
7290
afterEach(() => {
7391
cleanup();
7492
queryClient.clear();
@@ -82,11 +100,9 @@ describe("InstitutionRoute Integration Tests", () => {
82100
);
83101

84102
render(
85-
<QueryClientProvider client={queryClient}>
86-
<MantineProvider>
87-
<InstitutionRoute />
88-
</MantineProvider>
89-
</QueryClientProvider>,
103+
<TestWrapper>
104+
<InstitutionRoute />
105+
</TestWrapper>,
90106
);
91107

92108
expect(screen.getByText("Loading Institution...")).toBeInTheDocument();
@@ -100,11 +116,9 @@ describe("InstitutionRoute Integration Tests", () => {
100116
);
101117

102118
render(
103-
<QueryClientProvider client={queryClient}>
104-
<MantineProvider>
105-
<InstitutionRoute />
106-
</MantineProvider>
107-
</QueryClientProvider>,
119+
<TestWrapper>
120+
<InstitutionRoute />
121+
</TestWrapper>,
108122
);
109123

110124
await waitFor(() => {
@@ -117,11 +131,9 @@ describe("InstitutionRoute Integration Tests", () => {
117131

118132
it("renders institution data in rich view by default", async () => {
119133
render(
120-
<QueryClientProvider client={queryClient}>
121-
<MantineProvider>
122-
<InstitutionRoute />
123-
</MantineProvider>
124-
</QueryClientProvider>,
134+
<TestWrapper>
135+
<InstitutionRoute />
136+
</TestWrapper>,
125137
);
126138

127139
await waitFor(() => {
@@ -140,11 +152,9 @@ describe("InstitutionRoute Integration Tests", () => {
140152

141153
it("toggles to raw view and renders JSON", async () => {
142154
render(
143-
<QueryClientProvider client={queryClient}>
144-
<MantineProvider>
145-
<InstitutionRoute />
146-
</MantineProvider>
147-
</QueryClientProvider>,
155+
<TestWrapper>
156+
<InstitutionRoute />
157+
</TestWrapper>,
148158
);
149159

150160
// Wait for data to load
@@ -168,11 +178,9 @@ describe("InstitutionRoute Integration Tests", () => {
168178

169179
it("toggles back to rich view from raw view", async () => {
170180
render(
171-
<QueryClientProvider client={queryClient}>
172-
<MantineProvider>
173-
<InstitutionRoute />
174-
</MantineProvider>
175-
</QueryClientProvider>,
181+
<TestWrapper>
182+
<InstitutionRoute />
183+
</TestWrapper>,
176184
);
177185

178186
// Wait for data to load
@@ -202,11 +210,9 @@ describe("InstitutionRoute Integration Tests", () => {
202210
);
203211

204212
render(
205-
<QueryClientProvider client={queryClient}>
206-
<MantineProvider>
207-
<InstitutionRoute />
208-
</MantineProvider>
209-
</QueryClientProvider>,
213+
<TestWrapper>
214+
<InstitutionRoute />
215+
</TestWrapper>,
210216
);
211217

212218
await waitFor(() => {

0 commit comments

Comments
 (0)