react changelog

This commit introduces support for custom fbt-like macro functions in the compiler. It includes changes to the Environment configuration schema to add a new field called customMacros, which allows specifying functions that the application compiles as macros. These custom macros are handled in a way that ensures they are not compiled to rename the macro or separate the function from its argument, similar to how the Meta APIs such as featureflag("name-of-feature-flag") are handled. Additionally, the commit includes modifications to various files such as CodegenReactiveFunction.ts, index.ts, and MemoizeFbtAndMacroOperandsInSameScope.ts to implement the support for custom macros and update references accordingly.

Furthermore, the commit includes additions to test fixtures and the compiler to accommodate the changes related to custom macros. For example, a new test fixture repro-cx-assigned-to-temporary.js is added to demonstrate the usage of custom macros, and modifications are made to the compiler to handle the custom macros specified in the source code. Overall, this commit enhances the compiler's capabilities by allowing developers to define and use custom macro functions similar to fbt in their applications.

Files changed

• compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts
• compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts
• compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/MemoizeFbtAndMacroOperandsInSameScope.ts
• compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/index.ts
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-assigned-to-temporary.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-assigned-to-temporary.js
• compiler/packages/snap/src/compiler.ts

This commit adds support for method-call version of macro functions by adding fixtures for macro.namespace(...) style invocations. The changes include testing various examples to ensure the functionality works without any issues, fixing a bug related to early return in some cases, and updating the naming convention in the codebase. The commit also includes additions to test fixtures and modifications in the Pipeline and MemoizeFbtAndMacroOperandsInSameScope files.

Overall, this commit enhances the compiler's ability to support method-call versions of macro functions, ensuring that the functionality works correctly and fixing any existing bugs. It also includes changes to test fixtures and code files to accommodate these updates.

Files changed

• compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Pipeline.ts
• compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/MemoizeFbtAndMacroOperandsInSameScope.ts
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-assigned-to-temporary.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-assigned-to-temporary.js
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.js

This commit prepares the feature flags for React Native 0.75, which will be upgraded to React 19. The changes involve configuring the React Native open source feature flags in preparation for the upgrade. The commit includes modifications to various flags in the codebase, setting values for different flags such as enabling or disabling certain features like async actions, cache, debug tracing, and more. The changes also include aligning the flags with the upcoming React Native version and making adjustments for better performance and compatibility.

The changes were tested using yarn test and yarn flow fabric commands. The modifications include updating flag values in files related to React Feature Flags for React Native, ensuring that the feature flags are properly configured and aligned with the upcoming React Native 0.75 version. Overall, the commit focuses on preparing the feature flags to ensure a smooth transition to React 19 and improve the performance and compatibility of React Native.

Files changed

• packages/shared/forks/ReactFeatureFlags.native-fb.js
• packages/shared/forks/ReactFeatureFlags.native-oss.js
• packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js

This commit in React DevTools unifies console patching and defaults to using ANSI escape symbols for dimming in both terminals and browser consoles. For Firefox, which does not support ANSI escape symbols console stylings, the fallback is to use CSS properties as done previously. The changes were tested in various environments including terminal, Fusebox console, Firefox console, and Chrome console to ensure compatibility in both dark and light modes.

The commit includes modifications to various files such as .eslintrc.js, webpack files, constants, hooks, tests, and configuration files across different React DevTools packages to implement the unified console patching and default dimming behavior. This change ensures a consistent experience across different environments when using React DevTools for debugging and inspecting React applications.

Files changed

• .eslintrc.js
• packages/react-devtools-core/webpack.backend.js
• packages/react-devtools-core/webpack.standalone.js
• packages/react-devtools-extensions/utils.js
• packages/react-devtools-extensions/webpack.backend.js
• packages/react-devtools-extensions/webpack.config.js
• packages/react-devtools-fusebox/webpack.config.frontend.js
• packages/react-devtools-inline/webpack.config.js
• packages/react-devtools-shared/src/__tests__/console-test.js
• packages/react-devtools-shared/src/backend/console.js
• packages/react-devtools-shared/src/constants.js
• packages/react-devtools-shared/src/hook.js
• packages/react-devtools-shell/webpack-server.js
• scripts/flow/react-devtools.js
• scripts/jest/devtools/setupEnv.js

This commit updates the code by considering the dispatch function from useActionState as non-reactive. It removes the previous name, useFormState, since it was the previous name for useActionState. The commit includes changes to various files such as Globals.ts, HIR.ts, ObjectShape.ts, InferReactivePlaces.ts, and PruneNonReactiveDependencies.ts. It introduces new functions to check for stable types and updates existing functions to reflect this change. Additionally, new test fixtures are added to ensure the correct behavior of dispatch being considered as non-reactive.

Overall, this commit refactors the code related to useActionState and dispatch functions to ensure they are treated as non-reactive. It involves updating multiple files, introducing new functions, and adding test fixtures to validate the changes made.

Files changed

