[core] Add react-next workflow in CircleCI
#13360
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,112 @@ | ||
| /* eslint-disable no-console */ | ||
| /** | ||
| * Given the dist tag fetch the corresponding | ||
| * version and make sure this version is used throughout the repository. | ||
| * | ||
| * If you work on this file: | ||
| * WARNING: This script can only use built-in modules since it has to run before | ||
| * `pnpm install` | ||
| */ | ||
| import childProcess from 'child_process'; | ||
| import fs from 'fs'; | ||
| import os from 'os'; | ||
| import path from 'path'; | ||
| import { promisify } from 'util'; | ||
| import { getWorkspaceRoot } from './utils.mjs'; | ||
|
|
||
| // TODO: reuse the `useReactVersion.mjs` from the monorepo | ||
|
|
||
| const exec = promisify(childProcess.exec); | ||
|
|
||
| // packages published from the react monorepo using the same version | ||
| const reactPackageNames = ['react', 'react-dom', 'react-is', 'react-test-renderer', 'scheduler']; | ||
| const devDependenciesPackageNames = ['@mnajdova/enzyme-adapter-react-18', '@testing-library/react']; | ||
|
|
||
| // if we need to support more versions we will need to add new mapping here | ||
| const additionalVersionsMappings = { | ||
| 17: { | ||
| '@mnajdova/enzyme-adapter-react-18': 'npm:@eps1lon/enzyme-adapter-react-17', | ||
| '@testing-library/react': '^12.1.0', | ||
| }, | ||
| 19: {}, | ||
|
Member
There was a problem hiding this comment. Is it only this entry that warranted the need to duplicate this file instead of using the one from
Member
Author
There was a problem hiding this comment. That's one of the reasons.
Member
There was a problem hiding this comment.
That script will definitely return the monorepo root. |
||
| }; | ||
|
|
||
| async function main(version) { | ||
| if (typeof version !== 'string') { | ||
| throw new TypeError(`expected version: string but got '${version}'`); | ||
| } | ||
|
|
||
| if (version === 'stable') { | ||
| console.log('Nothing to do with stable'); | ||
| return; | ||
| } | ||
|
|
||
| const packageJsonPath = path.resolve(getWorkspaceRoot(), 'package.json'); | ||
| const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, { encoding: 'utf8' })); | ||
|
|
||
| // the version is something in format: "17.0.0" | ||
| let majorVersion = null; | ||
|
|
||
| if (version.startsWith('^') || version.startsWith('~') || !Number.isNaN(version.charAt(0))) { | ||
| majorVersion = version.replace('^', '').replace('~', '').split('.')[0]; | ||
| } | ||
|
|
||
| await Promise.all( | ||
| reactPackageNames.map(async (reactPackageName) => { | ||
| const { stdout: versions } = await exec(`npm dist-tag ls ${reactPackageName} ${version}`); | ||
| const tagMapping = versions.split('\n').find((mapping) => { | ||
| return mapping.startsWith(`${version}: `); | ||
| }); | ||
|
|
||
| let packageVersion = null; | ||
|
|
||
| if (tagMapping === undefined) { | ||
| // Some specific version is being requested | ||
| if (majorVersion) { | ||
| packageVersion = version; | ||
| if (reactPackageName === 'scheduler') { | ||
| // get the scheduler version from the react-dom's dependencies entry | ||
| const { stdout: reactDOMDependenciesString } = await exec( | ||
| `npm view --json react-dom@${version} dependencies`, | ||
| ); | ||
| packageVersion = JSON.parse(reactDOMDependenciesString).scheduler; | ||
| } | ||
| } else { | ||
| throw new Error(`Could not find '${version}' in "${versions}"`); | ||
| } | ||
| } else { | ||
| packageVersion = tagMapping.replace(`${version}: `, ''); | ||
| } | ||
|
|
||
| packageJson.resolutions[reactPackageName] = packageVersion; | ||
| }), | ||
| ); | ||
|
|
||
| // At this moment all dist tags reference React 18 version, so we don't need | ||
| // to update these dependencies unless an older version is used, or when the | ||
| // next/experimental dist tag reference to a future version of React | ||
| // packageJson.devDependencies['@mnajdova/enzyme-adapter-react-18'] = | ||
| // 'npm:@mnajdova/enzyme-adapter-react-next'; | ||
| // packageJson.devDependencies['@testing-library/react'] = 'alpha'; | ||
|
|
||
| if (majorVersion && additionalVersionsMappings[majorVersion]) { | ||
| devDependenciesPackageNames.forEach((packageName) => { | ||
| if (!additionalVersionsMappings[majorVersion][packageName]) { | ||
| throw new Error( | ||
| `Version ${majorVersion} does not have version defined for the ${packageName}`, | ||
| ); | ||
| } | ||
| packageJson.devDependencies[packageName] = | ||
| additionalVersionsMappings[majorVersion][packageName]; | ||
| }); | ||
| } | ||
|
|
||
| // add newline for clean diff | ||
| fs.writeFileSync(packageJsonPath, `${JSON.stringify(packageJson, null, 2)}${os.EOL}`); | ||
| } | ||
|
|
||
| const [version = process.env.REACT_VERSION] = process.argv.slice(2); | ||
| main(version).catch((error) => { | ||
| console.error(error); | ||
| process.exit(1); | ||
| }); | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,46 @@ | ||
| # Testing | ||
|
|
||
| ## Testing multiple versions of React | ||
|
|
||
| You can check integration of different versions of React (for example different [release channels](https://react.dev/community/versioning-policy) or PRs to React) by running the following commands: | ||
|
|
||
| 1. `node scripts/useReactVersion.mjs <version>`. | ||
|
|
||
| Possible values for `version`: | ||
|
|
||
| - default: `stable` (minimum supported React version) | ||
| - a tag on npm, for example `next`, `experimental` or `latest` | ||
| - an older version, for example `^17.0.0` | ||
|
|
||
| 2. `pnpm install` | ||
|
|
||
| ### CI | ||
|
|
||
| #### `next` version | ||
|
|
||
| For `react@next` specifically, there's a `react-next` workflow in our CircleCI pipeline that you can trigger in CircleCI on the PR you want to test: | ||
|
|
||
| 1. Go to https://app.circleci.com/pipelines/github/mui/mui-x?branch=pull/PR_NUMBER and replace `PR_NUMBER` with the PR number you want to test. | ||
| 2. Click `Trigger Pipeline` button. | ||
| 3. Expand `Add parameters (optional)` and add the following parameter: | ||
|
|
||
| | Parameter type | Name | Value | | ||
| | :------------- | :--------- | :----------- | | ||
| | `string` | `workflow` | `react-next` | | ||
|
|
||
| 4. Click `Trigger Pipeline` button. | ||
|
|
||
| #### Other versions | ||
|
|
||
| You can pass the same `version` to our CircleCI pipeline as well: | ||
|
|
||
| With the following API request we're triggering a run of the default workflow in | ||
| PR #24289 for `react@next` | ||
|
|
||
| ```bash | ||
| curl --request POST \ | ||
| --url https://circleci.com/api/v2/project/gh/mui/mui-x/pipeline \ | ||
| --header 'content-type: application/json' \ | ||
| --header 'Circle-Token: $CIRCLE_TOKEN' \ | ||
| --data-raw '{"branch":"pull/24289/head","parameters":{"react-version":"next"}}' | ||
| ``` |
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.