next.js icon indicating copy to clipboard operation
next.js copied to clipboard

ignoreList source map support for generated code

Open wbinnssmith opened this issue 1 year ago • 4 comments

This is a very rudimentary, inelegant solution for adding Turbopack-generated code to the sourcemap ignoreList.

  • It hardcodes turbopack://[turbopack] and turbopack://[next] uri prefixes into turbo pack core
  • It depends on my fork of the sourcemap crate to implement ignoreLists

Both of these should be fixed, but we want Dynamic IO to be usable soon.

wbinnssmith avatar Oct 23 '24 23:10 wbinnssmith

Failing test suites

Commit: fa4afbf270f4f6102cd16715d54fba491363302b

pnpm test-dev-turbo test/development/app-dir/owner-stack/owner-stack.test.ts (turbopack)

  • app-dir - owner-stack > should log stitched error for browser uncaught errors
  • app-dir - owner-stack > should log stitched error for browser caught errors
  • app-dir - owner-stack > should log stitched error for SSR errors
Expand output

● app-dir - owner-stack › should log stitched error for browser uncaught errors

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack should log stitched error for browser uncaught errors 1`

- Snapshot  - 2
+ Received  + 2

- at useErrorHook (app/browser/uncaught/page.js (10:3))
+ at useErrorHook (app/browser/uncaught/page.js (0:0))
- at Page (app/browser/uncaught/page.js (14:3))
+ at Page (app/browser/uncaught/page.js (0:0))

  57 |     const stackFramesContent = await getStackFramesContent(browser)
  58 |     if (process.env.TURBOPACK) {
> 59 |       expect(stackFramesContent).toMatchInlineSnapshot(`
     |                                  ^
  60 |         "at useErrorHook (app/browser/uncaught/page.js (10:3))
  61 |         at Page (app/browser/uncaught/page.js (14:3))"
  62 |       `)

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack/owner-stack.test.ts:59:34)

● app-dir - owner-stack › should log stitched error for browser caught errors

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack should log stitched error for browser caught errors 1`

- Snapshot  - 4
+ Received  + 4