• compiler/packages/babel-plugin-react-compiler/src/HIR/Globals.ts
• compiler/packages/babel-plugin-react-compiler/src/HIR/HIR.ts
• compiler/packages/babel-plugin-react-compiler/src/HIR/ObjectShape.ts
• compiler/packages/babel-plugin-react-compiler/src/Inference/InferReactivePlaces.ts
• compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonReactiveDependencies.ts
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useActionState-dispatch-considered-as-non-reactive.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useActionState-dispatch-considered-as-non-reactive.js

React DevTools version 5.3.0 includes several improvements and fixes. Some of the changes include improving console arguments formatting before passing them to the original console, unifying console patching and defaulting to ansi escape symbols, making source maps URL relative, fixing issues with inspecting elements, ensuring component badges are visible in light mode, and removing the native inspection button when it can't be used. Additionally, there are updates related to dependencies, lint rules, and error reporting, as well as refactoring context menus and enabling Native console.createTask stacks when available.

Overall, the update to React DevTools 5.3.0 brings enhancements to the debugging tools, addressing various issues and optimizing the developer experience. The changes cover a range of areas such as console formatting, inspection capabilities, error handling, and dependency updates, with a focus on improving functionality and usability for developers using React.

Files changed

• packages/react-devtools-core/package.json
• packages/react-devtools-extensions/chrome/manifest.json
• packages/react-devtools-extensions/edge/manifest.json
• packages/react-devtools-extensions/firefox/manifest.json
• packages/react-devtools-inline/package.json
• packages/react-devtools-timeline/package.json
• packages/react-devtools/CHANGELOG.md
• packages/react-devtools/package.json

This commit introduces a change in the compiler to treat objects named as ref or ending with the substring Ref, and containing a property named current, as React refs. Previously, when a component used the useRef hook directly, the return value was typed as a ref. However, if the hook was wrapped in a custom hook, the type information was lost, leading to false positives in analysis. This update aims to address issues like the ones reported in previous cases by identifying objects with specific names and properties as React refs, even when used within custom hooks.

The changes include modifications to the EnvironmentConfigSchema to enable treating ref-like identifiers as refs, adjustments in the Types.ts file to handle object names and identifiers, additions to handle ref-like names in instructions, and the introduction of a function to determine if a property type is a ref-like name based on specific naming patterns. Overall, this enhancement allows for more accurate typing of objects as React refs, improving the analysis and handling of such objects within the compiler.

Files changed

• compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts
• compiler/packages/babel-plugin-react-compiler/src/HIR/Types.ts
• compiler/packages/babel-plugin-react-compiler/src/TypeInference/InferTypes.ts
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-like-name-not-Ref.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-like-name-not-Ref.js
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-like-name-not-a-ref.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-like-name-not-a-ref.js
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-effect.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-effect.js
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback-2.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback-2.js
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback.expect.md
• compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback.js

This commit introduces a new API called captureOwnerStack in the react package, which is only available in development builds. This API allows developers to implement similar functionality to what is done for console.error in user space. It does not include the current stack obtained from new Error().stack, which developers would need to add themselves. The purpose of this API is to enable conditional development exports, as there are plans to have separate ESM builds using either the "development" or "production" export conditions. Additionally, this commit removes the export of act from react in production builds and replaces it with a function that throws, aligning with the handling of other conditional exports.

The changes made include adding the captureOwnerStack function to the ReactClient and ReactOwnerStack modules, as well as updating various files to handle the new DEV-only API. The commit also includes modifications to setup scripts and build configurations to accommodate the new development export and ensure proper resolution of entry points for different build types.

Files changed

• packages/react-reconciler/src/ReactCurrentFiber.js
• packages/react-reconciler/src/__tests__/ReactOwnerStacks-test.js
• packages/react-test-renderer/src/ReactTestRenderer.js
• packages/react/index.development.js
• packages/react/index.experimental.development.js
• packages/react/index.experimental.js
• packages/react/index.js
• packages/react/src/ReactClient.js
• packages/react/src/ReactOwnerStack.js
• packages/react/src/ReactServer.experimental.development.js
• packages/react/src/ReactSharedInternalsClient.js
• packages/react/src/ReactSharedInternalsServer.js
• scripts/jest/setupHostConfigs.js
• scripts/rollup/build.js

This commit removes the dynamic feature flag enableSchedulingProfiler from the ReactFeatureFlags in the www package. The flag was previously set to a dynamic value based on the environment, but it has been replaced with a static value of __DEV__. The changes involve removing the flag from the ReactFeatureFlags file in the www-dynamic.js and updating its value to __DEV__ in the ReactFeatureFlags file in the www.js.

Overall, this commit simplifies the feature flag handling by removing the dynamic nature of enableSchedulingProfiler and setting it to a static value. The flag is now explicitly set to __DEV__ in the ReactFeatureFlags file, streamlining the code and making it easier to understand and maintain.

Files changed

• packages/shared/forks/ReactFeatureFlags.www-dynamic.js
• packages/shared/forks/ReactFeatureFlags.www.js

This commit reverts a previous change that removed the dynamic feature flag enableSchedulingProfiler in the www section of the code. The change was made in response to a pull request on the React repository, and this commit undoes that change.

The revert restores the functionality of the enableSchedulingProfiler feature flag in the www section of the code, allowing for dynamic control of the scheduling profiler. This decision was made based on the feedback or considerations related to the removal of this feature flag.

Files changed