diff --git a/.circleci/config.yml b/.circleci/config.yml index 32e8324a879ea..b936640682bbe 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -110,14 +110,14 @@ jobs: paths: - build - yarn_build_combined: + yarn_build: docker: *docker environment: *environment parallelism: 40 steps: - checkout - setup_node_modules - - run: yarn build-combined + - run: yarn build - persist_to_workspace: root: . paths: @@ -451,7 +451,7 @@ workflows: # TODO: Test more persistent configurations? - '-r=stable --env=development --persistent' - '-r=experimental --env=development --persistent' - - yarn_build_combined: + - yarn_build: filters: branches: ignore: @@ -464,10 +464,10 @@ workflows: - process_artifacts_combined: requires: - scrape_warning_messages - - yarn_build_combined + - yarn_build - yarn_test_build: requires: - - yarn_build_combined + - yarn_build matrix: parameters: args: @@ -506,22 +506,22 @@ workflows: - main requires: - download_base_build_for_sizebot - - yarn_build_combined + - yarn_build - yarn_lint_build: requires: - - yarn_build_combined + - yarn_build - yarn_check_release_dependencies: requires: - - yarn_build_combined + - yarn_build - check_error_codes: requires: - - yarn_build_combined + - yarn_build - RELEASE_CHANNEL_stable_yarn_test_dom_fixtures: requires: - - yarn_build_combined + - yarn_build - build_devtools_and_process_artifacts: requires: - - yarn_build_combined + - yarn_build - run_devtools_e2e_tests: requires: - build_devtools_and_process_artifacts diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index 21ff46dbab299..23fbc65ab5769 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -9,7 +9,7 @@ 3. If you've fixed a bug or added code that should be tested, add tests! 4. Ensure the test suite passes (`yarn test`). Tip: `yarn test --watch TestName` is helpful in development. 5. Run `yarn test --prod` to test in the production environment. It supports the same options as `yarn test`. - 6. If you need a debugger, run `yarn debug-test --watch TestName`, open `chrome://inspect`, and press "Inspect". + 6. If you need a debugger, run `yarn test --debug --watch TestName`, open `chrome://inspect`, and press "Inspect". 7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`). 8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files. 9. Run the [Flow](https://flowtype.org/) type checks (`yarn flow`). diff --git a/.github/workflows/commit_artifacts.yml b/.github/workflows/commit_artifacts.yml index 05744cb5cfceb..11dfbfd4fbf86 100644 --- a/.github/workflows/commit_artifacts.yml +++ b/.github/workflows/commit_artifacts.yml @@ -8,17 +8,11 @@ jobs: download_artifacts: runs-on: ubuntu-latest steps: - - uses: actions/setup-node@v3 - with: - node-version: 18.x - - run: npm init -y - - run: npm install node-fetch@2 - name: Download and unzip artifacts uses: actions/github-script@v6 with: script: | const cp = require('child_process'); - const fetch = require('node-fetch'); function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); diff --git a/fixtures/art/package.json b/fixtures/art/package.json index 82e84bb49a4f6..7d540fee14aa7 100644 --- a/fixtures/art/package.json +++ b/fixtures/art/package.json @@ -5,9 +5,9 @@ "@babel/preset-env": "^7.10.4", "@babel/preset-react": "^7.10.4", "babel-loader": "^8.1.0", - "react": "link:../../build/node_modules/react", - "react-art": "link:../../build/node_modules/react-art/", - "react-dom": "link:../../build/node_modules/react-dom", + "react": "link:../../build/oss-experimental/react", + "react-art": "link:../../build/oss-experimental/react-art/", + "react-dom": "link:../../build/oss-experimental/react-dom", "webpack": "^1.14.0" }, "scripts": { diff --git a/fixtures/art/yarn.lock b/fixtures/art/yarn.lock index 048ab68103189..8d0f79f957b52 100644 --- a/fixtures/art/yarn.lock +++ b/fixtures/art/yarn.lock @@ -2251,15 +2251,15 @@ rc@^1.1.7: minimist "^1.2.0" strip-json-comments "~2.0.1" -"react-art@link:../../build/node_modules/react-art": +"react-art@link:../../build/oss-experimental/react-art": version "0.0.0" uid "" -"react-dom@link:../../build/node_modules/react-dom": +"react-dom@link:../../build/oss-experimental/react-dom": version "0.0.0" uid "" -"react@link:../../build/node_modules/react": +"react@link:../../build/oss-experimental/react": version "0.0.0" uid "" diff --git a/fixtures/attribute-behavior/package.json b/fixtures/attribute-behavior/package.json index e71f60ec2e112..09e5902491770 100644 --- a/fixtures/attribute-behavior/package.json +++ b/fixtures/attribute-behavior/package.json @@ -12,7 +12,7 @@ }, "scripts": { "prestart": - "cp ../../build/node_modules/react/umd/react.development.js public/ && cp ../../build/node_modules/react-dom/umd/react-dom.development.js public/ && cp ../../build/node_modules/react-dom/umd/react-dom-server-legacy.browser.development.js public/", + "cp ../../build/oss-experimental/react/umd/react.development.js public/ && cp ../../build/oss-experimental/react-dom/umd/react-dom.development.js public/ && cp ../../build/oss-experimental/react-dom/umd/react-dom-server-legacy.browser.development.js public/", "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", diff --git a/fixtures/concurrent/time-slicing/package.json b/fixtures/concurrent/time-slicing/package.json index 9fcfcae8d3df3..0e6f4f0b0ce85 100644 --- a/fixtures/concurrent/time-slicing/package.json +++ b/fixtures/concurrent/time-slicing/package.json @@ -11,7 +11,7 @@ "victory": "^0.25.6" }, "scripts": { - "copy-source": "cp -r ../../../build/node_modules/* ./node_modules/", + "copy-source": "cp -r ../../../build/oss-experimental/* ./node_modules/", "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", diff --git a/fixtures/devtools/scheduling-profiler/run.js b/fixtures/devtools/scheduling-profiler/run.js index 259755a366e43..5c0191acca3db 100755 --- a/fixtures/devtools/scheduling-profiler/run.js +++ b/fixtures/devtools/scheduling-profiler/run.js @@ -18,7 +18,7 @@ const DEPENDENCIES = [ ['react-dom/umd/react-dom.development.js', 'react-dom.js'], ]; -const BUILD_DIRECTORY = '../../../build/node_modules/'; +const BUILD_DIRECTORY = '../../../build/oss-experimental/'; const DEPENDENCIES_DIRECTORY = 'dependencies'; function initDependencies() { diff --git a/fixtures/eslint/proxy/index.js b/fixtures/eslint/proxy/index.js index 3c4be6ff345c1..f54e672d21126 100644 --- a/fixtures/eslint/proxy/index.js +++ b/fixtures/eslint/proxy/index.js @@ -16,7 +16,7 @@ function reload() { } } // Point to the built version. - build = require('../../../build/node_modules/eslint-plugin-react-hooks'); + build = require('../../../build/oss-experimental/eslint-plugin-react-hooks'); } let rules = {}; diff --git a/fixtures/expiration/package.json b/fixtures/expiration/package.json index 263812a1ee2de..f628d582b8fcf 100644 --- a/fixtures/expiration/package.json +++ b/fixtures/expiration/package.json @@ -9,7 +9,7 @@ }, "scripts": { "prestart": - "cp ../../build/node_modules/react/umd/react.development.js public/ && cp ../../build/node_modules/react-dom/umd/react-dom.development.js public/", + "cp ../../build/oss-experimental/react/umd/react.development.js public/ && cp ../../build/oss-experimental/react-dom/umd/react-dom.development.js public/", "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", diff --git a/fixtures/fiber-triangle/index.html b/fixtures/fiber-triangle/index.html index c7e22fdd4345e..d90e11093765d 100644 --- a/fixtures/fiber-triangle/index.html +++ b/fixtures/fiber-triangle/index.html @@ -16,8 +16,8 @@

