1
1
import path from 'path'
2
2
import { outdent } from 'outdent'
3
3
import { FileRef , nextTestSetup } from 'e2e-utils'
4
- import {
5
- assertHasRedbox ,
6
- getRedboxDescription ,
7
- getRedboxSource ,
8
- getVersionCheckerText ,
9
- } from 'next-test-utils'
10
4
11
5
describe ( 'Error overlay - RSC runtime errors' , ( ) => {
12
- const { next } = nextTestSetup ( {
6
+ const { isTurbopack , next } = nextTestSetup ( {
13
7
files : new FileRef ( path . join ( __dirname , 'fixtures' , 'rsc-runtime-errors' ) ) ,
14
8
} )
15
9
@@ -27,12 +21,20 @@ describe('Error overlay - RSC runtime errors', () => {
27
21
28
22
const browser = await next . browser ( '/server' )
29
23
30
- await assertHasRedbox ( browser )
31
- const errorDescription = await getRedboxDescription ( browser )
32
-
33
- expect ( errorDescription ) . toContain (
34
- `Error: useState only works in Client Components. Add the "use client" directive at the top of the file to use it. Read more: https://nextjs.org/docs/messages/react-client-hook-in-server-component`
35
- )
24
+ await expect ( browser ) . toDisplayRedbox ( `
25
+ {
26
+ "count": 1,
27
+ "description": "TypeError: useState only works in Client Components. Add the "use client" directive at the top of the file to use it. Read more: https://nextjs.org/docs/messages/react-client-hook-in-server-component",
28
+ "environmentLabel": "Server",
29
+ "label": "Unhandled Runtime Error",
30
+ "source": "app/server/page.js (3:16) @ Page
31
+ > 3 | callClientApi()
32
+ | ^",
33
+ "stack": [
34
+ "Page app/server/page.js (3:16)",
35
+ ],
36
+ }
37
+ ` )
36
38
} )
37
39
38
40
it ( 'should show runtime errors if invalid server API from node_modules is executed' , async ( ) => {
@@ -50,12 +52,38 @@ describe('Error overlay - RSC runtime errors', () => {
50
52
51
53
const browser = await next . browser ( '/client' )
52
54
53
- await assertHasRedbox ( browser )
54
-
55
- const errorDescription = await getRedboxDescription ( browser )
56
- expect ( errorDescription ) . toContain (
57
- 'Error: `cookies` was called outside a request scope. Read more: https://nextjs.org/docs/messages/next-dynamic-api-wrong-context'
58
- )
55
+ // TODO(veil): Inconsistent cursor position
56
+ if ( isTurbopack ) {
57
+ await expect ( browser ) . toDisplayRedbox ( `
58
+ {
59
+ "count": 1,
60
+ "description": "Error: \`cookies\` was called outside a request scope. Read more: https://nextjs.org/docs/messages/next-dynamic-api-wrong-context",
61
+ "environmentLabel": null,
62
+ "label": "Unhandled Runtime Error",
63
+ "source": "app/client/page.js (4:15) @ Page
64
+ > 4 | callServerApi()
65
+ | ^",
66
+ "stack": [
67
+ "Page app/client/page.js (4:15)",
68
+ ],
69
+ }
70
+ ` )
71
+ } else {
72
+ await expect ( browser ) . toDisplayRedbox ( `
73
+ {
74
+ "count": 1,
75
+ "description": "Error: \`cookies\` was called outside a request scope. Read more: https://nextjs.org/docs/messages/next-dynamic-api-wrong-context",
76
+ "environmentLabel": null,
77
+ "label": "Unhandled Runtime Error",
78
+ "source": "app/client/page.js (4:16) @ Page
79
+ > 4 | callServerApi()
80
+ | ^",
81
+ "stack": [
82
+ "Page app/client/page.js (4:16)",
83
+ ],
84
+ }
85
+ ` )
86
+ }
59
87
} )
60
88
61
89
it ( 'should show source code for jsx errors from server component' , async ( ) => {
@@ -68,65 +96,21 @@ describe('Error overlay - RSC runtime errors', () => {
68
96
`
69
97
)
70
98
71
- const browser = await next . browser ( '/server' )
72
- await assertHasRedbox ( browser )
73
-
74
- const errorDescription = await getRedboxDescription ( browser )
75
-
76
- expect ( errorDescription ) . toContain ( `Error: alert is not defined` )
77
- } )
78
-
79
- it ( 'should show the userland code error trace when fetch failed error occurred' , async ( ) => {
80
- await next . patchFile (
81
- 'app/server/page.js' ,
82
- outdent `
83
- export default async function Page() {
84
- await fetch('http://locahost:3000/xxxx')
85
- return 'page'
86
- }
87
- `
88
- )
89
- const browser = await next . browser ( '/server' )
90
- await assertHasRedbox ( browser )
91
-
92
- const source = await getRedboxSource ( browser )
93
- // Can show the original source code
94
- expect ( source ) . toContain ( 'app/server/page.js' )
95
- expect ( source ) . toContain ( `await fetch('http://locahost:3000/xxxx')` )
96
- } )
97
-
98
- it ( 'should contain nextjs version check in error overlay' , async ( ) => {
99
- await next . patchFile (
100
- 'app/server/page.js' ,
101
- outdent `
102
- export default function Page() {
103
- throw new Error('test')
104
- }
105
- `
106
- )
107
- const browser = await next . browser ( '/server' )
108
-
109
- await assertHasRedbox ( browser )
110
- const versionText = await getVersionCheckerText ( browser )
111
- expect ( versionText ) . toMatch ( / N e x t .j s [ \w . - ] + / )
112
- } )
113
-
114
- it ( 'should not show the bundle layer info in the file trace' , async ( ) => {
115
- await next . patchFile (
116
- 'app/server/page.js' ,
117
- outdent `
118
- export default function Page() {
119
- throw new Error('test')
120
- }
121
- `
122
- )
123
99
const browser = await next . browser ( '/server' )
124
100
125
- await assertHasRedbox ( browser )
126
- const source = await getRedboxSource ( browser )
127
- expect ( source ) . toContain ( 'app/server/page.js' )
128
- expect ( source ) . not . toContain ( '//app/server/page.js' )
129
- // Does not contain webpack traces in file path
130
- expect ( source ) . not . toMatch ( / w e b p a c k ( - i n t e r n a l : ) ? \/ \/ / )
101
+ await expect ( browser ) . toDisplayRedbox ( `
102
+ {
103
+ "count": 1,
104
+ "description": "ReferenceError: alert is not defined",
105
+ "environmentLabel": "Server",
106
+ "label": "Unhandled Runtime Error",
107
+ "source": "app/server/page.js (2:16) @ Page
108
+ > 2 | return <div>{alert('warn')}</div>
109
+ | ^",
110
+ "stack": [
111
+ "Page app/server/page.js (2:16)",
112
+ ],
113
+ }
114
+ ` )
131
115
} )
132
116
} )
0 commit comments