[DevTools] Avoid Stringifying Objects during Strict Mode Double Logging

[lunaruan]

Fixes #24302 based on #24306.

The current implementation for strict mode double logging stringiness and dims the second log. However, because we stringify everything, including objects, this causes objects to be logged as [object Object] etc.

This PR creates a new function that formats console log arguments with a specified style. It does this by:

1. The first param is a string that contains %c: Bail out and return the args without modifying the styles. We don't want to affect styles that the developer deliberately set.
2. The first param is a string that doesn't contain %c but contains string formatting: [%c${args[0]}, style, ...args.slice(1)] Note: we assume that the string formatting that the developer uses is correct.
3. The first param is a string that doesn't contain string formatting OR is not a string: Create a formatting string where:
   • boolean, string, symbol -> %s
   • number -> %f OR %i depending on if it's an int or float
   • default -> %o

---

Co-authored-by: Billy Janitsch [email protected]

[billyjanitsch]

Thanks @lunaruan for fixing this up. ☺️

[billyjanitsch]

Might want to check that the matching string isn't %%c (%% is an escaped %).

[lunaruan]

Ah good call! Thanks!

[bvaughn]

I'm sure you're aware of this, but it looks like this change broke some pre-existing tests in CI:
https://app.circleci.com/pipelines/github/facebook/react/26207/workflows/06a6279f-0816-4dfc-81c5-b2f9228474c1/jobs/471951

[sophiebits]

I’m not sure checking for %% this way is quite what you want – eg %%%s is an escaped % followed by a string value.

[lunaruan]

Ooh good call