- at useErrorHook (app/browser/caught/page.js (39:3))
+ at useErrorHook (app/browser/caught/page.js (0:0))
- at Thrower (app/browser/caught/page.js (29:3))
+ at Thrower (app/browser/caught/page.js (0:0))
- at Inner (app/browser/caught/page.js (23:7))
+ at Inner (app/browser/caught/page.js (0:0))
- at Page (app/browser/caught/page.js (43:10))
+ at Page (app/browser/caught/page.js (0:0))

  129 |
  130 |     if (process.env.TURBOPACK) {
> 131 |       expect(stackFramesContent).toMatchInlineSnapshot(`
      |                                  ^
  132 |         "at useErrorHook (app/browser/caught/page.js (39:3))
  133 |         at Thrower (app/browser/caught/page.js (29:3))
  134 |         at Inner (app/browser/caught/page.js (23:7))

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack/owner-stack.test.ts:131:34)

● app-dir - owner-stack › should log stitched error for SSR errors

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack should log stitched error for SSR errors 1`

- Snapshot  - 2
+ Received  + 2

- at useErrorHook (app/ssr/page.js (8:3))
+ at useErrorHook (app/ssr/page.js (0:0))
- at Page (app/ssr/page.js (12:3))
+ at Page (app/ssr/page.js (0:0))

  171 |     const stackFramesContent = await getStackFramesContent(browser)
  172 |     if (process.env.TURBOPACK) {
> 173 |       expect(stackFramesContent).toMatchInlineSnapshot(`
      |                                  ^
  174 |         "at useErrorHook (app/ssr/page.js (8:3))
  175 |         at Page (app/ssr/page.js (12:3))"
  176 |       `)

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack/owner-stack.test.ts:173:34)

Read more about building and testing Next.js in contributing.md.

ijjk avatar Oct 24 '24 00:10 ijjk

Tests Passed

ijjk avatar Oct 24 '24 00:10 ijjk

Stats from current PR

Default Build (Increase detected ⚠️)
General
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
buildDuration 19.4s 18.9s N/A
buildDurationCached 16.6s 14.4s N/A
nodeModulesSize 374 MB 373 MB N/A
nextStartRea..uration (ms) 442ms 442ms
Client Bundles (main, webpack)
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
214a959c-HASH.js gzip 52.6 kB 52.6 kB N/A
3528-HASH.js gzip 45.1 kB 44.6 kB N/A
6581.HASH.js gzip 169 B 169 B
9113-HASH.js gzip 5.27 kB 5.27 kB N/A
framework-HASH.js gzip 57.4 kB 57.4 kB N/A
main-app-HASH.js gzip 230 B 231 B N/A
main-HASH.js gzip 33 kB 32.8 kB N/A
webpack-HASH.js gzip 1.71 kB 1.71 kB
Overall change 1.88 kB 1.88 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
polyfills-HASH.js gzip 39.4 kB 39.4 kB
Overall change 39.4 kB 39.4 kB
Client Pages
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
_app-HASH.js gzip 192 B 193 B N/A
_error-HASH.js gzip 192 B 192 B
amp-HASH.js gzip 510 B 509 B N/A
css-HASH.js gzip 341 B 344 B N/A
dynamic-HASH.js gzip 1.84 kB 1.84 kB N/A
edge-ssr-HASH.js gzip 266 B 266 B
head-HASH.js gzip 362 B 364 B N/A
hooks-HASH.js gzip 390 B 391 B N/A
image-HASH.js gzip 4.41 kB 4.41 kB N/A
index-HASH.js gzip 268 B 268 B
link-HASH.js gzip 2.78 kB 2.78 kB N/A
routerDirect..HASH.js gzip 328 B 329 B N/A
script-HASH.js gzip 397 B 397 B
withRouter-HASH.js gzip 324 B 325 B N/A
1afbb74e6ecf..834.css gzip 106 B 106 B
Overall change 1.23 kB 1.23 kB
Client Build Manifests
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
_buildManifest.js gzip 750 B 749 B N/A
Overall change 0 B 0 B
Rendered Page Sizes
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
index.html gzip 523 B 525 B N/A
link.html gzip 538 B 539 B N/A
withRouter.html gzip 518 B 520 B N/A
Overall change 0 B 0 B
Edge SSR bundle Size
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
edge-ssr.js gzip 128 kB 128 kB N/A
page.js gzip 187 kB 187 kB N/A
Overall change 0 B 0 B
Middleware size
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
middleware-b..fest.js gzip 669 B 668 B N/A
middleware-r..fest.js gzip 156 B 155 B N/A
middleware.js gzip 31 kB 31 kB N/A
edge-runtime..pack.js gzip 844 B 844 B
Overall change 844 B 844 B
Next Runtimes
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
973-experime...dev.js gzip 322 B 322 B
973.runtime.dev.js gzip 314 B 314 B
app-page-exp...dev.js gzip 317 kB 317 kB N/A
app-page-exp..prod.js gzip 121 kB 121 kB N/A
app-page-tur..prod.js gzip 134 kB 134 kB N/A
app-page-tur..prod.js gzip 129 kB 129 kB N/A
app-page.run...dev.js gzip 308 kB 307 kB N/A
app-page.run..prod.js gzip 117 kB 117 kB N/A
app-route-ex...dev.js gzip 35.9 kB 35.9 kB N/A
app-route-ex..prod.js gzip 24.4 kB 24.4 kB N/A
app-route-tu..prod.js gzip 24.4 kB 24.4 kB N/A
app-route-tu..prod.js gzip 24.2 kB 24.2 kB N/A
app-route.ru...dev.js gzip 37.6 kB 37.5 kB N/A
app-route.ru..prod.js gzip 24.2 kB 24.2 kB N/A
pages-api-tu..prod.js gzip 9.61 kB 9.61 kB
pages-api.ru...dev.js gzip 11.4 kB 11.4 kB
pages-api.ru..prod.js gzip 9.61 kB 9.61 kB
pages-turbo...prod.js gzip 20.9 kB 20.9 kB
pages.runtim...dev.js gzip 26.5 kB 26.5 kB
pages.runtim..prod.js gzip 20.9 kB 20.9 kB
server.runti..prod.js gzip 58.4 kB 58.4 kB N/A
Overall change 99.7 kB 99.7 kB
build cache Overall increase ⚠️
vercel/next.js canary vercel/next.js wbinnssmith/ignore-list-source-map Change
0.pack gzip 1.85 MB 1.85 MB ⚠️ +2.52 kB
index.pack gzip 143 kB 143 kB N/A
Overall change 1.85 MB 1.85 MB ⚠️ +2.52 kB
Diff details
Diff for page.js

Diff too large to display

Diff for middleware.js

Diff too large to display

Diff for edge-ssr.js

Diff too large to display

Diff for image-HASH.js
@@ -1,7 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [8358],
   {
-    /***/ 7905: /***/ (
+    /***/ 3194: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -9,7 +9,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/image",
         function () {
-          return __webpack_require__(2287);
+          return __webpack_require__(1499);
         },
       ]);
       if (false) {
@@ -18,7 +18,7 @@
       /***/
     },
 
-    /***/ 4266: /***/ (module, exports, __webpack_require__) => {
+    /***/ 3557: /***/ (module, exports, __webpack_require__) => {
       "use strict";
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
@@ -40,17 +40,17 @@
         __webpack_require__(7921)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(6686)
+        __webpack_require__(1685)
       );
-      const _getimgprops = __webpack_require__(6152);
-      const _imageconfig = __webpack_require__(7525);
-      const _imageconfigcontextsharedruntime = __webpack_require__(6909);
-      const _warnonce = __webpack_require__(694);
-      const _routercontextsharedruntime = __webpack_require__(1769);
+      const _getimgprops = __webpack_require__(2321);
+      const _imageconfig = __webpack_require__(8633);
+      const _imageconfigcontextsharedruntime = __webpack_require__(9251);
+      const _warnonce = __webpack_require__(2495);
+      const _routercontextsharedruntime = __webpack_require__(5906);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(5427)
+        __webpack_require__(9630)
       );
-      const _usemergedref = __webpack_require__(7892);
+      const _usemergedref = __webpack_require__(7662);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -371,7 +371,7 @@
       /***/
     },
 
-    /***/ 7892: /***/ (module, exports, __webpack_require__) => {
+    /***/ 7662: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -432,7 +432,7 @@
       /***/
     },
 
-    /***/ 6152: /***/ (
+    /***/ 2321: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -448,9 +448,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(694);
-      const _imageblursvg = __webpack_require__(411);
-      const _imageconfig = __webpack_require__(7525);
+      const _warnonce = __webpack_require__(2495);
+      const _imageblursvg = __webpack_require__(1103);
+      const _imageconfig = __webpack_require__(8633);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -824,7 +824,7 @@
       /***/
     },
 
-    /***/ 411: /***/ (__unused_webpack_module, exports) => {
+    /***/ 1103: /***/ (__unused_webpack_module, exports) => {
       "use strict";
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
@@ -879,7 +879,7 @@
       /***/
     },
 
-    /***/ 2063: /***/ (
+    /***/ 4297: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -906,10 +906,10 @@
         },
       });
       const _interop_require_default = __webpack_require__(9608);
