From 314503d15ae608c557884cb6a3434744dead390d Mon Sep 17 00:00:00 2001 From: Tobias Koppers Date: Wed, 25 Oct 2023 18:10:02 +0000 Subject: [PATCH 1/4] use postcsss transforms consistently also on server side --- .../next-core/src/next_client/context.rs | 2 +- .../next-core/src/next_server/context.rs | 18 ++++++++++++------ 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/packages/next-swc/crates/next-core/src/next_client/context.rs b/packages/next-swc/crates/next-core/src/next_client/context.rs index 8e0c3563dd361..51b8b93903004 100644 --- a/packages/next-swc/crates/next-core/src/next_client/context.rs +++ b/packages/next-swc/crates/next-core/src/next_client/context.rs @@ -279,8 +279,8 @@ pub async fn get_client_module_options_context( // we try resolve it once at the root and pass down a context to all // the modules. enable_jsx: Some(jsx_runtime_options), - enable_postcss_transform: postcss_transform_options, enable_webpack_loaders, + enable_postcss_transform: postcss_transform_options, enable_typescript_transform: Some(tsconfig), enable_mdx_rs, decorators: Some(decorators_options), diff --git a/packages/next-swc/crates/next-core/src/next_server/context.rs b/packages/next-swc/crates/next-core/src/next_server/context.rs index d42d7c5c0856a..3073ce53e0fec 100644 --- a/packages/next-swc/crates/next-core/src/next_server/context.rs +++ b/packages/next-swc/crates/next-core/src/next_server/context.rs @@ -248,7 +248,7 @@ pub async fn get_server_module_options_context( let foreign_code_context_condition = foreign_code_context_condition(next_config, project_path).await?; - let enable_postcss_transform = Some(PostCssTransformOptions { + let postcss_transform_options = Some(PostCssTransformOptions { postcss_package: Some(get_postcss_package_mapping(project_path)), ..Default::default() }); @@ -351,6 +351,8 @@ pub async fn get_server_module_options_context( let foreign_code_module_options_context = ModuleOptionsContext { custom_rules: internal_custom_rules.clone(), enable_webpack_loaders: foreign_webpack_loaders, + // NOTE(WEB-1016) PostCSS transforms should also apply to foreign code. + enable_postcss_transform: postcss_transform_options.clone(), ..module_options_context.clone() }; @@ -363,8 +365,8 @@ pub async fn get_server_module_options_context( ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), - enable_postcss_transform, enable_webpack_loaders, + enable_postcss_transform: postcss_transform_options, enable_typescript_transform: Some(tsconfig), enable_mdx_rs, decorators: Some(decorators_options), @@ -416,6 +418,8 @@ pub async fn get_server_module_options_context( let foreign_code_module_options_context = ModuleOptionsContext { custom_rules: internal_custom_rules.clone(), enable_webpack_loaders: foreign_webpack_loaders, + // NOTE(WEB-1016) PostCSS transforms should also apply to foreign code. + enable_postcss_transform: postcss_transform_options.clone(), ..module_options_context.clone() }; let internal_module_options_context = ModuleOptionsContext { @@ -436,8 +440,8 @@ pub async fn get_server_module_options_context( ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), - enable_postcss_transform, enable_webpack_loaders, + enable_postcss_transform: postcss_transform_options, enable_typescript_transform: Some(tsconfig), enable_mdx_rs, decorators: Some(decorators_options), @@ -498,6 +502,8 @@ pub async fn get_server_module_options_context( let foreign_code_module_options_context = ModuleOptionsContext { custom_rules: internal_custom_rules.clone(), enable_webpack_loaders: foreign_webpack_loaders, + // NOTE(WEB-1016) PostCSS transforms should also apply to foreign code. + enable_postcss_transform: postcss_transform_options.clone(), ..module_options_context.clone() }; let internal_module_options_context = ModuleOptionsContext { @@ -507,8 +513,8 @@ pub async fn get_server_module_options_context( }; ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), - enable_postcss_transform, enable_webpack_loaders, + enable_postcss_transform: postcss_transform_options, enable_typescript_transform: Some(tsconfig), enable_mdx_rs, decorators: Some(decorators_options), @@ -538,8 +544,8 @@ pub async fn get_server_module_options_context( ..module_options_context.clone() }; ModuleOptionsContext { - enable_postcss_transform, enable_webpack_loaders, + enable_postcss_transform: postcss_transform_options, enable_typescript_transform: Some(tsconfig), enable_mdx_rs, decorators: Some(decorators_options), @@ -587,8 +593,8 @@ pub async fn get_server_module_options_context( }; ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), - enable_postcss_transform, enable_webpack_loaders, + enable_postcss_transform: postcss_transform_options, enable_typescript_transform: Some(tsconfig), enable_mdx_rs, decorators: Some(decorators_options), From 466f4a36bd44926855530e88d345f78f24f7812a Mon Sep 17 00:00:00 2001 From: Tobias Koppers Date: Wed, 25 Oct 2023 23:05:57 +0000 Subject: [PATCH 2/4] ignore css for server changes --- packages/next-swc/crates/next-api/src/project.rs | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/packages/next-swc/crates/next-api/src/project.rs b/packages/next-swc/crates/next-api/src/project.rs index 1bb274708e47c..8e2c60c748058 100644 --- a/packages/next-swc/crates/next-api/src/project.rs +++ b/packages/next-swc/crates/next-api/src/project.rs @@ -812,7 +812,7 @@ impl Project { #[turbo_tasks::function] pub fn server_changed(self: Vc, roots: Vc) -> Vc { let path = self.node_root(); - any_output_changed(roots, path) + any_output_changed(roots, path, true) } /// Completion when client side changes are detected in output assets @@ -820,7 +820,7 @@ impl Project { #[turbo_tasks::function] pub fn client_changed(self: Vc, roots: Vc) -> Vc { let path = self.client_root(); - any_output_changed(roots, path) + any_output_changed(roots, path, false) } } @@ -828,6 +828,7 @@ impl Project { async fn any_output_changed( roots: Vc, path: Vc, + server: bool, ) -> Result> { let path = &path.await?; let completions = AdjacencyMap::new() @@ -839,7 +840,10 @@ async fn any_output_changed( .into_reverse_topological() .map(|m| async move { let asset_path = m.ident().path().await?; - if !asset_path.path.ends_with(".map") && asset_path.is_inside_ref(path) { + if !asset_path.path.ends_with(".map") + && (!server || !asset_path.path.ends_with(".css")) + && asset_path.is_inside_ref(path) + { Ok(Some(content_changed(Vc::upcast(m)))) } else { Ok(None) From 6a3f4ee28f1be79ac8ecad3bce4d32c33b7842b1 Mon Sep 17 00:00:00 2001 From: Tobias Koppers Date: Thu, 26 Oct 2023 00:27:40 +0000 Subject: [PATCH 3/4] ignore issues for server change detection --- .../crates/napi/src/next_api/endpoint.rs | 11 ++++++--- packages/next/src/build/swc/index.ts | 9 ++++++-- .../lib/router-utils/setup-dev-bundler.ts | 23 +++++++++++++++---- 3 files changed, 33 insertions(+), 10 deletions(-) diff --git a/packages/next-swc/crates/napi/src/next_api/endpoint.rs b/packages/next-swc/crates/napi/src/next_api/endpoint.rs index 7ab2365a2b1a7..f1ae5c58f4445 100644 --- a/packages/next-swc/crates/napi/src/next_api/endpoint.rs +++ b/packages/next-swc/crates/napi/src/next_api/endpoint.rs @@ -114,6 +114,7 @@ pub async fn endpoint_write_to_disk( #[napi(ts_return_type = "{ __napiType: \"RootTask\" }")] pub fn endpoint_server_changed_subscribe( #[napi(ts_arg_type = "{ __napiType: \"Endpoint\" }")] endpoint: External, + issues: bool, func: JsFunction, ) -> napi::Result> { let turbo_tasks = endpoint.turbo_tasks().clone(); @@ -124,9 +125,13 @@ pub fn endpoint_server_changed_subscribe( move || async move { let changed = endpoint.server_changed(); changed.strongly_consistent().await?; - let issues = get_issues(changed).await?; - let diags = get_diagnostics(changed).await?; - Ok((issues, diags)) + if issues { + let issues = get_issues(changed).await?; + let diags = get_diagnostics(changed).await?; + Ok((issues, diags)) + } else { + Ok((vec![], vec![])) + } }, |ctx| { let (issues, diags) = ctx.value; diff --git a/packages/next/src/build/swc/index.ts b/packages/next/src/build/swc/index.ts index e60a25ad9e2a3..543895eee6670 100644 --- a/packages/next/src/build/swc/index.ts +++ b/packages/next/src/build/swc/index.ts @@ -585,7 +585,9 @@ export interface Endpoint { * After serverChanged() has been awaited it will listen to changes. * The async iterator will yield for each change. */ - serverChanged(): Promise> + serverChanged( + includeIssues: boolean + ): Promise> } interface EndpointConfig { @@ -947,12 +949,15 @@ function bindingToApi(binding: any, _wasm: boolean) { return clientSubscription } - async serverChanged(): Promise>> { + async serverChanged( + includeIssues: boolean + ): Promise>> { const serverSubscription = subscribe( false, async (callback) => binding.endpointServerChangedSubscribe( await this._nativeEndpoint, + includeIssues, callback ) ) diff --git a/packages/next/src/server/lib/router-utils/setup-dev-bundler.ts b/packages/next/src/server/lib/router-utils/setup-dev-bundler.ts index caf438e46d219..394e5e280f394 100644 --- a/packages/next/src/server/lib/router-utils/setup-dev-bundler.ts +++ b/packages/next/src/server/lib/router-utils/setup-dev-bundler.ts @@ -634,6 +634,7 @@ async function startWatcher(opts: SetupOpts) { async function changeSubscription( page: string, type: 'client' | 'server', + includeIssues: boolean, endpoint: Endpoint | undefined, makePayload: ( page: string, @@ -643,7 +644,7 @@ async function startWatcher(opts: SetupOpts) { const key = `${page} (${type})` if (!endpoint || changeSubscriptions.has(key)) return - const changedPromise = endpoint[`${type}Changed`]() + const changedPromise = endpoint[`${type}Changed`](includeIssues) changeSubscriptions.set(key, changedPromise) const changed = await changedPromise @@ -1105,6 +1106,7 @@ async function startWatcher(opts: SetupOpts) { changeSubscription( 'middleware', 'server', + false, middleware.endpoint, async () => { const finishBuilding = startBuilding('middleware', true) @@ -1327,6 +1329,7 @@ async function startWatcher(opts: SetupOpts) { changeSubscription( '_document', 'server', + false, globalEntries.document, () => { return { action: HMR_ACTIONS_SENT_TO_BROWSER.RELOAD_PAGE } @@ -1425,6 +1428,7 @@ async function startWatcher(opts: SetupOpts) { changeSubscription( '_document', 'server', + false, globalEntries.document, () => { return { action: HMR_ACTIONS_SENT_TO_BROWSER.RELOAD_PAGE } @@ -1461,19 +1465,27 @@ async function startWatcher(opts: SetupOpts) { changeSubscription( page, 'server', + false, route.dataEndpoint, (pageName) => { + console.log('server change', pageName) return { event: HMR_ACTIONS_SENT_TO_BROWSER.SERVER_ONLY_CHANGES, pages: [pageName], } } ) - changeSubscription(page, 'client', route.htmlEndpoint, () => { - return { - event: HMR_ACTIONS_SENT_TO_BROWSER.CLIENT_CHANGES, + changeSubscription( + page, + 'client', + false, + route.htmlEndpoint, + () => { + return { + event: HMR_ACTIONS_SENT_TO_BROWSER.CLIENT_CHANGES, + } } - }) + ) } break @@ -1517,6 +1529,7 @@ async function startWatcher(opts: SetupOpts) { changeSubscription( page, 'server', + true, route.rscEndpoint, (_page, change) => { if ( From ae76c73e75a7170b577984c3d05e0ea326ec6659 Mon Sep 17 00:00:00 2001 From: Tobias Koppers Date: Thu, 26 Oct 2023 00:48:29 +0000 Subject: [PATCH 4/4] update test case --- test/development/basic/next-rs-api.test.ts | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/test/development/basic/next-rs-api.test.ts b/test/development/basic/next-rs-api.test.ts index 541937cba8cb2..b5648106c6afb 100644 --- a/test/development/basic/next-rs-api.test.ts +++ b/test/development/basic/next-rs-api.test.ts @@ -439,12 +439,16 @@ describe('next.rs api', () => { switch (route.type) { case 'page': { await route.htmlEndpoint.writeToDisk() - serverSideSubscription = await route.dataEndpoint.serverChanged() + serverSideSubscription = await route.dataEndpoint.serverChanged( + false + ) break } case 'app-page': { await route.htmlEndpoint.writeToDisk() - serverSideSubscription = await route.rscEndpoint.serverChanged() + serverSideSubscription = await route.rscEndpoint.serverChanged( + false + ) break } default: {