Account for assetPrefix when initializing HMR connection

[genetschneider]

Bug

• Fixes issue #30328

Changes

• Ensure assetPrefix is used by HMR properly
• • Allow local proxy servers (local cdn url) as assetPrefix when doing HMR

[ijjk]

Hi, can you please add a test for this to ensure it is working as expected? Existing tests for the HMR connection can be found here

[ijjk]

Failing test suites

Commit: e408506

test/development/basic-basepath/hmr.test.ts

• basic HMR > Hot Module Reloading > editing a page > should update styles correctly

Expand output

● basic HMR › Hot Module Reloading › editing a page › should update styles correctly

page.waitForSelector: Timeout 30000ms exceeded.
=========================== logs ===========================
waiting for selector ".hmr-style-page p"
============================================================

  250 |     return this.chain(() => {
  251 |       return page
> 252 |         .waitForSelector(selector, { timeout, state: 'attached' })
      |          ^
  253 |         .then(async (el) => {
  254 |           // it seems selenium waits longer and tests rely on this behavior
  255 |           // so we wait for the load event fire before returning

  at lib/browsers/playwright.ts:252:10

[ijjk]

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
buildDuration	25.6s	24.1s	-1.4s
buildDurationCached	5.1s	4.9s	-269ms
nodeModulesSize	293 MB	293 MB	⚠️ +1.68 kB

Page Load Tests Overall increase ✓

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
/ failed reqs	0	0	✓
/ total time (seconds)	4.103	3.919	-0.18
/ avg req/sec	609.32	637.95	+28.63
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	2.179	2.018	-0.16
/error-in-render avg req/sec	1147.56	1238.81	+91.25

Client Bundles (main, webpack, commons)

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
450.HASH.js gzip	179 B	179 B	✓
framework-HASH.js gzip	42.2 kB	42.2 kB	✓
main-HASH.js gzip	28 kB	28 kB	✓
webpack-HASH.js gzip	1.45 kB	1.45 kB	✓
Overall change	71.9 kB	71.9 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
_app-HASH.js gzip	1.23 kB	1.23 kB	✓
_error-HASH.js gzip	194 B	194 B	✓
amp-HASH.js gzip	312 B	312 B	✓
css-HASH.js gzip	327 B	327 B	✓
dynamic-HASH.js gzip	2.38 kB	2.38 kB	✓
head-HASH.js gzip	350 B	350 B	✓
hooks-HASH.js gzip	635 B	635 B	✓
image-HASH.js gzip	4.44 kB	4.44 kB	✓
index-HASH.js gzip	263 B	263 B	✓
link-HASH.js gzip	1.87 kB	1.87 kB	✓
routerDirect..HASH.js gzip	321 B	321 B	✓
script-HASH.js gzip	383 B	383 B	✓
withRouter-HASH.js gzip	318 B	318 B	✓
334f979574ae..6f4.css gzip	106 B	106 B	✓
Overall change	13.1 kB	13.1 kB	✓

Client Build Manifests

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
_buildManifest.js gzip	459 B	459 B	✓
Overall change	459 B	459 B	✓

Rendered Page Sizes

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
index.html gzip	520 B	520 B	✓
link.html gzip	531 B	531 B	✓
withRouter.html gzip	513 B	513 B	✓
Overall change	1.56 kB	1.56 kB	✓

---

Default Build with SWC (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
buildDuration	25.7s	25.2s	-579ms
buildDurationCached	5s	4.8s	-184ms
nodeModulesSize	293 MB	293 MB	⚠️ +1.68 kB

Page Load Tests Overall increase ✓

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
/ failed reqs	0	0	✓
/ total time (seconds)	3.974	4.026	⚠️ +0.05
/ avg req/sec	629.15	620.9	⚠️ -8.25
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	2.071	1.964	-0.11
/error-in-render avg req/sec	1206.87	1272.66	+65.79

Client Bundles (main, webpack, commons)

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
450.HASH.js gzip	179 B	179 B	✓
framework-HASH.js gzip	42.3 kB	42.3 kB	✓
main-HASH.js gzip	28.2 kB	28.2 kB	✓
webpack-HASH.js gzip	1.43 kB	1.43 kB	✓
Overall change	72.1 kB	72.1 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
_app-HASH.js gzip	1.22 kB	1.22 kB	✓
_error-HASH.js gzip	180 B	180 B	✓
amp-HASH.js gzip	305 B	305 B	✓
css-HASH.js gzip	321 B	321 B	✓
dynamic-HASH.js gzip	2.38 kB	2.38 kB	✓
head-HASH.js gzip	342 B	342 B	✓
hooks-HASH.js gzip	622 B	622 B	✓
image-HASH.js gzip	4.46 kB	4.46 kB	✓
index-HASH.js gzip	256 B	256 B	✓
link-HASH.js gzip	1.91 kB	1.91 kB	✓
routerDirect..HASH.js gzip	314 B	314 B	✓
script-HASH.js gzip	375 B	375 B	✓
withRouter-HASH.js gzip	309 B	309 B	✓
334f979574ae..6f4.css gzip	106 B	106 B	✓
Overall change	13.1 kB	13.1 kB	✓

Client Build Manifests

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
_buildManifest.js gzip	460 B	460 B	✓
Overall change	460 B	460 B	✓

Rendered Page Sizes

	vercel/next.js canary	genetschneider/next.js-1 asset-prefix-fast-refresh	Change
index.html gzip	523 B	523 B	✓
link.html gzip	536 B	536 B	✓
withRouter.html gzip	517 B	517 B	✓
Overall change	1.58 kB	1.58 kB	✓

Commit: e408506

[KingPengZero]

12.0.3-canary.5

I also encountered this problem. How did you solve it

For nginx configuration, localhost is OK, but the dev domain name will report an error

[drewlustro]

@KingPengZero – did you find a solution? We're experiencing the same issue.

• Custom dev domain
• https
• nginx proxy
• assetPrefix = /talent/;