From 4974cc6ef82f1fb267667634a7bf27c276c98468 Mon Sep 17 00:00:00 2001 From: Sebastian Sebbie Silbermann Date: Mon, 21 Jul 2025 17:55:31 +0200 Subject: [PATCH 1/3] [Flight] Remove superfluous whitespace when console method is called with non-strings --- packages/react-client/src/ReactClientConsoleConfigBrowser.js | 4 ++-- packages/react-client/src/ReactClientConsoleConfigPlain.js | 4 ++-- packages/react-client/src/ReactClientConsoleConfigServer.js | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/react-client/src/ReactClientConsoleConfigBrowser.js b/packages/react-client/src/ReactClientConsoleConfigBrowser.js index bc3976327524..f67e4afa0c46 100644 --- a/packages/react-client/src/ReactClientConsoleConfigBrowser.js +++ b/packages/react-client/src/ReactClientConsoleConfigBrowser.js @@ -8,7 +8,7 @@ */ // Keep in sync with ReactServerConsoleConfig -const badgeFormat = '%c%s%c '; +const badgeFormat = '%c%s%c'; // Same badge styling as DevTools. const badgeStyle = // We use a fixed background if light-dark is not supported, otherwise @@ -49,7 +49,7 @@ export function bindToConsole( newArgs.splice( offset, 1, - badgeFormat + newArgs[offset], + badgeFormat + ' ' + newArgs[offset], badgeStyle, pad + badgeName + pad, resetStyle, diff --git a/packages/react-client/src/ReactClientConsoleConfigPlain.js b/packages/react-client/src/ReactClientConsoleConfigPlain.js index 5fe553744a9f..ee4c87ca6133 100644 --- a/packages/react-client/src/ReactClientConsoleConfigPlain.js +++ b/packages/react-client/src/ReactClientConsoleConfigPlain.js @@ -8,7 +8,7 @@ */ // Keep in sync with ReactServerConsoleConfig -const badgeFormat = '[%s] '; +const badgeFormat = '[%s]'; const pad = ' '; const bind = Function.prototype.bind; @@ -39,7 +39,7 @@ export function bindToConsole( newArgs.splice( offset, 1, - badgeFormat + newArgs[offset], + badgeFormat + ' ' + newArgs[offset], pad + badgeName + pad, ); } else { diff --git a/packages/react-client/src/ReactClientConsoleConfigServer.js b/packages/react-client/src/ReactClientConsoleConfigServer.js index 1978a4bc8b8d..6e69ef12a3ce 100644 --- a/packages/react-client/src/ReactClientConsoleConfigServer.js +++ b/packages/react-client/src/ReactClientConsoleConfigServer.js @@ -9,7 +9,7 @@ // Keep in sync with ReactServerConsoleConfig // This flips color using ANSI, then sets a color styling, then resets. -const badgeFormat = '\x1b[0m\x1b[7m%c%s\x1b[0m%c '; +const badgeFormat = '\x1b[0m\x1b[7m%c%s\x1b[0m%c'; // Same badge styling as DevTools. const badgeStyle = // We use a fixed background if light-dark is not supported, otherwise @@ -50,7 +50,7 @@ export function bindToConsole( newArgs.splice( offset, 1, - badgeFormat + newArgs[offset], + badgeFormat + ' ' + newArgs[offset], badgeStyle, pad + badgeName + pad, resetStyle, From e8cc360790a716b491aae00cc6282950e8a6f9de Mon Sep 17 00:00:00 2001 From: Sebastian Sebbie Silbermann Date: Mon, 21 Jul 2025 18:40:49 +0200 Subject: [PATCH 2/3] Read the comment --- packages/react-server/src/ReactServerConsoleConfigBrowser.js | 2 +- packages/react-server/src/ReactServerConsoleConfigPlain.js | 2 +- packages/react-server/src/ReactServerConsoleConfigServer.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/react-server/src/ReactServerConsoleConfigBrowser.js b/packages/react-server/src/ReactServerConsoleConfigBrowser.js index d8ff2abb93c5..6880d8d169a1 100644 --- a/packages/react-server/src/ReactServerConsoleConfigBrowser.js +++ b/packages/react-server/src/ReactServerConsoleConfigBrowser.js @@ -8,7 +8,7 @@ */ // Keep in sync with ReactClientConsoleConfig -const badgeFormat = '%c%s%c '; +const badgeFormat = '%c%s%c'; // Same badge styling as DevTools. const badgeStyle = // We use a fixed background if light-dark is not supported, otherwise diff --git a/packages/react-server/src/ReactServerConsoleConfigPlain.js b/packages/react-server/src/ReactServerConsoleConfigPlain.js index 602013cbe976..08b0727086b0 100644 --- a/packages/react-server/src/ReactServerConsoleConfigPlain.js +++ b/packages/react-server/src/ReactServerConsoleConfigPlain.js @@ -8,7 +8,7 @@ */ // Keep in sync with ReactClientConsoleConfig -const badgeFormat = '[%s] '; +const badgeFormat = '[%s]'; const padLength = 1; const pad = ' '; diff --git a/packages/react-server/src/ReactServerConsoleConfigServer.js b/packages/react-server/src/ReactServerConsoleConfigServer.js index fbeadff911b3..bd782d444a7c 100644 --- a/packages/react-server/src/ReactServerConsoleConfigServer.js +++ b/packages/react-server/src/ReactServerConsoleConfigServer.js @@ -8,7 +8,7 @@ */ // Keep in sync with ReactClientConsoleConfig -const badgeFormat = '\x1b[0m\x1b[7m%c%s\x1b[0m%c '; +const badgeFormat = '\x1b[0m\x1b[7m%c%s\x1b[0m%c'; // Same badge styling as DevTools. const badgeStyle = // We use a fixed background if light-dark is not supported, otherwise From 25f8893bd8b503b548185f7566fb27a5d8fa8432 Mon Sep 17 00:00:00 2001 From: Sebastian Sebbie Silbermann Date: Mon, 21 Jul 2025 19:29:35 +0200 Subject: [PATCH 3/3] Remove spacing when we handle double badging --- .../react-server/src/ReactServerConsoleConfigBrowser.js | 7 ++++++- packages/react-server/src/ReactServerConsoleConfigPlain.js | 7 ++++++- .../react-server/src/ReactServerConsoleConfigServer.js | 7 ++++++- 3 files changed, 18 insertions(+), 3 deletions(-) diff --git a/packages/react-server/src/ReactServerConsoleConfigBrowser.js b/packages/react-server/src/ReactServerConsoleConfigBrowser.js index 6880d8d169a1..be8bf9534670 100644 --- a/packages/react-server/src/ReactServerConsoleConfigBrowser.js +++ b/packages/react-server/src/ReactServerConsoleConfigBrowser.js @@ -54,7 +54,12 @@ export function unbadgeConsole( typeof badge === 'string' ) { // Remove our badging from the arguments. - args.splice(offset, 4, format.slice(badgeFormat.length)); + let unbadgedFormat = format.slice(badgeFormat.length); + if (unbadgedFormat[0] === ' ') { + // Spacing added on the Client if the original argument was a string. + unbadgedFormat = unbadgedFormat.slice(1); + } + args.splice(offset, 4, unbadgedFormat); return badge.slice(padLength, badge.length - padLength); } return null; diff --git a/packages/react-server/src/ReactServerConsoleConfigPlain.js b/packages/react-server/src/ReactServerConsoleConfigPlain.js index 08b0727086b0..d93e5f1a0ddf 100644 --- a/packages/react-server/src/ReactServerConsoleConfigPlain.js +++ b/packages/react-server/src/ReactServerConsoleConfigPlain.js @@ -45,7 +45,12 @@ export function unbadgeConsole( badge.endsWith(pad) ) { // Remove our badging from the arguments. - args.splice(offset, 2, format.slice(badgeFormat.length)); + let unbadgedFormat = format.slice(badgeFormat.length); + if (unbadgedFormat[0] === ' ') { + // Spacing added on the Client if the original argument was a string. + unbadgedFormat = unbadgedFormat.slice(1); + } + args.splice(offset, 4, unbadgedFormat); return badge.slice(padLength, badge.length - padLength); } return null; diff --git a/packages/react-server/src/ReactServerConsoleConfigServer.js b/packages/react-server/src/ReactServerConsoleConfigServer.js index bd782d444a7c..7987b9b262fa 100644 --- a/packages/react-server/src/ReactServerConsoleConfigServer.js +++ b/packages/react-server/src/ReactServerConsoleConfigServer.js @@ -53,7 +53,12 @@ export function unbadgeConsole( typeof badge === 'string' ) { // Remove our badging from the arguments. - args.splice(offset, 4, format.slice(badgeFormat.length)); + let unbadgedFormat = format.slice(badgeFormat.length); + if (unbadgedFormat[0] === ' ') { + // Spacing added on the Client if the original argument was a string. + unbadgedFormat = unbadgedFormat.slice(1); + } + args.splice(offset, 4, unbadgedFormat); return badge.slice(padLength, badge.length - padLength); } return null;