-      const _getimgprops = __webpack_require__(6152);
-      const _imagecomponent = __webpack_require__(4266);
+      const _getimgprops = __webpack_require__(2321);
+      const _imagecomponent = __webpack_require__(3557);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(5427)
+        __webpack_require__(9630)
       );
       function getImageProps(imgProps) {
         const { props } = (0, _getimgprops.getImgProps)(imgProps, {
@@ -941,7 +941,7 @@
       /***/
     },
 
-    /***/ 5427: /***/ (__unused_webpack_module, exports) => {
+    /***/ 9630: /***/ (__unused_webpack_module, exports) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -976,7 +976,7 @@
       /***/
     },
 
-    /***/ 2287: /***/ (
+    /***/ 1499: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -993,8 +993,8 @@
 
       // EXTERNAL MODULE: ./node_modules/.pnpm/[email protected]/node_modules/react/jsx-runtime.js
       var jsx_runtime = __webpack_require__(2433);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-69d4b800-20241021_re_5ehui3izxi57mbto7db67nrlae/node_modules/next/image.js
-      var next_image = __webpack_require__(3447);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-69d4b800-20241021_re_lvlskvysvdaybwqbl4n7iaejzm/node_modules/next/image.js
+      var next_image = __webpack_require__(4593);
       var image_default = /*#__PURE__*/ __webpack_require__.n(next_image); // CONCATENATED MODULE: ./pages/nextjs.png
       /* harmony default export */ const nextjs = {
         src: "/_next/static/media/nextjs.cae0b805.png",
@@ -1024,12 +1024,12 @@
       /***/
     },
 
-    /***/ 3447: /***/ (
+    /***/ 4593: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(2063);
+      module.exports = __webpack_require__(4297);
 
       /***/
     },
@@ -1039,7 +1039,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [2888, 9774, 179], () =>
-      __webpack_exec__(7905)
+      __webpack_exec__(3194)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for 3528-HASH.js

Diff too large to display

Diff for main-HASH.js

Diff too large to display

Diff for app-page-exp..ntime.dev.js
failed to diff
Diff for app-page-exp..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page.runtime.dev.js
failed to diff
Diff for app-page.runtime.prod.js

Diff too large to display

Diff for app-route-ex..ntime.dev.js

Diff too large to display

Diff for app-route-ex..time.prod.js

Diff too large to display

Diff for app-route-tu..time.prod.js

Diff too large to display

Diff for app-route-tu..time.prod.js

Diff too large to display

Diff for app-route.runtime.dev.js

Diff too large to display

Diff for app-route.ru..time.prod.js

Diff too large to display

Diff for server.runtime.prod.js

Diff too large to display

Commit: d27a723c148e8531f3b35a6d0da988bb4ebcffda

ijjk avatar Oct 24 '24 00:10 ijjk

  • #71770 Graphite 👈
  • #71489 Graphite
  • canary

This stack of pull requests is managed by Graphite. Learn more about stacking.

Join @wbinnssmith and the rest of your teammates on Graphite Graphite

wbinnssmith avatar Oct 24 '24 02:10 wbinnssmith