Skip to content

Commit 2647f83

Browse files
authored
Merge pull request #8202 from marmelab/fix-reference-field-nothing-to-link
Fix: <ReferenceField> generates a link even though there is nothing to link to
2 parents f77be17 + 1e23d72 commit 2647f83

File tree

3 files changed

+239
-81
lines changed

3 files changed

+239
-81
lines changed

packages/ra-ui-materialui/src/field/ReferenceField.spec.tsx

+190-74
Original file line numberDiff line numberDiff line change
@@ -39,14 +39,22 @@ describe('<ReferenceField />', () => {
3939
render(
4040
<ThemeProvider theme={theme}>
4141
<CoreAdminContext dataProvider={dataProvider}>
42-
<ReferenceField
43-
record={record}
44-
resource="comments"
45-
source="postId"
46-
reference="posts"
42+
<ResourceDefinitionContextProvider
43+
definitions={{
44+
posts: {
45+
hasEdit: true,
46+
},
47+
}}
4748
>
48-
<TextField source="title" />
49-
</ReferenceField>
49+
<ReferenceField
50+
record={record}
51+
resource="comments"
52+
source="postId"
53+
reference="posts"
54+
>
55+
<TextField source="title" />
56+
</ReferenceField>
57+
</ResourceDefinitionContextProvider>
5058
</CoreAdminContext>
5159
</ThemeProvider>
5260
);
@@ -73,14 +81,22 @@ describe('<ReferenceField />', () => {
7381
render(
7482
<ThemeProvider theme={theme}>
7583
<CoreAdminContext dataProvider={dataProvider}>
76-
<ReferenceField
77-
record={record}
78-
resource="comments"
79-
source="postId"
80-
reference="posts"
84+
<ResourceDefinitionContextProvider
85+
definitions={{
86+
posts: {
87+
hasEdit: true,
88+
},
89+
}}
8190
>
82-
<TextField source="title" />
83-
</ReferenceField>
91+
<ReferenceField
92+
record={record}
93+
resource="comments"
94+
source="postId"
95+
reference="posts"
96+
>
97+
<TextField source="title" />
98+
</ReferenceField>
99+
</ResourceDefinitionContextProvider>
84100
</CoreAdminContext>
85101
</ThemeProvider>
86102
);
@@ -132,14 +148,22 @@ describe('<ReferenceField />', () => {
132148
dataProvider={slowDataProvider}
133149
queryClient={queryClient}
134150
>
135-
<ReferenceField
136-
record={record}
137-
resource="comments"
138-
source="postId"
139-
reference="posts"
151+
<ResourceDefinitionContextProvider
152+
definitions={{
153+
posts: {
154+
hasEdit: true,
155+
},
156+
}}
140157
>
141-
<TextField source="title" />
142-
</ReferenceField>
158+
<ReferenceField
159+
record={record}
160+
resource="comments"
161+
source="postId"
162+
reference="posts"
163+
>
164+
<TextField source="title" />
165+
</ReferenceField>
166+
</ResourceDefinitionContextProvider>
143167
</CoreAdminContext>
144168
</ThemeProvider>
145169
);
@@ -157,14 +181,22 @@ describe('<ReferenceField />', () => {
157181
render(
158182
<ThemeProvider theme={theme}>
159183
<CoreAdminContext dataProvider={dataProvider}>
160-
<ReferenceField
161-
record={record}
162-
resource="comments"
163-
source="postId"
164-
reference="posts"
184+
<ResourceDefinitionContextProvider
185+
definitions={{
186+
posts: {
187+
hasEdit: true,
188+
},
189+
}}
165190
>
166-
<TextField source="title" />
167-
</ReferenceField>
191+
<ReferenceField
192+
record={record}
193+
resource="comments"
194+
source="postId"
195+
reference="posts"
196+
>
197+
<TextField source="title" />
198+
</ReferenceField>
199+
</ResourceDefinitionContextProvider>
168200
</CoreAdminContext>
169201
</ThemeProvider>
170202
);
@@ -184,14 +216,22 @@ describe('<ReferenceField />', () => {
184216
render(
185217
<ThemeProvider theme={theme}>
186218
<CoreAdminContext dataProvider={dataProvider}>
187-
<ReferenceField
188-
record={record}
189-
resource="comments"
190-
source="postId"
191-
reference="posts"
219+
<ResourceDefinitionContextProvider
220+
definitions={{
221+
posts: {
222+
hasEdit: true,
223+
},
224+
}}
192225
>
193-
<TextField source="title" />
194-
</ReferenceField>
226+
<ReferenceField
227+
record={record}
228+
resource="comments"
229+
source="postId"
230+
reference="posts"
231+
>
232+
<TextField source="title" />
233+
</ReferenceField>
234+
</ResourceDefinitionContextProvider>
195235
</CoreAdminContext>
196236
</ThemeProvider>
197237
);
@@ -208,14 +248,22 @@ describe('<ReferenceField />', () => {
208248
render(
209249
<ThemeProvider theme={theme}>
210250
<CoreAdminContext dataProvider={dataProvider}>
211-
<ReferenceField
212-
record={record}
213-
resource="comments"
214-
source="postId"
215-
reference="posts"
251+
<ResourceDefinitionContextProvider
252+
definitions={{
253+
posts: {
254+
hasEdit: true,
255+
},
256+
}}
216257
>
217-
<TextField source="title" />
218-
</ReferenceField>
258+
<ReferenceField
259+
record={record}
260+
resource="comments"
261+
source="postId"
262+
reference="posts"
263+
>
264+
<TextField source="title" />
265+
</ReferenceField>
266+
</ResourceDefinitionContextProvider>
219267
</CoreAdminContext>
220268
</ThemeProvider>
221269
);
@@ -258,13 +306,21 @@ describe('<ReferenceField />', () => {
258306
render(
259307
<ThemeProvider theme={theme}>
260308
<CoreAdminContext dataProvider={dataProvider}>
261-
<RecordContextProvider value={record}>
262-
<ReferenceField
263-
resource="comments"
264-
source="postId"
265-
reference="posts"
266-
/>
267-
</RecordContextProvider>
309+
<ResourceDefinitionContextProvider
310+
definitions={{
311+
posts: {
312+
hasEdit: true,
313+
},
314+
}}
315+
>
316+
<RecordContextProvider value={record}>
317+
<ReferenceField
318+
resource="comments"
319+
source="postId"
320+
reference="posts"
321+
/>
322+
</RecordContextProvider>
323+
</ResourceDefinitionContextProvider>
268324
</CoreAdminContext>
269325
</ThemeProvider>
270326
);
@@ -290,6 +346,7 @@ describe('<ReferenceField />', () => {
290346
definitions={{
291347
posts: {
292348
recordRepresentation: 'title',
349+
hasEdit: true,
293350
},
294351
}}
295352
>
@@ -322,15 +379,23 @@ describe('<ReferenceField />', () => {
322379
render(
323380
<ThemeProvider theme={theme}>
324381
<CoreAdminContext dataProvider={dataProvider}>
325-
<RecordContextProvider value={record}>
326-
<ReferenceField
327-
resource="comments"
328-
source="postId"
329-
reference="posts"
330-
>
331-
<TextField source="title" />
332-
</ReferenceField>
333-
</RecordContextProvider>
382+
<ResourceDefinitionContextProvider
383+
definitions={{
384+
posts: {
385+
hasEdit: true,
386+
},
387+
}}
388+
>
389+
<RecordContextProvider value={record}>
390+
<ReferenceField
391+
resource="comments"
392+
source="postId"
393+
reference="posts"
394+
>
395+
<TextField source="title" />
396+
</ReferenceField>
397+
</RecordContextProvider>
398+
</ResourceDefinitionContextProvider>
334399
</CoreAdminContext>
335400
</ThemeProvider>
336401
);
@@ -405,15 +470,23 @@ describe('<ReferenceField />', () => {
405470
render(
406471
<ThemeProvider theme={theme}>
407472
<CoreAdminContext dataProvider={dataProvider}>
408-
<ReferenceField
409-
record={record}
410-
resource="comments"
411-
source="postId"
412-
reference="posts"
413-
link="show"
473+
<ResourceDefinitionContextProvider
474+
definitions={{
475+
posts: {
476+
hasShow: true,
477+
},
478+
}}
414479
>
415-
<TextField source="title" />
416-
</ReferenceField>
480+
<ReferenceField
481+
record={record}
482+
resource="comments"
483+
source="postId"
484+
reference="posts"
485+
link="show"
486+
>
487+
<TextField source="title" />
488+
</ReferenceField>
489+
</ResourceDefinitionContextProvider>
417490
</CoreAdminContext>
418491
</ThemeProvider>
419492
);
@@ -425,6 +498,41 @@ describe('<ReferenceField />', () => {
425498
);
426499
});
427500

501+
it('should render no link when view to link to does not exist', async () => {
502+
const dataProvider = testDataProvider({
503+
getMany: jest.fn().mockResolvedValue({
504+
data: [{ id: 123, title: 'foo' }],
505+
}),
506+
});
507+
render(
508+
<ThemeProvider theme={theme}>
509+
<CoreAdminContext dataProvider={dataProvider}>
510+
<ResourceDefinitionContextProvider
511+
definitions={{
512+
posts: {
513+
hasShow: false,
514+
},
515+
}}
516+
>
517+
<ReferenceField
518+
record={record}
519+
resource="comments"
520+
source="postId"
521+
reference="posts"
522+
link="show"
523+
>
524+
<TextField source="title" />
525+
</ReferenceField>
526+
</ResourceDefinitionContextProvider>
527+
</CoreAdminContext>
528+
</ThemeProvider>
529+
);
530+
await waitFor(() =>
531+
expect(dataProvider.getMany).toHaveBeenCalledTimes(1)
532+
);
533+
expect(screen.queryAllByRole('link')).toHaveLength(0);
534+
});
535+
428536
it('should render no link when link is false', async () => {
429537
const dataProvider = testDataProvider({
430538
getMany: jest.fn().mockResolvedValue({
@@ -434,15 +542,23 @@ describe('<ReferenceField />', () => {
434542
render(
435543
<ThemeProvider theme={theme}>
436544
<CoreAdminContext dataProvider={dataProvider}>
437-
<ReferenceField
438-
record={record}
439-
resource="comments"
440-
source="postId"
441-
reference="posts"
442-
link={false}
545+
<ResourceDefinitionContextProvider
546+
definitions={{
547+
posts: {
548+
hasEdit: true,
549+
},
550+
}}
443551
>
444-
<TextField source="title" />
445-
</ReferenceField>
552+
<ReferenceField
553+
record={record}
554+
resource="comments"
555+
source="postId"
556+
reference="posts"
557+
link={false}
558+
>
559+
<TextField source="title" />
560+
</ReferenceField>
561+
</ResourceDefinitionContextProvider>
446562
</CoreAdminContext>
447563
</ThemeProvider>
448564
);

0 commit comments

Comments
 (0)