Fiber Example

If you checked out the source from GitHub make sure to run npm run build.

- - + + - - + + + - - - - + + + + + - + +
- + +
- + +
- + + - + + diff --git a/package.json b/package.json index d243a6b926de6..0ed5aeb6485b3 100644 --- a/package.json +++ b/package.json @@ -109,8 +109,8 @@ "testRegex": "/scripts/jest/dont-run-jest-directly\\.js$" }, "scripts": { - "build": "node ./scripts/rollup/build.js", - "build-combined": "node ./scripts/rollup/build-all-release-channels.js", + "build": "node ./scripts/rollup/build-all-release-channels.js", + "build-combined": "echo 'build-combined is deprecated. yarn build instead.'", "build-for-devtools": "cross-env RELEASE_CHANNEL=experimental yarn build react/index,react/jsx,react-dom/index,react-dom/unstable_testing,react-dom/test-utils,react-is,react-debug-tools,scheduler,react-test-renderer,react-refresh,react-art --type=NODE && cp -r ./build/node_modules build/oss-experimental/", "build-for-devtools-dev": "yarn build-for-devtools --type=NODE_DEV", "build-for-devtools-prod": "yarn build-for-devtools --type=NODE_PROD", @@ -145,7 +145,7 @@ "publish-prereleases": "node ./scripts/release/publish-using-ci-workflow.js", "download-build": "node ./scripts/release/download-experimental-build.js", "download-build-for-head": "node ./scripts/release/download-experimental-build.js --commit=$(git rev-parse HEAD)", - "download-build-in-codesandbox-ci": "cd scripts/release && yarn install && cd ../../ && yarn download-build-for-head || yarn build-combined --type=node react/index react-dom/index react-dom/src/server react-dom/test-utils scheduler/index react/jsx-runtime react/jsx-dev-runtime", + "download-build-in-codesandbox-ci": "cd scripts/release && yarn install && cd ../../ && yarn download-build-for-head || yarn build --type=node react/index react-dom/index react-dom/src/server react-dom/test-utils scheduler/index react/jsx-runtime react/jsx-dev-runtime", "check-release-dependencies": "node ./scripts/release/check-release-dependencies", "generate-inline-fizz-runtime": "node ./scripts/rollup/generate-inline-fizz-runtime.js" }, diff --git a/packages/jest-react/src/internalAct.js b/packages/jest-react/src/internalAct.js index 5d87891e7109e..da7e9f6108490 100644 --- a/packages/jest-react/src/internalAct.js +++ b/packages/jest-react/src/internalAct.js @@ -128,6 +128,7 @@ function flushActWork(resolve: () => void, reject: (error: any) => void) { Scheduler.unstable_flushUntilNextPaint(); } catch (error) { reject(error); + return; } // If Scheduler yields while there's still work, it's so that we can diff --git a/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-bun.js b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-bun.js index 4aae8141fd56e..4bcb94fc76962 100644 --- a/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-bun.js +++ b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-bun.js @@ -9,4 +9,11 @@ export * from 'react-client/src/ReactFlightClientHostConfigBrowser'; export * from 'react-client/src/ReactFlightClientHostConfigStream'; -export * from 'react-server-dom-webpack/src/ReactFlightClientWebpackBundlerConfig'; + +export type Response = any; +export opaque type BundlerConfig = mixed; +export opaque type ClientReferenceMetadata = mixed; +export opaque type ClientReference = mixed; // eslint-disable-line no-unused-vars +export const resolveClientReference: any = null; +export const preloadModule: any = null; +export const requireModule: any = null; diff --git a/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-edge.js b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-edge-webpack.js similarity index 100% rename from packages/react-client/src/forks/ReactFlightClientHostConfig.dom-edge.js rename to packages/react-client/src/forks/ReactFlightClientHostConfig.dom-edge-webpack.js diff --git a/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-node-webpack.js b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-node-webpack.js new file mode 100644 index 0000000000000..4aae8141fd56e --- /dev/null +++ b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-node-webpack.js @@ -0,0 +1,12 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from 'react-client/src/ReactFlightClientHostConfigBrowser'; +export * from 'react-client/src/ReactFlightClientHostConfigStream'; +export * from 'react-server-dom-webpack/src/ReactFlightClientWebpackBundlerConfig'; diff --git a/packages/react-devtools-core/package.json b/packages/react-devtools-core/package.json index 91a3760f6e426..21aca978306f7 100644 --- a/packages/react-devtools-core/package.json +++ b/packages/react-devtools-core/package.json @@ -1,6 +1,6 @@ { "name": "react-devtools-core", - "version": "4.27.1", + "version": "4.27.2", "description": "Use react-devtools outside of the browser", "license": "MIT", "main": "./dist/backend.js", diff --git a/packages/react-devtools-extensions/chrome/manifest.json b/packages/react-devtools-extensions/chrome/manifest.json index 444becd988ae8..c994cd8b25c53 100644 --- a/packages/react-devtools-extensions/chrome/manifest.json +++ b/packages/react-devtools-extensions/chrome/manifest.json @@ -2,8 +2,8 @@ "manifest_version": 3, "name": "React Developer Tools", "description": "Adds React debugging tools to the Chrome Developer Tools.", - "version": "4.27.1", - "version_name": "4.27.1", + "version": "4.27.2", + "version_name": "4.27.2", "minimum_chrome_version": "88", "icons": { "16": "icons/16-production.png", diff --git a/packages/react-devtools-extensions/edge/manifest.json b/packages/react-devtools-extensions/edge/manifest.json index 2ecad6f6f928a..ca529554f7689 100644 --- a/packages/react-devtools-extensions/edge/manifest.json +++ b/packages/react-devtools-extensions/edge/manifest.json @@ -2,8 +2,8 @@ "manifest_version": 3, "name": "React Developer Tools", "description": "Adds React debugging tools to the Microsoft Edge Developer Tools.", - "version": "4.27.1", - "version_name": "4.27.1", + "version": "4.27.2", + "version_name": "4.27.2", "minimum_chrome_version": "88", "icons": { "16": "icons/16-production.png", diff --git a/packages/react-devtools-extensions/firefox/manifest.json b/packages/react-devtools-extensions/firefox/manifest.json index 4566db908e8a3..581d31610b01c 100644 --- a/packages/react-devtools-extensions/firefox/manifest.json +++ b/packages/react-devtools-extensions/firefox/manifest.json @@ -2,7 +2,7 @@ "manifest_version": 2, "name": "React Developer Tools", "description": "Adds React debugging tools to the Firefox Developer Tools.", - "version": "4.27.1", + "version": "4.27.2", "applications": { "gecko": { "id": "@react-devtools", diff --git a/packages/react-devtools-inline/package.json b/packages/react-devtools-inline/package.json index d29437849ca47..91399de9f6ddf 100644 --- a/packages/react-devtools-inline/package.json +++ b/packages/react-devtools-inline/package.json @@ -1,6 +1,6 @@ { "name": "react-devtools-inline", - "version": "4.27.1", + "version": "4.27.2", "description": "Embed react-devtools within a website", "license": "MIT", "main": "./dist/backend.js", diff --git a/packages/react-devtools-timeline/package.json b/packages/react-devtools-timeline/package.json index 1f86b2540271b..733cc40354c47 100644 --- a/packages/react-devtools-timeline/package.json +++ b/packages/react-devtools-timeline/package.json @@ -1,7 +1,7 @@ { "private": true, "name": "react-devtools-timeline", - "version": "4.27.1", + "version": "4.27.2", "license": "MIT", "dependencies": { "@elg/speedscope": "1.9.0-a6f84db", diff --git a/packages/react-devtools/CHANGELOG.md b/packages/react-devtools/CHANGELOG.md index aefd1dbb73704..667c9608ed88a 100644 --- a/packages/react-devtools/CHANGELOG.md +++ b/packages/react-devtools/CHANGELOG.md @@ -4,6 +4,15 @@ --- +### 4.27.2 +February 16, 2023 + +* Replace DevTools `semver` usages with `compare-versions` for smaller bundle size ([markerikson](https://github.com/markerikson) in [#26122](https://github.com/facebook/react/pull/26122)) +* Support highlights for React Native apps in dev tools ([ryancat](https://github.com/ryancat) in [#26060](https://github.com/facebook/react/pull/26060)) +* improve error handling in extension ([mondaychen](https://github.com/mondaychen) in [#26068](https://github.com/facebook/react/pull/26068)) + +--- + ### 4.27.1 December 6, 2022 diff --git a/packages/react-devtools/app.js b/packages/react-devtools/app.js index 14304f2fdb1e4..4b4f22ab32a49 100644 --- a/packages/react-devtools/app.js +++ b/packages/react-devtools/app.js @@ -3,8 +3,6 @@ * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. - * - * @flow */ const {app, BrowserWindow} = require('electron'); // Module to create native browser window. @@ -40,17 +38,12 @@ app.on('ready', function () { } // https://stackoverflow.com/questions/32402327/ - // $FlowFixMe[incompatible-use] found when upgrading Flow - mainWindow.webContents.on( - 'new-window', - function (event: $FlowFixMe, url: $FlowFixMe) { - event.preventDefault(); - require('electron').shell.openExternal(url); - }, - ); + mainWindow.webContents.on('new-window', function (event, url) { + event.preventDefault(); + require('electron').shell.openExternal(url); + }); // and load the index.html of the app. - // $FlowFixMe[incompatible-use] found when upgrading Flow mainWindow.loadURL('file://' + __dirname + '/app.html'); // eslint-disable-line no-path-concat // $FlowFixMe[incompatible-use] found when upgrading Flow mainWindow.webContents.executeJavaScript( @@ -61,7 +54,6 @@ app.on('ready', function () { ); // Emitted when the window is closed. - // $FlowFixMe[incompatible-use] found when upgrading Flow mainWindow.on('closed', function () { mainWindow = null; }); diff --git a/packages/react-devtools/package.json b/packages/react-devtools/package.json index d866ead7dc5a5..70d7650cf489d 100644 --- a/packages/react-devtools/package.json +++ b/packages/react-devtools/package.json @@ -1,6 +1,6 @@ { "name": "react-devtools", - "version": "4.27.1", + "version": "4.27.2", "description": "Use react-devtools outside of the browser", "license": "MIT", "repository": { @@ -26,7 +26,7 @@ "electron": "^11.1.0", "ip": "^1.1.4", "minimist": "^1.2.3", - "react-devtools-core": "4.27.1", + "react-devtools-core": "4.27.2", "update-notifier": "^2.1.0" } } diff --git a/packages/react-dom-bindings/src/shared/CSSProperty.js b/packages/react-dom-bindings/src/shared/CSSProperty.js index 158c533cbbe62..5952aca573fa1 100644 --- a/packages/react-dom-bindings/src/shared/CSSProperty.js +++ b/packages/react-dom-bindings/src/shared/CSSProperty.js @@ -40,6 +40,7 @@ export const isUnitlessNumber = { opacity: true, order: true, orphans: true, + scale: true, tabSize: true, widows: true, zIndex: true, diff --git a/packages/react-dom/src/__tests__/ReactDOMInput-test.js b/packages/react-dom/src/__tests__/ReactDOMInput-test.js index 7fe9bb1728de1..64ee09f09abe1 100644 --- a/packages/react-dom/src/__tests__/ReactDOMInput-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMInput-test.js @@ -1880,13 +1880,7 @@ describe('ReactDOMInput', () => { node.focus(); setUntrackedValue.call(node, '2'); dispatchEventOnNode(node, 'input'); - // TODO: it is unclear why blur must be triggered twice, - // manual testing in the fixtures shows that the active element - // is no longer the input, however blur() + a blur event seem to - // be the only way to remove focus in JSDOM node.blur(); - dispatchEventOnNode(node, 'blur'); - dispatchEventOnNode(node, 'focusout'); if (disableInputAttributeSyncing) { expect(node.value).toBe('2'); @@ -1906,13 +1900,7 @@ describe('ReactDOMInput', () => { node.focus(); setUntrackedValue.call(node, 4); dispatchEventOnNode(node, 'input'); - // TODO: it is unclear why blur must be triggered twice, - // manual testing in the fixtures shows that the active element - // is no longer the input, however blur() + a blur event seem to - // be the only way to remove focus in JSDOM node.blur(); - dispatchEventOnNode(node, 'blur'); - dispatchEventOnNode(node, 'focusout'); expect(node.getAttribute('value')).toBe('1'); }); @@ -1926,13 +1914,7 @@ describe('ReactDOMInput', () => { node.focus(); setUntrackedValue.call(node, 4); dispatchEventOnNode(node, 'input'); - // TODO: it is unclear why blur must be triggered twice, - // manual testing in the fixtures shows that the active element - // is no longer the input, however blur() + a blur event seem to - // be the only way to remove focus in JSDOM node.blur(); - dispatchEventOnNode(node, 'blur'); - dispatchEventOnNode(node, 'focusout'); expect(node.getAttribute('value')).toBe('1'); }); diff --git a/packages/react-dom/src/__tests__/ReactTestUtils-test.js b/packages/react-dom/src/__tests__/ReactTestUtils-test.js index 88ede731edca9..3394bf4b737d7 100644 --- a/packages/react-dom/src/__tests__/ReactTestUtils-test.js +++ b/packages/react-dom/src/__tests__/ReactTestUtils-test.js @@ -463,4 +463,19 @@ describe('ReactTestUtils', () => { ReactTestUtils.renderIntoDocument(); expect(mockArgs.length).toEqual(0); }); + it('should find rendered component with type in document', () => { + class MyComponent extends React.Component { + render() { + return true; + } + } + + const instance = ReactTestUtils.renderIntoDocument(); + const renderedComponentType = ReactTestUtils.findRenderedComponentWithType( + instance, + MyComponent, + ); + + expect(renderedComponentType).toBe(instance); + }); }); diff --git a/packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-edge.js b/packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-edge-webpack.js similarity index 100% rename from packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-edge.js rename to packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-edge-webpack.js diff --git a/packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-node-webpack.js b/packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-node-webpack.js new file mode 100644 index 0000000000000..aae45be9aae50 --- /dev/null +++ b/packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-node-webpack.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from 'react-dom-bindings/src/client/ReactDOMHostConfig'; diff --git a/packages/react-server-dom-webpack/client.browser.js b/packages/react-server-dom-webpack/client.browser.js new file mode 100644 index 0000000000000..9b9c654fb5804 --- /dev/null +++ b/packages/react-server-dom-webpack/client.browser.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from './src/ReactFlightDOMClient'; diff --git a/packages/react-server-dom-webpack/client.edge.js b/packages/react-server-dom-webpack/client.edge.js new file mode 100644 index 0000000000000..9b9c654fb5804 --- /dev/null +++ b/packages/react-server-dom-webpack/client.edge.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from './src/ReactFlightDOMClient'; diff --git a/packages/react-server-dom-webpack/client.js b/packages/react-server-dom-webpack/client.js index 9b9c654fb5804..2dad5bb513872 100644 --- a/packages/react-server-dom-webpack/client.js +++ b/packages/react-server-dom-webpack/client.js @@ -7,4 +7,4 @@ * @flow */ -export * from './src/ReactFlightDOMClient'; +export * from './client.browser'; diff --git a/packages/react-server-dom-webpack/client.node.js b/packages/react-server-dom-webpack/client.node.js new file mode 100644 index 0000000000000..9b9c654fb5804 --- /dev/null +++ b/packages/react-server-dom-webpack/client.node.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from './src/ReactFlightDOMClient'; diff --git a/packages/react-server-dom-webpack/client.node.unbundled.js b/packages/react-server-dom-webpack/client.node.unbundled.js new file mode 100644 index 0000000000000..9b9c654fb5804 --- /dev/null +++ b/packages/react-server-dom-webpack/client.node.unbundled.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from './src/ReactFlightDOMClient'; diff --git a/packages/react-server-dom-webpack/npm/client.browser.js b/packages/react-server-dom-webpack/npm/client.browser.js new file mode 100644 index 0000000000000..9a80cea84cbb8 --- /dev/null +++ b/packages/react-server-dom-webpack/npm/client.browser.js @@ -0,0 +1,7 @@ +'use strict'; + +if (process.env.NODE_ENV === 'production') { + module.exports = require('./cjs/react-server-dom-webpack-client.browser.production.min.js'); +} else { + module.exports = require('./cjs/react-server-dom-webpack-client.browser.development.js'); +} diff --git a/packages/react-server-dom-webpack/npm/client.edge.js b/packages/react-server-dom-webpack/npm/client.edge.js new file mode 100644 index 0000000000000..661caffa755ba --- /dev/null +++ b/packages/react-server-dom-webpack/npm/client.edge.js @@ -0,0 +1,7 @@ +'use strict'; + +if (process.env.NODE_ENV === 'production') { + module.exports = require('./cjs/react-server-dom-webpack-client.edge.production.min.js'); +} else { + module.exports = require('./cjs/react-server-dom-webpack-client.edge.development.js'); +} diff --git a/packages/react-server-dom-webpack/npm/client.js b/packages/react-server-dom-webpack/npm/client.js index b8e9a99ec5e80..89d93a7a7920f 100644 --- a/packages/react-server-dom-webpack/npm/client.js +++ b/packages/react-server-dom-webpack/npm/client.js @@ -1,7 +1,3 @@ 'use strict'; -if (process.env.NODE_ENV === 'production') { - module.exports = require('./cjs/react-server-dom-webpack-client.production.min.js'); -} else { - module.exports = require('./cjs/react-server-dom-webpack-client.development.js'); -} +module.exports = require('./client.browser'); diff --git a/packages/react-server-dom-webpack/npm/client.node.js b/packages/react-server-dom-webpack/npm/client.node.js new file mode 100644 index 0000000000000..cb7dbcf4c34f7 --- /dev/null +++ b/packages/react-server-dom-webpack/npm/client.node.js @@ -0,0 +1,7 @@ +'use strict'; + +if (process.env.NODE_ENV === 'production') { + module.exports = require('./cjs/react-server-dom-webpack-client.node.production.min.js'); +} else { + module.exports = require('./cjs/react-server-dom-webpack-client.node.development.js'); +} diff --git a/packages/react-server-dom-webpack/npm/client.node.unbundled.js b/packages/react-server-dom-webpack/npm/client.node.unbundled.js new file mode 100644 index 0000000000000..17fe876fd388a --- /dev/null +++ b/packages/react-server-dom-webpack/npm/client.node.unbundled.js @@ -0,0 +1,7 @@ +'use strict'; + +if (process.env.NODE_ENV === 'production') { + module.exports = require('./cjs/react-server-dom-webpack-client.node.unbundled.production.min.js'); +} else { + module.exports = require('./cjs/react-server-dom-webpack-client.node.unbundled.development.js'); +} diff --git a/packages/react-server-dom-webpack/npm/server.node.unbundled.js b/packages/react-server-dom-webpack/npm/server.node.unbundled.js new file mode 100644 index 0000000000000..5f75de80942a2 --- /dev/null +++ b/packages/react-server-dom-webpack/npm/server.node.unbundled.js @@ -0,0 +1,7 @@ +'use strict'; + +if (process.env.NODE_ENV === 'production') { + module.exports = require('./cjs/react-server-dom-webpack-server.node.unbundled.production.min.js'); +} else { + module.exports = require('./cjs/react-server-dom-webpack-server.node.unbundled.development.js'); +} diff --git a/packages/react-server-dom-webpack/package.json b/packages/react-server-dom-webpack/package.json index 8bf5e8c18e19e..e1a0945b1d089 100644 --- a/packages/react-server-dom-webpack/package.json +++ b/packages/react-server-dom-webpack/package.json @@ -14,10 +14,15 @@ "index.js", "plugin.js", "client.js", + "client.browser.js", + "client.edge.js", + "client.node.js", + "client.node.unbundled.js", "server.js", "server.browser.js", "server.edge.js", "server.node.js", + "server.node.unbundled.js", "node-register.js", "cjs/", "umd/", @@ -26,13 +31,31 @@ "exports": { ".": "./index.js", "./plugin": "./plugin.js", - "./client": "./client.js", + "./client": { + "workerd": "./client.edge.js", + "edge-light": "./client.edge.js", + "deno": "./client.edge.js", + "worker": "./client.edge.js", + "node": { + "webpack": "./client.node.js", + "default": "./client.node.unbundled.js" + }, + "browser": "./client.browser.js", + "default": "./client.browser.js" + }, + "./client.browser": "./client.browser.js", + "./client.edge": "./client.edge.js", + "./client.node": "./client.node.js", + "./client.node.unbundled": "./client.node.unbundled.js", "./server": { "react-server": { - "edge-light": "./server.edge.js", "workerd": "./server.edge.js", + "edge-light": "./server.edge.js", "deno": "./server.browser.js", - "node": "./server.node.js", + "node": { + "webpack": "./server.node.js", + "default": "./server.node.unbundled.js" + }, "browser": "./server.browser.js" }, "default": "./server.js" @@ -40,6 +63,7 @@ "./server.browser": "./server.browser.js", "./server.edge": "./server.edge.js", "./server.node": "./server.node.js", + "./server.node.unbundled": "./server.node.unbundled.js", "./node-loader": "./esm/react-server-dom-webpack-node-loader.js", "./node-register": "./node-register.js", "./src/*": "./src/*", diff --git a/packages/react-server-dom-webpack/server.node.unbundled.js b/packages/react-server-dom-webpack/server.node.unbundled.js new file mode 100644 index 0000000000000..7726b9bb929d4 --- /dev/null +++ b/packages/react-server-dom-webpack/server.node.unbundled.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from './src/ReactFlightDOMServerNode'; diff --git a/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js b/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js index c40d6b1f56057..987a803f64431 100644 --- a/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js +++ b/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js @@ -40,7 +40,7 @@ class ClientReferenceDependency extends ModuleDependency { // without the client runtime so it's the first time in the loading sequence // you might want them. const clientImportName = 'react-server-dom-webpack/client'; -const clientFileName = require.resolve('../client'); +const clientFileName = require.resolve('../client.browser.js'); type ClientReferenceSearchPath = { directory: string, diff --git a/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js b/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js index 54ae52f90554a..4c1b0f7585000 100644 --- a/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js +++ b/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js @@ -45,7 +45,7 @@ describe('ReactFlightDOM', () => { use = React.use; Suspense = React.Suspense; ReactDOMClient = require('react-dom/client'); - ReactServerDOMWriter = require('react-server-dom-webpack/server.node'); + ReactServerDOMWriter = require('react-server-dom-webpack/server.node.unbundled'); ReactServerDOMReader = require('react-server-dom-webpack/client'); ErrorBoundary = class extends React.Component { diff --git a/packages/react-server/src/forks/ReactFlightServerConfig.dom-bun.js b/packages/react-server/src/forks/ReactFlightServerConfig.dom-bun.js index 99c541a937d63..f85cfb5f78b25 100644 --- a/packages/react-server/src/forks/ReactFlightServerConfig.dom-bun.js +++ b/packages/react-server/src/forks/ReactFlightServerConfig.dom-bun.js @@ -8,4 +8,4 @@ */ export * from '../ReactFlightServerConfigStream'; -export * from 'react-server-dom-webpack/src/ReactFlightServerWebpackBundlerConfig'; +export * from '../ReactFlightServerBundlerConfigCustom'; diff --git a/packages/react-server/src/forks/ReactFlightServerConfig.dom-edge.js b/packages/react-server/src/forks/ReactFlightServerConfig.dom-edge-webpack.js similarity index 100% rename from packages/react-server/src/forks/ReactFlightServerConfig.dom-edge.js rename to packages/react-server/src/forks/ReactFlightServerConfig.dom-edge-webpack.js diff --git a/packages/react-server/src/forks/ReactFlightServerConfig.dom-node-webpack.js b/packages/react-server/src/forks/ReactFlightServerConfig.dom-node-webpack.js new file mode 100644 index 0000000000000..99c541a937d63 --- /dev/null +++ b/packages/react-server/src/forks/ReactFlightServerConfig.dom-node-webpack.js @@ -0,0 +1,11 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from '../ReactFlightServerConfigStream'; +export * from 'react-server-dom-webpack/src/ReactFlightServerWebpackBundlerConfig'; diff --git a/packages/react-server/src/forks/ReactServerFormatConfig.dom-edge.js b/packages/react-server/src/forks/ReactServerFormatConfig.dom-edge-webpack.js similarity index 100% rename from packages/react-server/src/forks/ReactServerFormatConfig.dom-edge.js rename to packages/react-server/src/forks/ReactServerFormatConfig.dom-edge-webpack.js diff --git a/packages/react-server/src/forks/ReactServerFormatConfig.dom-node-webpack.js b/packages/react-server/src/forks/ReactServerFormatConfig.dom-node-webpack.js new file mode 100644 index 0000000000000..485793a6893ee --- /dev/null +++ b/packages/react-server/src/forks/ReactServerFormatConfig.dom-node-webpack.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig'; diff --git a/packages/react-server/src/forks/ReactServerStreamConfig.dom-edge.js b/packages/react-server/src/forks/ReactServerStreamConfig.dom-edge-webpack.js similarity index 100% rename from packages/react-server/src/forks/ReactServerStreamConfig.dom-edge.js rename to packages/react-server/src/forks/ReactServerStreamConfig.dom-edge-webpack.js diff --git a/packages/react-server/src/forks/ReactServerStreamConfig.dom-node-webpack.js b/packages/react-server/src/forks/ReactServerStreamConfig.dom-node-webpack.js new file mode 100644 index 0000000000000..1a3871aef2e8b --- /dev/null +++ b/packages/react-server/src/forks/ReactServerStreamConfig.dom-node-webpack.js @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +export * from '../ReactServerStreamConfigNode'; diff --git a/packages/shared/forks/ReactFeatureFlags.www-dynamic.js b/packages/shared/forks/ReactFeatureFlags.www-dynamic.js index c9e353f2baef0..42e9c8a7ab2f4 100644 --- a/packages/shared/forks/ReactFeatureFlags.www-dynamic.js +++ b/packages/shared/forks/ReactFeatureFlags.www-dynamic.js @@ -26,6 +26,8 @@ export const enableUnifiedSyncLane = __VARIANT__; export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = __VARIANT__; export const enableTransitionTracing = __VARIANT__; +export const enableCustomElementPropertySupport = __VARIANT__; + // Enable this flag to help with concurrent mode debugging. // It logs information to the console about React scheduling, rendering, and commit phases. // diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index 83e3f877c7f1a..edbc49557aaa6 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -32,6 +32,7 @@ export const { enableUnifiedSyncLane, enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay, enableTransitionTracing, + enableCustomElementPropertySupport, } = dynamicFeatureFlags; // On WWW, __EXPERIMENTAL__ is used for a new modern build. @@ -100,8 +101,6 @@ export const enableServerContext = true; // Some www surfaces are still using this. Remove once they have been migrated. export const enableUseMutableSource = true; -export const enableCustomElementPropertySupport = __EXPERIMENTAL__; - export const useModernStrictMode = false; export const enableFizzExternalRuntime = true; diff --git a/scripts/jest/jest-cli.js b/scripts/jest/jest-cli.js index 4aaf59ba728f8..fbd55ab2a5d3f 100644 --- a/scripts/jest/jest-cli.js +++ b/scripts/jest/jest-cli.js @@ -255,7 +255,7 @@ function validateOptions() { const buildDir = path.resolve('./build'); if (!fs.existsSync(buildDir)) { logError( - 'Build directory does not exist, please run `yarn build-combined` or remove the --build option.' + 'Build directory does not exist, please run `yarn build` or remove the --build option.' ); success = false; } else if (Date.now() - fs.statSync(buildDir).mtimeMs > 1000 * 60 * 15) { diff --git a/scripts/rollup/bundles.js b/scripts/rollup/bundles.js index e048f6818349e..5a0f140a84a00 100644 --- a/scripts/rollup/bundles.js +++ b/scripts/rollup/bundles.js @@ -357,6 +357,15 @@ const bundles = [ wrapWithModuleBoundaries: false, externals: ['react', 'util', 'async_hooks', 'react-dom'], }, + { + bundleTypes: [NODE_DEV, NODE_PROD], + moduleType: RENDERER, + entry: 'react-server-dom-webpack/server.node.unbundled', + global: 'ReactServerDOMServer', + minifyWithProdErrorCodes: false, + wrapWithModuleBoundaries: false, + externals: ['react', 'util', 'async_hooks', 'react-dom'], + }, { bundleTypes: [NODE_DEV, NODE_PROD], moduleType: RENDERER, @@ -371,7 +380,34 @@ const bundles = [ { bundleTypes: [NODE_DEV, NODE_PROD, UMD_DEV, UMD_PROD], moduleType: RENDERER, - entry: 'react-server-dom-webpack/client', + entry: 'react-server-dom-webpack/client.browser', + global: 'ReactServerDOMClient', + minifyWithProdErrorCodes: false, + wrapWithModuleBoundaries: false, + externals: ['react'], + }, + { + bundleTypes: [NODE_DEV, NODE_PROD], + moduleType: RENDERER, + entry: 'react-server-dom-webpack/client.node', + global: 'ReactServerDOMClient', + minifyWithProdErrorCodes: false, + wrapWithModuleBoundaries: false, + externals: ['react'], + }, + { + bundleTypes: [NODE_DEV, NODE_PROD], + moduleType: RENDERER, + entry: 'react-server-dom-webpack/client.node.unbundled', + global: 'ReactServerDOMClient', + minifyWithProdErrorCodes: false, + wrapWithModuleBoundaries: false, + externals: ['react'], + }, + { + bundleTypes: [NODE_DEV, NODE_PROD], + moduleType: RENDERER, + entry: 'react-server-dom-webpack/client.edge', global: 'ReactServerDOMClient', minifyWithProdErrorCodes: false, wrapWithModuleBoundaries: false, diff --git a/scripts/shared/inlinedHostConfigs.js b/scripts/shared/inlinedHostConfigs.js index 9a4a37539ab9b..4f79d5e6f8f9c 100644 --- a/scripts/shared/inlinedHostConfigs.js +++ b/scripts/shared/inlinedHostConfigs.js @@ -16,8 +16,8 @@ module.exports = [ 'react-dom/static.node', 'react-dom/server-rendering-stub', 'react-dom/unstable_server-external-runtime', - 'react-server-dom-webpack/server.node', - 'react-server-dom-webpack/client', + 'react-server-dom-webpack/server.node.unbundled', + 'react-server-dom-webpack/client.node.unbundled', ], paths: [ 'react-dom', @@ -30,9 +30,9 @@ module.exports = [ 'react-dom/src/server/ReactDOMFizzServerNode.js', // react-dom/server.node 'react-dom/src/server/ReactDOMFizzStaticNode.js', 'react-server-dom-webpack', - 'react-server-dom-webpack/client', + 'react-server-dom-webpack/client.node.unbundled', 'react-server-dom-webpack/server', - 'react-server-dom-webpack/server.node', + 'react-server-dom-webpack/server.node.unbundled', 'react-server-dom-webpack/src/ReactFlightDOMServerNode.js', // react-server-dom-webpack/server.node 'react-client/src/ReactFlightClientStream.js', // We can only type check this in streaming configurations. 'react-devtools', @@ -50,15 +50,9 @@ module.exports = [ entryPoints: ['react-dom', 'react-dom/src/server/ReactDOMFizzServerBun.js'], paths: [ 'react-dom', - 'react-dom/server', 'react-dom/server.bun', 'react-dom/src/server/ReactDOMFizzServerBun.js', 'react-dom-bindings', - 'react-dom/server.node', - 'react-server-dom-webpack', - 'react-server-dom-webpack/client', - 'react-server-dom-webpack/server', - 'react-client/src/ReactFlightClientStream.js', // We can only type check this in streaming configurations. 'shared/ReactDOMSharedInternals', ], isFlowTyped: true, @@ -74,7 +68,7 @@ module.exports = [ 'react-dom/server-rendering-stub', 'react-dom/unstable_server-external-runtime', 'react-server-dom-webpack/server.browser', - 'react-server-dom-webpack/client', + 'react-server-dom-webpack/client.browser', ], paths: [ 'react-dom', @@ -87,6 +81,7 @@ module.exports = [ 'react-dom/src/server/ReactDOMFizzStaticBrowser.js', 'react-server-dom-webpack', 'react-server-dom-webpack/client', + 'react-server-dom-webpack/client.browser', 'react-server-dom-webpack/server.browser', 'react-server-dom-webpack/src/ReactFlightDOMServerBrowser.js', // react-server-dom-webpack/server.browser 'react-client/src/ReactFlightClientStream.js', // We can only type check this in streaming configurations. @@ -100,16 +95,12 @@ module.exports = [ isServerSupported: true, }, { - shortName: 'dom-edge', + shortName: 'dom-edge-webpack', entryPoints: [ - 'react-dom', - 'react-dom/unstable_testing', 'react-dom/src/server/ReactDOMFizzServerEdge.js', 'react-dom/static.edge', - 'react-dom/server-rendering-stub', - 'react-dom/unstable_server-external-runtime', 'react-server-dom-webpack/server.edge', - 'react-server-dom-webpack/client', + 'react-server-dom-webpack/client.edge', ], paths: [ 'react-dom', @@ -121,7 +112,7 @@ module.exports = [ 'react-dom/src/server/ReactDOMFizzServerEdge.js', // react-dom/server.edge 'react-dom/src/server/ReactDOMFizzStaticEdge.js', 'react-server-dom-webpack', - 'react-server-dom-webpack/client', + 'react-server-dom-webpack/client.edge', 'react-server-dom-webpack/server.edge', 'react-server-dom-webpack/src/ReactFlightDOMServerEdge.js', // react-server-dom-webpack/server.edge 'react-client/src/ReactFlightClientStream.js', // We can only type check this in streaming configurations. @@ -134,6 +125,38 @@ module.exports = [ isFlowTyped: true, isServerSupported: true, }, + { + shortName: 'dom-node-webpack', + entryPoints: [ + 'react-server-dom-webpack/server.node', + 'react-server-dom-webpack/client.node', + ], + paths: [ + 'react-dom', + 'react-dom-bindings', + 'react-dom/client', + 'react-dom/server', + 'react-dom/server.node', + 'react-dom/static', + 'react-dom/static.node', + 'react-dom/src/server/ReactDOMFizzServerNode.js', // react-dom/server.node + 'react-dom/src/server/ReactDOMFizzStaticNode.js', + 'react-server-dom-webpack', + 'react-server-dom-webpack/client.node', + 'react-server-dom-webpack/server', + 'react-server-dom-webpack/server.node', + 'react-server-dom-webpack/src/ReactFlightDOMServerNode.js', // react-server-dom-webpack/server.node + 'react-client/src/ReactFlightClientStream.js', // We can only type check this in streaming configurations. + 'react-devtools', + 'react-devtools-core', + 'react-devtools-shell', + 'react-devtools-shared', + 'react-interactions', + 'shared/ReactDOMSharedInternals', + ], + isFlowTyped: true, + isServerSupported: true, + }, { shortName: 'dom-legacy', entryPoints: [