From e82d70510bdec3497a2fc30a7e74176f83095afa Mon Sep 17 00:00:00 2001 From: pranamya123 <47019410+pranamya123@users.noreply.github.com> Date: Fri, 9 Jan 2026 03:54:48 +0000 Subject: [PATCH 1/2] Docs, Test: mark flushSync as deprecated Add a test that verifies flushSync emits a deprecation warning and update the React reconciler README to reflect deprecation. --- packages/react-reconciler/README.md | 15 ++++++++++++ .../src/ReactFiberReconciler.js | 12 ++++++++++ .../src/__tests__/ReactFlushSync-test.js | 24 +++++++++++++++++++ 3 files changed, 51 insertions(+) diff --git a/packages/react-reconciler/README.md b/packages/react-reconciler/README.md index 82080513a45..3b7858f09c4 100644 --- a/packages/react-reconciler/README.md +++ b/packages/react-reconciler/README.md @@ -351,3 +351,18 @@ If you use the persistent mode instead of the mutation mode, you would still nee You can optionally implement hydration to "attach" to the existing tree during the initial render instead of creating it from scratch. For example, the DOM renderer uses this to attach to an HTML markup. To support hydration, you need to declare `supportsHydration: true` and then implement the methods in the "Hydration" section [listed in this file](https://github.com/facebook/react/blob/main/packages/react-reconciler/src/forks/ReactFiberConfig.custom.js). File an issue if you need help. + +### Deprecated APIs + +#### `flushSync` + +The `flushSync` API has been removed in react-reconciler v0.31+. +Use `updateContainerSync()` and `flushSyncWork()` instead. + +```js +// Before +flushSync(() => { ... }); + +// After +updateContainerSync(element, container); +flushSyncWork(); \ No newline at end of file diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js index 65eebf04e48..d839c3d4b41 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.js @@ -460,6 +460,18 @@ function updateContainerImpl( } } +if (__DEV__) { + Object.defineProperty(exports, 'flushSync', { + get() { + console.warn( + 'flushSync has been removed in react-reconciler v0.31+. ' + + 'Please use updateContainerSync() and flushSyncWork() instead.' + ); + return undefined; + } + }); +} + export { batchedUpdates, deferredUpdates, diff --git a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js index 801530b4d1d..9f34b5b6179 100644 --- a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js +++ b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js @@ -343,3 +343,27 @@ describe('ReactFlushSync', () => { expect(error.errors[1]).toBe(nooo); }); }); + +describe('flushSync deprecation warning', () => { + let consoleErrorSpy; + + beforeEach(() => { + consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + }); + + afterEach(() => { + consoleErrorSpy.mockRestore(); + }); + + it('warns that flushSync is deprecated in favor of flushAsyncWork', () => { + const ReactDOM = require('react-dom'); + + ReactDOM.flushSync(() => {}); + + expect(consoleErrorSpy).toHaveBeenCalledWith( + expect.stringContaining( + 'flushSync is deprecated and will be removed. Use flushAsyncWork instead.' + ) + ); + }); +}); \ No newline at end of file From 34fc0cbba5f6fbf48d57f1a51a27ec222eaed7e5 Mon Sep 17 00:00:00 2001 From: pranamya123 <47019410+pranamya123@users.noreply.github.com> Date: Fri, 9 Jan 2026 04:15:46 +0000 Subject: [PATCH 2/2] removed warning and the corresponding test --- .../src/ReactFiberReconciler.js | 12 ---------- .../src/__tests__/ReactFlushSync-test.js | 24 ------------------- 2 files changed, 36 deletions(-) diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js index d839c3d4b41..65eebf04e48 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.js @@ -460,18 +460,6 @@ function updateContainerImpl( } } -if (__DEV__) { - Object.defineProperty(exports, 'flushSync', { - get() { - console.warn( - 'flushSync has been removed in react-reconciler v0.31+. ' + - 'Please use updateContainerSync() and flushSyncWork() instead.' - ); - return undefined; - } - }); -} - export { batchedUpdates, deferredUpdates, diff --git a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js index 9f34b5b6179..801530b4d1d 100644 --- a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js +++ b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js @@ -343,27 +343,3 @@ describe('ReactFlushSync', () => { expect(error.errors[1]).toBe(nooo); }); }); - -describe('flushSync deprecation warning', () => { - let consoleErrorSpy; - - beforeEach(() => { - consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); - }); - - afterEach(() => { - consoleErrorSpy.mockRestore(); - }); - - it('warns that flushSync is deprecated in favor of flushAsyncWork', () => { - const ReactDOM = require('react-dom'); - - ReactDOM.flushSync(() => {}); - - expect(consoleErrorSpy).toHaveBeenCalledWith( - expect.stringContaining( - 'flushSync is deprecated and will be removed. Use flushAsyncWork instead.' - ) - ); - }); -}); \ No newline at end of file