Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add editor links to module import traces (#45257)
Makes it possible to open the files in module import traces in your editor by clicking them. Module not found:  Parse error:  Fixes NEXT-422 ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm build && pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
- Loading branch information
1 parent
0d7f765
commit e3ed2f2
Showing
7 changed files
with
177 additions
and
67 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,148 @@ | ||
| import { check } from 'next-test-utils' | ||
| import { createNextDescribe, FileRef } from 'e2e-utils' | ||
| import path from 'path' | ||
| import { sandbox } from './helpers' | ||
|
|
||
| async function clickEditorLinks(browser: any) { | ||
| await browser.waitForElementByCss('[data-with-open-in-editor-link]') | ||
| const collapsedFrameworkGroups = await browser.elementsByCss( | ||
| '[data-with-open-in-editor-link]' | ||
| ) | ||
| for (const collapsedFrameworkButton of collapsedFrameworkGroups) { | ||
| await collapsedFrameworkButton.click() | ||
| } | ||
| } | ||
|
|
||
| createNextDescribe( | ||
| 'Error overlay - editor links', | ||
| { | ||
| files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')), | ||
| dependencies: { | ||
| react: 'latest', | ||
| 'react-dom': 'latest', | ||
| }, | ||
| skipStart: true, | ||
| }, | ||
| ({ next }) => { | ||
| it('should be possible to open files on RSC build error', async () => { | ||
| let editorRequestsCount = 0 | ||
| const { session, browser, cleanup } = await sandbox( | ||
| next, | ||
| new Map([ | ||
| [ | ||
| 'app/page.js', | ||
| ` | ||
| import Component from '../index' | ||
| export default function Page() { | ||
| return <Component /> | ||
| } | ||
| `, | ||
| ], | ||
| ]), | ||
| undefined, | ||
| { | ||
| beforePageLoad(page) { | ||
| page.route('**/__nextjs_launch-editor**', (route) => { | ||
| editorRequestsCount += 1 | ||
| route.fulfill() | ||
| }) | ||
| }, | ||
| } | ||
| ) | ||
|
|
||
| await session.patch( | ||
| 'index.js', | ||
| `import { useState } from 'react' | ||
| export default () => 'hello world'` | ||
| ) | ||
|
|
||
| expect(await session.hasRedbox(true)).toBe(true) | ||
| await clickEditorLinks(browser) | ||
| await check(() => editorRequestsCount, /2/) | ||
|
|
||
| await cleanup() | ||
| }) | ||
|
|
||
| it('should be possible to open files on RSC parse error', async () => { | ||
| let editorRequestsCount = 0 | ||
| const { session, browser, cleanup } = await sandbox( | ||
| next, | ||
| new Map([ | ||
| [ | ||
| 'app/page.js', | ||
| ` | ||
| import Component from '../index' | ||
| export default function Page() { | ||
| return <Component /> | ||
| } | ||
| `, | ||
| ], | ||
| ['mod1.js', "import './mod2.js'"], | ||
| ['mod2.js', '{{{{{'], | ||
| ]), | ||
| undefined, | ||
| { | ||
| beforePageLoad(page) { | ||
| page.route('**/__nextjs_launch-editor**', (route) => { | ||
| editorRequestsCount += 1 | ||
| route.fulfill() | ||
| }) | ||
| }, | ||
| } | ||
| ) | ||
|
|
||
| await session.patch( | ||
| 'index.js', | ||
| `import './mod1' | ||
| export default () => 'hello world'` | ||
| ) | ||
|
|
||
| expect(await session.hasRedbox(true)).toBe(true) | ||
| await clickEditorLinks(browser) | ||
| await check(() => editorRequestsCount, /4/) | ||
|
|
||
| await cleanup() | ||
| }) | ||
|
|
||
| it('should be possible to open files on module not found error', async () => { | ||
| let editorRequestsCount = 0 | ||
| const { session, browser, cleanup } = await sandbox( | ||
| next, | ||
| new Map([ | ||
| [ | ||
| 'app/page.js', | ||
| ` | ||
| import Component from '../index' | ||
| export default function Page() { | ||
| return <Component /> | ||
| } | ||
| `, | ||
| ], | ||
| ['mod1.js', "import './mod2.js'"], | ||
| ['mod2.js', 'import "boom"'], | ||
| ]), | ||
| undefined, | ||
| { | ||
| beforePageLoad(page) { | ||
| page.route('**/__nextjs_launch-editor**', (route) => { | ||
| editorRequestsCount += 1 | ||
| route.fulfill() | ||
| }) | ||
| }, | ||
| } | ||
| ) | ||
|
|
||
| await session.patch( | ||
| 'index.js', | ||
| `import './mod1' | ||
| export default () => 'hello world'` | ||
| ) | ||
|
|
||
| expect(await session.hasRedbox(true)).toBe(true) | ||
| await clickEditorLinks(browser) | ||
| await check(() => editorRequestsCount, /3/) | ||
|
|
||
| await cleanup() | ||
| }) | ||
| } | ||
| ) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters