├── .alexignore ├── .alexrc ├── .eslintignore ├── .eslintrc.json ├── .gitattributes ├── .github ├── CODEOWNERS ├── FUNDING.yml ├── ISSUE_TEMPLATE │ ├── bug_report.md │ ├── proposal.md │ └── question.md ├── PULL_REQUEST_TEMPLATE.md ├── lock.yml ├── stale.yml └── workflows │ ├── build-and-test.yml │ ├── e2e-base.yml │ └── lint.yml ├── .gitignore ├── .prettierignore ├── .prettierrc ├── CHANGELOG-0.x.md ├── CHANGELOG-1.x.md ├── CHANGELOG-2.x.md ├── CHANGELOG-3.x.md ├── CHANGELOG-4.x.md ├── CHANGELOG.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── SECURITY.md ├── docusaurus ├── docs │ ├── adding-a-css-modules-stylesheet.md │ ├── adding-a-router.md │ ├── adding-a-sass-stylesheet.md │ ├── adding-a-stylesheet.md │ ├── adding-bootstrap.md │ ├── adding-css-reset.md │ ├── adding-custom-environment-variables.md │ ├── adding-flow.md │ ├── adding-images-fonts-and-files.md │ ├── adding-relay.md │ ├── adding-typescript.md │ ├── advanced-configuration.md │ ├── alternatives-to-ejecting.md │ ├── analyzing-the-bundle-size.md │ ├── available-scripts.md │ ├── can-i-use-decorators.md │ ├── code-splitting.md │ ├── custom-templates.md │ ├── debugging-tests.md │ ├── deployment.md │ ├── developing-components-in-isolation.md │ ├── documentation-intro.md │ ├── fetching-data-with-ajax-requests.md │ ├── folder-structure.md │ ├── getting-started.md │ ├── importing-a-component.md │ ├── installing-a-dependency.md │ ├── integrating-with-an-api-backend.md │ ├── loading-graphql-files.md │ ├── making-a-progressive-web-app.md │ ├── measuring-performance.md │ ├── post-processing-css.md │ ├── pre-rendering-into-static-html-files.md │ ├── production-build.md │ ├── proxying-api-requests-in-development.md │ ├── running-tests.md │ ├── setting-up-your-editor.md │ ├── supported-browsers-features.md │ ├── title-and-meta-tags.md │ ├── troubleshooting.md │ ├── updating-to-new-releases.md │ ├── using-global-variables.md │ ├── using-https-in-development.md │ └── using-the-public-folder.md └── website │ ├── .gitignore │ ├── README.md │ ├── docusaurus.config.js │ ├── package.json │ ├── sidebars.json │ ├── src │ ├── css │ │ └── custom.css │ └── pages │ │ ├── index.js │ │ └── styles.module.css │ └── static │ ├── CNAME │ └── img │ ├── docusaurus.svg │ ├── favicon │ └── favicon.ico │ ├── logo-og.png │ ├── logo.svg │ ├── oss_logo.png │ └── update.png ├── lerna.json ├── netlify.toml ├── package-lock.json ├── package.json ├── packages ├── babel-plugin-named-asset-import │ ├── LICENSE │ ├── index.js │ ├── index.test.js │ └── package.json ├── babel-preset-react-app │ ├── LICENSE │ ├── README.md │ ├── create.js │ ├── dependencies.js │ ├── dev.js │ ├── index.js │ ├── package.json │ ├── prod.js │ ├── test.js │ └── webpack-overrides.js ├── confusing-browser-globals │ ├── LICENSE │ ├── README.md │ ├── index.js │ ├── package.json │ └── test.js ├── cra-template-typescript │ ├── README.md │ ├── package.json │ ├── template.json │ └── template │ │ ├── README.md │ │ ├── gitignore │ │ ├── public │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── logo192.png │ │ ├── logo512.png │ │ ├── manifest.json │ │ └── robots.txt │ │ └── src │ │ ├── App.css │ │ ├── App.test.tsx │ │ ├── App.tsx │ │ ├── index.css │ │ ├── index.tsx │ │ ├── logo.svg │ │ ├── reportWebVitals.ts │ │ └── setupTests.ts ├── cra-template │ ├── README.md │ ├── package.json │ ├── template.json │ └── template │ │ ├── README.md │ │ ├── gitignore │ │ ├── public │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── logo192.png │ │ ├── logo512.png │ │ ├── manifest.json │ │ └── robots.txt │ │ └── src │ │ ├── App.css │ │ ├── App.js │ │ ├── App.test.js │ │ ├── index.css │ │ ├── index.js │ │ ├── logo.svg │ │ ├── reportWebVitals.js │ │ └── setupTests.js ├── create-react-app │ ├── LICENSE │ ├── README.md │ ├── __tests__ │ │ ├── .eslintrc │ │ └── getTemplateInstallPackage.test.js │ ├── createReactApp.js │ ├── index.js │ └── package.json ├── eslint-config-react-app │ ├── LICENSE │ ├── README.md │ ├── base.js │ ├── index.js │ ├── jest.js │ └── package.json ├── react-app-polyfill │ ├── LICENSE │ ├── README.md │ ├── ie11.js │ ├── ie9.js │ ├── jsdom.js │ ├── package.json │ └── stable.js ├── react-dev-utils │ ├── FileSizeReporter.js │ ├── ForkTsCheckerWarningWebpackPlugin.js │ ├── ForkTsCheckerWebpackPlugin.js │ ├── InlineChunkHtmlPlugin.js │ ├── InterpolateHtmlPlugin.js │ ├── LICENSE │ ├── ModuleNotFoundPlugin.js │ ├── ModuleScopePlugin.js │ ├── README.md │ ├── WebpackDevServerUtils.js │ ├── __tests__ │ │ ├── .eslintrc │ │ ├── getCSSModuleLocalIdent.test.js │ │ ├── getPublicUrlOrPath.test.js │ │ └── ignoredFiles.test.js │ ├── browsersHelper.js │ ├── chalk.js │ ├── checkRequiredFiles.js │ ├── clearConsole.js │ ├── crossSpawn.js │ ├── errorOverlayMiddleware.js │ ├── eslintFormatter.js │ ├── evalSourceMapMiddleware.js │ ├── formatWebpackMessages.js │ ├── getCSSModuleLocalIdent.js │ ├── getCacheIdentifier.js │ ├── getProcessForPort.js │ ├── getPublicUrlOrPath.js │ ├── globby.js │ ├── ignoredFiles.js │ ├── immer.js │ ├── launchEditor.js │ ├── launchEditorEndpoint.js │ ├── noopServiceWorkerMiddleware.js │ ├── openBrowser.js │ ├── openChrome.applescript │ ├── package.json │ ├── printBuildError.js │ ├── printHostingInstructions.js │ ├── redirectServedPathMiddleware.js │ ├── refreshOverlayInterop.js │ └── webpackHotDevClient.js ├── react-error-overlay │ ├── .babelrc │ ├── .flowconfig │ ├── .gitattributes │ ├── .gitignore │ ├── .npmignore │ ├── LICENSE │ ├── README.md │ ├── build.js │ ├── fixtures │ │ ├── bundle-default.json │ │ ├── bundle.json │ │ ├── bundle.mjs │ │ ├── bundle.mjs.map │ │ ├── bundle2.json │ │ ├── bundle_u.mjs │ │ ├── bundle_u.mjs.map │ │ ├── inline.es6.mjs │ │ ├── inline.mjs │ │ └── junk-inline.mjs │ ├── flow │ │ └── env.js │ ├── package.json │ ├── src │ │ ├── __tests__ │ │ │ ├── __snapshots__ │ │ │ │ ├── lines-around.js.snap │ │ │ │ ├── script-lines.js.snap │ │ │ │ ├── stack-frame.js.snap │ │ │ │ └── unmapper.js.snap │ │ │ ├── extract-source-map.js │ │ │ ├── get-source-map.js │ │ │ ├── lines-around.js │ │ │ ├── mapper.js │ │ │ ├── parser │ │ │ │ ├── __snapshots__ │ │ │ │ │ ├── chrome.js.snap │ │ │ │ │ ├── firefox.js.snap │ │ │ │ │ ├── react.js.snap │ │ │ │ │ └── safari.js.snap │ │ │ │ ├── chrome.js │ │ │ │ ├── firefox.js │ │ │ │ ├── generic.js │ │ │ │ ├── react.js │ │ │ │ └── safari.js │ │ │ ├── script-lines.js │ │ │ ├── setupJest.js │ │ │ ├── stack-frame.js │ │ │ └── unmapper.js │ │ ├── components │ │ │ ├── CloseButton.js │ │ │ ├── CodeBlock.js │ │ │ ├── Collapsible.js │ │ │ ├── ErrorOverlay.js │ │ │ ├── Footer.js │ │ │ ├── Header.js │ │ │ └── NavigationBar.js │ │ ├── containers │ │ │ ├── CompileErrorContainer.js │ │ │ ├── RuntimeError.js │ │ │ ├── RuntimeErrorContainer.js │ │ │ ├── StackFrame.js │ │ │ ├── StackFrameCodeBlock.js │ │ │ └── StackTrace.js │ │ ├── effects │ │ │ ├── proxyConsole.js │ │ │ ├── stackTraceLimit.js │ │ │ ├── unhandledError.js │ │ │ └── unhandledRejection.js │ │ ├── iframeScript.js │ │ ├── index.js │ │ ├── listenToRuntimeErrors.js │ │ ├── styles.js │ │ └── utils │ │ │ ├── dom │ │ │ ├── absolutifyCaret.js │ │ │ └── css.js │ │ │ ├── generateAnsiHTML.js │ │ │ ├── getLinesAround.js │ │ │ ├── getPrettyURL.js │ │ │ ├── getSourceMap.js │ │ │ ├── getStackFrames.js │ │ │ ├── isBultinErrorName.js │ │ │ ├── isInternalFile.js │ │ │ ├── mapper.js │ │ │ ├── parseCompileError.js │ │ │ ├── parser.js │ │ │ ├── stack-frame.js │ │ │ ├── unmapper.js │ │ │ └── warnings.js │ ├── webpack.config.iframe.js │ └── webpack.config.js └── react-scripts │ ├── .npmignore │ ├── LICENSE │ ├── README.md │ ├── bin │ └── react-scripts.js │ ├── config │ ├── env.js │ ├── getHttpsConfig.js │ ├── jest │ │ ├── babelTransform.js │ │ ├── cssTransform.js │ │ └── fileTransform.js │ ├── modules.js │ ├── paths.js │ ├── webpack.config.js │ ├── webpack │ │ └── persistentCache │ │ │ └── createEnvironmentHash.js │ └── webpackDevServer.config.js │ ├── fixtures │ └── kitchensink │ │ ├── package.json │ │ ├── template.json │ │ └── template │ │ ├── .env │ │ ├── .env.development │ │ ├── .env.local │ │ ├── .env.production │ │ ├── .flowconfig │ │ ├── README.md │ │ ├── gitignore │ │ ├── integration │ │ ├── config.test.js │ │ ├── env.test.js │ │ ├── initDOM.js │ │ ├── syntax.test.js │ │ └── webpack.test.js │ │ ├── jest.integration.config.js │ │ ├── jest.transform.js │ │ ├── jsconfig.json │ │ ├── public │ │ ├── favicon.ico │ │ └── index.html │ │ └── src │ │ ├── App.js │ │ ├── absoluteLoad.js │ │ ├── features │ │ ├── config │ │ │ ├── BaseUrl.js │ │ │ └── BaseUrl.test.js │ │ ├── env │ │ │ ├── ExpandEnvVariables.js │ │ │ ├── ExpandEnvVariables.test.js │ │ │ ├── FileEnvVariables.js │ │ │ ├── FileEnvVariables.test.js │ │ │ ├── PublicUrl.js │ │ │ ├── PublicUrl.test.js │ │ │ ├── ShellEnvVariables.js │ │ │ └── ShellEnvVariables.test.js │ │ ├── syntax │ │ │ ├── ArrayDestructuring.js │ │ │ ├── ArrayDestructuring.test.js │ │ │ ├── ArraySpread.js │ │ │ ├── ArraySpread.test.js │ │ │ ├── AsyncAwait.js │ │ │ ├── AsyncAwait.test.js │ │ │ ├── ClassProperties.js │ │ │ ├── ClassProperties.test.js │ │ │ ├── ComputedProperties.js │ │ │ ├── ComputedProperties.test.js │ │ │ ├── CustomInterpolation.js │ │ │ ├── CustomInterpolation.test.js │ │ │ ├── DefaultParameters.js │ │ │ ├── DefaultParameters.test.js │ │ │ ├── DestructuringAndAwait.js │ │ │ ├── DestructuringAndAwait.test.js │ │ │ ├── Generators.js │ │ │ ├── Generators.test.js │ │ │ ├── NullishCoalescing.js │ │ │ ├── NullishCoalescing.test.js │ │ │ ├── ObjectDestructuring.js │ │ │ ├── ObjectDestructuring.test.js │ │ │ ├── ObjectSpread.js │ │ │ ├── ObjectSpread.test.js │ │ │ ├── OptionalChaining.js │ │ │ ├── OptionalChaining.test.js │ │ │ ├── Promises.js │ │ │ ├── Promises.test.js │ │ │ ├── RestAndDefault.js │ │ │ ├── RestAndDefault.test.js │ │ │ ├── RestParameters.js │ │ │ ├── RestParameters.test.js │ │ │ ├── TemplateInterpolation.js │ │ │ └── TemplateInterpolation.test.js │ │ └── webpack │ │ │ ├── CssInclusion.js │ │ │ ├── CssInclusion.test.js │ │ │ ├── CssModulesInclusion.js │ │ │ ├── CssModulesInclusion.test.js │ │ │ ├── DynamicImport.js │ │ │ ├── DynamicImport.test.js │ │ │ ├── ImageInclusion.js │ │ │ ├── ImageInclusion.test.js │ │ │ ├── JsonInclusion.js │ │ │ ├── JsonInclusion.test.js │ │ │ ├── LinkedModules.js │ │ │ ├── LinkedModules.test.js │ │ │ ├── NoExtInclusion.js │ │ │ ├── NoExtInclusion.test.js │ │ │ ├── SassInclusion.js │ │ │ ├── SassInclusion.test.js │ │ │ ├── SassModulesInclusion.js │ │ │ ├── SassModulesInclusion.test.js │ │ │ ├── ScssInclusion.js │ │ │ ├── ScssInclusion.test.js │ │ │ ├── ScssModulesInclusion.js │ │ │ ├── ScssModulesInclusion.test.js │ │ │ ├── SvgComponent.js │ │ │ ├── SvgComponent.test.js │ │ │ ├── SvgInCss.js │ │ │ ├── SvgInCss.test.js │ │ │ ├── SvgInclusion.js │ │ │ ├── SvgInclusion.test.js │ │ │ ├── UnknownExtInclusion.js │ │ │ ├── UnknownExtInclusion.test.js │ │ │ └── assets │ │ │ ├── aFileWithExt.unknown │ │ │ ├── aFileWithoutExt │ │ │ ├── abstract.json │ │ │ ├── index.module.css │ │ │ ├── index.module.sass │ │ │ ├── index.module.scss │ │ │ ├── logo.svg │ │ │ ├── sass-styles.module.sass │ │ │ ├── sass-styles.sass │ │ │ ├── scss-styles.module.scss │ │ │ ├── scss-styles.scss │ │ │ ├── style.css │ │ │ ├── style.module.css │ │ │ ├── svg.css │ │ │ └── tiniest-cat.jpg │ │ ├── index.js │ │ └── subfolder │ │ └── lol.js │ ├── lib │ └── react-app.d.ts │ ├── package.json │ ├── scripts │ ├── build.js │ ├── eject.js │ ├── init.js │ ├── start.js │ ├── test.js │ └── utils │ │ ├── createJestConfig.js │ │ └── verifyTypeScriptSetup.js │ ├── template-typescript │ └── README.md │ └── template │ └── README.md ├── screencast-error.svg ├── screencast.svg ├── tasks ├── .gitignore ├── cra.js ├── e2e-behavior.sh ├── e2e-installs.sh ├── e2e-kitchensink-eject.sh ├── e2e-kitchensink.sh ├── e2e-old-node.sh ├── e2e-simple.sh ├── local-registry.sh ├── local-test.sh ├── publish.sh ├── screencast-start.js ├── screencast.js ├── screencast.sh └── verdaccio.yaml └── test ├── README.md ├── fixtures ├── __shared__ │ ├── template │ │ └── public │ │ │ └── index.html │ ├── test-setup.js │ └── util │ │ ├── scripts.js │ │ └── setup.js ├── boostrap-sass │ ├── index.test.js │ ├── package.json │ └── src │ │ ├── index.js │ │ └── index.sass ├── builds-with-multiple-runtimes │ ├── index.test.js │ ├── package.json │ └── src │ │ └── index.js ├── global-scss-asset-resolution │ ├── index.test.js │ ├── package.json │ └── src │ │ ├── images │ │ └── logo.svg │ │ ├── index.js │ │ └── index.scss ├── issue-5176-flow-class-properties │ ├── index.test.js │ ├── package.json │ └── src │ │ ├── App.js │ │ └── App.test.js ├── issue-5947-not-typescript │ ├── index.test.js │ └── package.json ├── jsconfig │ ├── index.test.js │ ├── jsconfig.json │ ├── package.json │ └── src │ │ ├── App.js │ │ ├── App.test.js │ │ ├── absoluteLoad.js │ │ └── index.js ├── mjs-support │ ├── __snapshots__ │ │ └── index.test.js.snap │ ├── index.test.js │ ├── package.json │ └── src │ │ ├── App.js │ │ └── index.js ├── relative-paths │ ├── index.test.js │ ├── package.json │ └── src │ │ ├── index.css │ │ ├── index.js │ │ └── logo.svg ├── typescript-advanced │ ├── index.test.js │ ├── package.json │ └── src │ │ ├── App.test.ts │ │ ├── App.tsx │ │ └── index.tsx ├── typescript-typecheck │ ├── index.test.js │ ├── package.json │ └── src │ │ ├── App.tsx │ │ └── index.tsx ├── typescript │ ├── index.test.js │ ├── package.json │ ├── src │ │ ├── App.test.ts │ │ ├── App.ts │ │ └── absoluteLoad.ts │ └── tsconfig.json └── webpack-message-formatting │ ├── __snapshots__ │ └── index.test.js.snap │ ├── index.test.js │ ├── package.json │ └── src │ ├── AppAliasUnknownExport.js │ ├── AppBabel.js │ ├── AppCss.css │ ├── AppCss.js │ ├── AppIncorrectCase.js │ ├── AppLintError.js │ ├── AppLintWarning.js │ ├── AppMissingPackage.js │ ├── AppNoDefault.js │ ├── AppOutOfScopeImport.js │ ├── AppSass.js │ ├── AppSass.scss │ ├── AppUnknownExport.js │ ├── AppUnknownFile.js │ ├── Export5.js │ ├── ExportNoDefault.js │ ├── FooExport.js │ └── index.js ├── integration └── create-react-app │ └── index.test.js └── jest.config.js /.alexignore: -------------------------------------------------------------------------------- 1 | build 2 | 3 | CHANGELOG* 4 | CODE_OF_CONDUCT.md 5 | -------------------------------------------------------------------------------- /.alexrc: -------------------------------------------------------------------------------- 1 | { 2 | "allow": [ 3 | "attacks", 4 | "colors", 5 | "conservative", 6 | "crashes", 7 | "executed", 8 | "executes", 9 | "execution", 10 | "failed", 11 | "hook", 12 | "host-hostess", 13 | "hostesses-hosts", 14 | "invalid", 15 | "remain", 16 | "watchman-watchwoman" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | build/ 3 | test/fixtures/webpack-message-formatting/src/AppBabel.js 4 | packages/react-error-overlay/lib/ 5 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | * text=auto eol=lf 2 | -------------------------------------------------------------------------------- /.github/CODEOWNERS: -------------------------------------------------------------------------------- 1 | packages/ @iansu @mrmckeb 2 | docusaurus/ @iansu @mrmckeb 3 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | open_collective: create-react-app 2 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/proposal.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Proposal 3 | about: Suggest an idea for improving Create React App 4 | labels: 'issue: proposal, needs triage' 5 | --- 6 | 7 | ### Is your proposal related to a problem? 8 | 9 | 13 | 14 | (Write your answer here.) 15 | 16 | ### Describe the solution you'd like 17 | 18 | 21 | 22 | (Describe your proposed solution here.) 23 | 24 | ### Describe alternatives you've considered 25 | 26 | 29 | 30 | (Write your answer here.) 31 | 32 | ### Additional context 33 | 34 | 38 | 39 | (Write your answer here.) 40 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/question.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Question 3 | about: Get help with Create React App 4 | labels: 'needs triage' 5 | --- 6 | 7 | If you have a general question about Create React App or about building an app with Create React App we encourage you to post in GitHub Discussions instead of this issue tracker. The maintainers and other community members can provide help and answer your questions there: https://github.com/facebook/create-react-app/discussions 8 | 9 | If you're looking for general information on using React, the React docs have a list of resources: https://reactjs.org/community/support.html 10 | 11 | If you've discovered a bug or would like to propose a change please use one of the other issue templates. 12 | 13 | Thanks! 14 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | 8 | -------------------------------------------------------------------------------- /.github/lock.yml: -------------------------------------------------------------------------------- 1 | # Configuration for lock-threads - https://github.com/dessant/lock-threads 2 | 3 | # Number of days of inactivity before a closed issue or pull request is locked 4 | daysUntilLock: 5 5 | 6 | # Issues and pull requests with these labels will not be locked. Set to `[]` to disable 7 | exemptLabels: [] 8 | 9 | # Do not comment when locking 10 | setLockReason: false 11 | lockComment: false 12 | -------------------------------------------------------------------------------- /.github/workflows/e2e-base.yml: -------------------------------------------------------------------------------- 1 | on: 2 | workflow_call: 3 | inputs: 4 | testScript: 5 | required: true 6 | type: string 7 | 8 | name: E2E 9 | 10 | jobs: 11 | test: 12 | name: 'Test (${{ matrix.os }}, Node ${{ matrix.node }})' 13 | runs-on: ${{ matrix.os }} 14 | strategy: 15 | fail-fast: false 16 | matrix: 17 | os: 18 | - 'ubuntu-latest' 19 | node: 20 | - '16' 21 | steps: 22 | - uses: actions/checkout@v3 23 | - uses: actions/setup-node@v3 24 | with: 25 | node-version: ${{ matrix.node }} 26 | cache: 'npm' 27 | - name: Install 28 | run: npm ci --prefer-offline 29 | - name: Initialize Global Git config 30 | run: | 31 | git config --global core.autocrlf false 32 | git config --global user.name "Create React App" 33 | git config --global user.email "cra@email.com" 34 | - name: Run tests 35 | run: ${{ inputs.testScript }} 36 | -------------------------------------------------------------------------------- /.github/workflows/lint.yml: -------------------------------------------------------------------------------- 1 | name: Lint 2 | 3 | on: [push, pull_request] 4 | 5 | jobs: 6 | lint: 7 | runs-on: ubuntu-latest 8 | steps: 9 | - uses: actions/checkout@v3 10 | - uses: actions/setup-node@v3 11 | with: 12 | node-version: '16' 13 | cache: 'npm' 14 | - name: Install 15 | run: npm ci --prefer-offline 16 | - name: Alex 17 | run: npm run alex 18 | - name: Prettier 19 | run: npm run prettier -- --list-different 20 | - name: Eslint 21 | run: npm run eslint -- --max-warnings 0 22 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .idea/ 2 | .vscode/ 3 | node_modules/ 4 | build/ 5 | .DS_Store 6 | *.tgz 7 | my-app* 8 | template/src/__tests__/__snapshots__/ 9 | lerna-debug.log 10 | npm-debug.log* 11 | yarn-debug.log* 12 | yarn-error.log* 13 | /.changelog 14 | .npm/ 15 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | build/ 2 | package-lock.json 3 | test/fixtures/webpack-message-formatting/src/AppBabel.js 4 | test/fixtures/webpack-message-formatting/src/AppCss.css 5 | packages/react-error-overlay/fixtures/bundle* 6 | packages/react-error-overlay/fixtures/inline* 7 | packages/react-error-overlay/fixtures/junk* 8 | packages/react-error-overlay/lib/ 9 | packages/react-error-overlay/coverage/ 10 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "arrowParens": "avoid", 3 | "singleQuote": true, 4 | "semi": true 5 | } 6 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /SECURITY.md: -------------------------------------------------------------------------------- 1 | # Reporting Security Issues 2 | 3 | If you believe you have found a security vulnerability in Create React App, we encourage you to let us know right away. We will investigate all legitimate reports and do our best to quickly fix the problem. 4 | 5 | Please refer to the following page for our responsible disclosure policy, reward guidelines, and those things that should not be reported: 6 | 7 | https://www.facebook.com/whitehat 8 | -------------------------------------------------------------------------------- /docusaurus/docs/adding-a-router.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: adding-a-router 3 | title: Adding a Router 4 | --- 5 | 6 | Create React App doesn't prescribe a specific routing solution, but [React Router](https://reactrouter.com/) is the most popular one. 7 | 8 | To add it, run: 9 | 10 | ```sh 11 | npm install react-router-dom 12 | ``` 13 | 14 | Alternatively you may use `yarn`: 15 | 16 | ```sh 17 | yarn add react-router-dom 18 | ``` 19 | 20 | To try it, delete all the code in `src/App.js` and replace it with any of the examples on its website. The [Basic Example](https://reactrouter.com/docs/examples/basic) is a good place to get started. For more info on adding routes, check out [the React Router docs on adding routes](https://reactrouter.com/docs/getting-started/tutorial#add-some-routes). 21 | 22 | Note that [you may need to configure your production server to support client-side routing](deployment.md#serving-apps-with-client-side-routing) before deploying your app. 23 | -------------------------------------------------------------------------------- /docusaurus/docs/adding-relay.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: adding-relay 3 | title: Adding Relay 4 | --- 5 | 6 | Relay is a framework for building data-driven React applications powered by GraphQL. The current release of Relay works with Create React App projects out of the box using Babel Macros. Set up your project as shown in the [Relay documentation](https://facebook.github.io/relay/), then make sure you have a version of the babel plugin providing the macro. 7 | 8 | To add it, run: 9 | 10 | ```sh 11 | npm install --save babel-plugin-relay 12 | ``` 13 | 14 | Alternatively you may use `yarn`: 15 | 16 | ```sh 17 | yarn add babel-plugin-relay 18 | ``` 19 | 20 | Then, wherever you use the `graphql` template tag, import the macro: 21 | 22 | ```js 23 | import graphql from 'babel-plugin-relay/macro'; 24 | // instead of: 25 | // import { graphql } from "babel-plugin-relay" 26 | 27 | graphql` 28 | query UserQuery { 29 | viewer { 30 | id 31 | } 32 | } 33 | `; 34 | ``` 35 | 36 | To learn more about Relay, check out [its documentation](https://facebook.github.io/relay/). 37 | -------------------------------------------------------------------------------- /docusaurus/docs/alternatives-to-ejecting.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: alternatives-to-ejecting 3 | title: Alternatives to Ejecting 4 | --- 5 | 6 | [Ejecting](available-scripts.md#npm-run-eject) lets you customize anything, but from that point on you have to maintain the configuration and scripts yourself. This can be daunting if you have many similar projects. In such cases instead of ejecting we recommend to _fork_ `react-scripts` and any other packages you need. [This article](https://auth0.com/blog/how-to-configure-create-react-app/) covers how to do it in depth. You can find more discussion in [this issue](https://github.com/facebook/create-react-app/issues/682). 7 | -------------------------------------------------------------------------------- /docusaurus/docs/analyzing-the-bundle-size.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: analyzing-the-bundle-size 3 | title: Analyzing the Bundle Size 4 | sidebar_label: Analyzing Bundle Size 5 | --- 6 | 7 | [Source map explorer](https://www.npmjs.com/package/source-map-explorer) analyzes 8 | JavaScript bundles using the source maps. This helps you understand where code 9 | bloat is coming from. 10 | 11 | To add Source map explorer to a Create React App project, follow these steps: 12 | 13 | ```sh 14 | npm install --save source-map-explorer 15 | ``` 16 | 17 | Alternatively you may use `yarn`: 18 | 19 | ```sh 20 | yarn add source-map-explorer 21 | ``` 22 | 23 | Then in `package.json`, add the following line to `scripts`: 24 | 25 | ```diff 26 | "scripts": { 27 | + "analyze": "source-map-explorer 'build/static/js/*.js'", 28 | "start": "react-scripts start", 29 | "build": "react-scripts build", 30 | "test": "react-scripts test", 31 | ``` 32 | 33 | Then to analyze the bundle run the production build then run the analyze 34 | script. 35 | 36 | ```sh 37 | npm run build 38 | npm run analyze 39 | ``` 40 | -------------------------------------------------------------------------------- /docusaurus/docs/can-i-use-decorators.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: can-i-use-decorators 3 | title: Can I Use Decorators? 4 | --- 5 | 6 | Some popular libraries use [decorators](https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841) in their documentation. 7 | 8 | Create React App intentionally doesn’t support decorator syntax at the moment because: 9 | 10 | - It is an experimental proposal and is subject to change (in fact, it has already changed once, and will change again). 11 | - Most libraries currently support only the old version of the proposal — which will never be a standard. 12 | 13 | However in many cases you can rewrite decorator-based code without decorators and achieve the same result. 14 | 15 | Please refer to these two threads for reference: 16 | 17 | - [#214](https://github.com/facebook/create-react-app/issues/214) 18 | - [#411](https://github.com/facebook/create-react-app/issues/411) 19 | 20 | Create React App will add decorator support when the specification advances to a stable stage. 21 | -------------------------------------------------------------------------------- /docusaurus/docs/documentation-intro.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: documentation-intro 3 | title: About the Documentation 4 | sidebar_label: About Docs 5 | --- 6 | 7 | Welcome to the Create React App documentation! 8 | 9 | ## Navigation 10 | 11 | You can find different topics in the table of contents. On desktop, you should see it in the left sidebar. On mobile, you should see it after pressing an icon with arrows in the top left corner. 12 | 13 | ## Looking for React Docs? 14 | 15 | The documentation for React itself is located on a separate website: **[reactjs.org](https://reactjs.org/)**. 16 | 17 | This website is only about Create React App. 18 | 19 | ## Something Missing? 20 | 21 | If you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebook/create-react-app/issues) or [contribute some!](https://github.com/facebook/create-react-app/tree/main/docusaurus/docs) 22 | 23 | ## Feedback 24 | 25 | We are always open to [your feedback](https://github.com/facebook/create-react-app/issues). 26 | -------------------------------------------------------------------------------- /docusaurus/docs/folder-structure.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: folder-structure 3 | title: Folder Structure 4 | --- 5 | 6 | After creation, your project should look like this: 7 | 8 | ``` 9 | my-app/ 10 | README.md 11 | node_modules/ 12 | package.json 13 | public/ 14 | index.html 15 | favicon.ico 16 | src/ 17 | App.css 18 | App.js 19 | App.test.js 20 | index.css 21 | index.js 22 | logo.svg 23 | ``` 24 | 25 | For the project to build, **these files must exist with exact filenames**: 26 | 27 | - `public/index.html` is the page template; 28 | - `src/index.js` is the JavaScript entry point. 29 | 30 | You can delete or rename the other files. 31 | 32 | You may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by webpack. You need to **put any JS and CSS files inside `src`**, otherwise webpack won’t see them. 33 | 34 | Only files inside `public` can be used from `public/index.html`. Read instructions below for using assets from JavaScript and HTML. 35 | 36 | You can, however, create more top-level directories. They will not be included in the production build so you can use them for things like documentation. 37 | 38 | If you have Git installed and your project is not part of a larger repository, then a new repository will be initialized resulting in an additional top-level `.git` directory. 39 | -------------------------------------------------------------------------------- /docusaurus/docs/installing-a-dependency.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: installing-a-dependency 3 | title: Installing a Dependency 4 | --- 5 | 6 | The generated project includes React and ReactDOM as dependencies. It also includes a set of scripts used by Create React App as a development dependency. You may install other dependencies (for example, React Router) with `npm`: 7 | 8 | ```sh 9 | npm install --save react-router-dom 10 | ``` 11 | 12 | Alternatively you may use `yarn`: 13 | 14 | ```sh 15 | yarn add react-router-dom 16 | ``` 17 | 18 | This works for any library, not only `react-router-dom`. 19 | -------------------------------------------------------------------------------- /docusaurus/docs/pre-rendering-into-static-html-files.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: pre-rendering-into-static-html-files 3 | title: Pre-Rendering into Static HTML Files 4 | sidebar_label: Pre-Rendering Static HTML 5 | --- 6 | 7 | If you’re hosting your `build` with a static hosting provider you can use [react-snapshot](https://www.npmjs.com/package/react-snapshot) or [react-snap](https://www.npmjs.com/package/react-snap) to generate HTML pages for each route, or relative link, in your application. These pages will then seamlessly become active, or “hydrated”, when the JavaScript bundle has loaded. 8 | 9 | There are also opportunities to use this outside of static hosting, to take the pressure off the server when generating and caching routes. 10 | 11 | The primary benefit of pre-rendering is that you get the core content of each page _with_ the HTML payload—regardless of whether or not your JavaScript bundle successfully downloads. It also increases the likelihood that each route of your application will be picked up by search engines. 12 | 13 | You can read more about [zero-configuration pre-rendering (also called snapshotting) here](https://medium.com/superhighfives/an-almost-static-stack-6df0a2791319). 14 | -------------------------------------------------------------------------------- /docusaurus/docs/using-global-variables.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: using-global-variables 3 | title: Using Global Variables 4 | --- 5 | 6 | When you include a script in the HTML file that defines global variables and try to use one of these variables in the code, the linter will complain because it cannot see the definition of the variable. 7 | 8 | You can avoid this by reading the global variable explicitly from the `window` object, for example: 9 | 10 | ```js 11 | const $ = window.$; 12 | ``` 13 | 14 | This makes it clear you are using a global variable intentionally rather than because of a typo. 15 | 16 | Alternatively, you can force the linter to ignore any line by adding `// eslint-disable-line` after it. 17 | -------------------------------------------------------------------------------- /docusaurus/website/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | /node_modules 3 | 4 | # production 5 | /build 6 | 7 | # generated files 8 | .docusaurus 9 | .cache-loader 10 | 11 | # misc 12 | .DS_Store 13 | .env.local 14 | .env.development.local 15 | .env.test.local 16 | .env.production.local 17 | 18 | npm-debug.log* 19 | yarn-debug.log* 20 | yarn-error.log* -------------------------------------------------------------------------------- /docusaurus/website/README.md: -------------------------------------------------------------------------------- 1 | # Website 2 | 3 | This website is built using Docusaurus 2, a modern static website generator. 4 | 5 | ### Installation 6 | 7 | ``` 8 | $ npm install 9 | ``` 10 | 11 | ### Local Development 12 | 13 | ``` 14 | $ npm start 15 | ``` 16 | 17 | This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server. 18 | 19 | ### Build 20 | 21 | ``` 22 | $ npm run build 23 | ``` 24 | 25 | This command generates static content into the `build` directory and can be served using any static contents hosting service. 26 | 27 | ### Deployment 28 | 29 | ``` 30 | $ GIT_USER= USE_SSH=1 npm run deploy 31 | ``` 32 | 33 | If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch. 34 | -------------------------------------------------------------------------------- /docusaurus/website/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cra-docs", 3 | "private": true, 4 | "scripts": { 5 | "start": "docusaurus start", 6 | "build": "docusaurus build", 7 | "swizzle": "docusaurus swizzle", 8 | "deploy": "docusaurus deploy" 9 | }, 10 | "dependencies": { 11 | "@docusaurus/core": "^2.0.0-alpha.64", 12 | "@docusaurus/preset-classic": "^2.0.0-alpha.64", 13 | "clsx": "^1.1.1", 14 | "react": "^16.12.0", 15 | "react-dom": "^16.12.0" 16 | }, 17 | "browserslist": { 18 | "production": [ 19 | ">0.2%", 20 | "not dead", 21 | "not op_mini all" 22 | ], 23 | "development": [ 24 | "last 1 chrome version", 25 | "last 1 firefox version", 26 | "last 1 safari version" 27 | ] 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /docusaurus/website/src/pages/styles.module.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2017-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | .heroBanner { 9 | padding: 2.5rem 0; 10 | text-align: center; 11 | position: relative; 12 | overflow: hidden; 13 | } 14 | 15 | .heroBannerLogo { 16 | max-width: 170px; 17 | max-height: 170px; 18 | } 19 | 20 | @media screen and (max-width: 966px) { 21 | .heroBanner { 22 | padding: 2rem; 23 | } 24 | } 25 | 26 | .getStarted { 27 | display: flex; 28 | align-items: center; 29 | justify-content: center; 30 | } 31 | 32 | .features { 33 | display: flex; 34 | align-items: center; 35 | padding: 4rem 0; 36 | width: 100%; 37 | } 38 | 39 | .featureImage { 40 | margin: 0 auto; 41 | } 42 | 43 | .gettingStartedSection { 44 | background-color: #f7f7f7; 45 | } 46 | 47 | html[data-theme='dark'] .gettingStartedSection { 48 | background-color: #33363b; 49 | } 50 | -------------------------------------------------------------------------------- /docusaurus/website/static/CNAME: -------------------------------------------------------------------------------- 1 | create-react-app.dev 2 | -------------------------------------------------------------------------------- /docusaurus/website/static/img/favicon/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/docusaurus/website/static/img/favicon/favicon.ico -------------------------------------------------------------------------------- /docusaurus/website/static/img/logo-og.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/docusaurus/website/static/img/logo-og.png -------------------------------------------------------------------------------- /docusaurus/website/static/img/oss_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/docusaurus/website/static/img/oss_logo.png -------------------------------------------------------------------------------- /docusaurus/website/static/img/update.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/docusaurus/website/static/img/update.png -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "lerna": "2.6.0", 3 | "npmClient": "yarn", 4 | "useWorkspaces": true, 5 | "version": "independent", 6 | "changelog": { 7 | "repo": "facebook/create-react-app", 8 | "labels": { 9 | "tag: new feature": ":rocket: New Feature", 10 | "tag: breaking change": ":boom: Breaking Change", 11 | "tag: bug fix": ":bug: Bug Fix", 12 | "tag: enhancement": ":nail_care: Enhancement", 13 | "tag: documentation": ":memo: Documentation", 14 | "tag: internal": ":house: Internal", 15 | "tag: underlying tools": ":hammer: Underlying Tools" 16 | }, 17 | "cacheDir": ".changelog" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build] 2 | base = "docusaurus/website" 3 | publish = "docusaurus/website/build" 4 | command = "npm run build" 5 | 6 | -------------------------------------------------------------------------------- /packages/babel-plugin-named-asset-import/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/babel-plugin-named-asset-import/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "babel-plugin-named-asset-import", 3 | "version": "0.4.0", 4 | "description": "Babel plugin for named asset imports in Create React App", 5 | "repository": { 6 | "type": "git", 7 | "url": "https://github.com/facebook/create-react-app.git", 8 | "directory": "packages/babel-plugin-named-asset-import" 9 | }, 10 | "license": "MIT", 11 | "bugs": { 12 | "url": "https://github.com/facebook/create-react-app/issues" 13 | }, 14 | "main": "index.js", 15 | "files": [ 16 | "index.js" 17 | ], 18 | "peerDependencies": { 19 | "@babel/core": "^7.1.0" 20 | }, 21 | "devDependencies": { 22 | "babel-plugin-tester": "^10.1.0", 23 | "jest": "^27.4.3" 24 | }, 25 | "scripts": { 26 | "test": "jest" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/dev.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const create = require('./create'); 10 | 11 | module.exports = function (api, opts) { 12 | return create(api, Object.assign({ helpers: false }, opts), 'development'); 13 | }; 14 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const create = require('./create'); 10 | 11 | module.exports = function (api, opts) { 12 | // This is similar to how `env` works in Babel: 13 | // https://babeljs.io/docs/usage/babelrc/#env-option 14 | // We are not using `env` because it’s ignored in versions > babel-core@6.10.4: 15 | // https://github.com/babel/babel/issues/4539 16 | // https://github.com/facebook/create-react-app/issues/720 17 | // It’s also nice that we can enforce `NODE_ENV` being specified. 18 | const env = process.env.BABEL_ENV || process.env.NODE_ENV; 19 | return create(api, opts, env); 20 | }; 21 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/prod.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const create = require('./create'); 10 | 11 | module.exports = function (api, opts) { 12 | return create(api, Object.assign({ helpers: false }, opts), 'production'); 13 | }; 14 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const create = require('./create'); 10 | 11 | module.exports = function (api, opts) { 12 | return create(api, Object.assign({ helpers: false }, opts), 'test'); 13 | }; 14 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/webpack-overrides.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const crypto = require('crypto'); 10 | 11 | const macroCheck = new RegExp('[./]macro'); 12 | 13 | module.exports = function () { 14 | return { 15 | // This function transforms the Babel configuration on a per-file basis 16 | config(config, { source }) { 17 | // Babel Macros are notoriously hard to cache, so they shouldn't be 18 | // https://github.com/babel/babel/issues/8497 19 | // We naively detect macros using their package suffix and add a random token 20 | // to the caller, a valid option accepted by Babel, to compose a one-time 21 | // cacheIdentifier for the file. We cannot tune the loader options on a per 22 | // file basis. 23 | if (macroCheck.test(source)) { 24 | return Object.assign({}, config.options, { 25 | caller: Object.assign({}, config.options.caller, { 26 | craInvalidationToken: crypto.randomBytes(32).toString('hex'), 27 | }), 28 | }); 29 | } 30 | return config.options; 31 | }, 32 | }; 33 | }; 34 | -------------------------------------------------------------------------------- /packages/confusing-browser-globals/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/confusing-browser-globals/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | module.exports = [ 11 | 'addEventListener', 12 | 'blur', 13 | 'close', 14 | 'closed', 15 | 'confirm', 16 | 'defaultStatus', 17 | 'defaultstatus', 18 | 'event', 19 | 'external', 20 | 'find', 21 | 'focus', 22 | 'frameElement', 23 | 'frames', 24 | 'history', 25 | 'innerHeight', 26 | 'innerWidth', 27 | 'length', 28 | 'location', 29 | 'locationbar', 30 | 'menubar', 31 | 'moveBy', 32 | 'moveTo', 33 | 'name', 34 | 'onblur', 35 | 'onerror', 36 | 'onfocus', 37 | 'onload', 38 | 'onresize', 39 | 'onunload', 40 | 'open', 41 | 'opener', 42 | 'opera', 43 | 'outerHeight', 44 | 'outerWidth', 45 | 'pageXOffset', 46 | 'pageYOffset', 47 | 'parent', 48 | 'print', 49 | 'removeEventListener', 50 | 'resizeBy', 51 | 'resizeTo', 52 | 'screen', 53 | 'screenLeft', 54 | 'screenTop', 55 | 'screenX', 56 | 'screenY', 57 | 'scroll', 58 | 'scrollbars', 59 | 'scrollBy', 60 | 'scrollTo', 61 | 'scrollX', 62 | 'scrollY', 63 | 'self', 64 | 'status', 65 | 'statusbar', 66 | 'stop', 67 | 'toolbar', 68 | 'top', 69 | ]; 70 | -------------------------------------------------------------------------------- /packages/confusing-browser-globals/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "confusing-browser-globals", 3 | "version": "1.0.11", 4 | "description": "A list of browser globals that are often used by mistake instead of local variables", 5 | "license": "MIT", 6 | "main": "index.js", 7 | "scripts": { 8 | "test": "jest" 9 | }, 10 | "repository": { 11 | "type": "git", 12 | "url": "https://github.com/facebook/create-react-app.git", 13 | "directory": "packages/confusing-browser-globals" 14 | }, 15 | "keywords": [ 16 | "eslint", 17 | "globals" 18 | ], 19 | "files": [ 20 | "index.js" 21 | ], 22 | "devDependencies": { 23 | "jest": "^27.4.3" 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /packages/confusing-browser-globals/test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* eslint-env jest */ 9 | 10 | 'use strict'; 11 | 12 | let globals = require('./index'); 13 | 14 | it('should return an Array of globals', () => { 15 | expect(Array.isArray(globals)).toBe(true); 16 | }); 17 | 18 | it('should contain "event" variable', () => { 19 | expect(globals).toContain('event'); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/README.md: -------------------------------------------------------------------------------- 1 | # cra-template-typescript 2 | 3 | This is the official TypeScript template for [Create React App](https://github.com/facebook/create-react-app). 4 | 5 | To use this template, add `--template typescript` when creating a new app. 6 | 7 | For example: 8 | 9 | ```sh 10 | npx create-react-app my-app --template typescript 11 | 12 | # or 13 | 14 | yarn create react-app my-app --template typescript 15 | ``` 16 | 17 | For more information, please refer to: 18 | 19 | - [Getting Started](https://create-react-app.dev/docs/getting-started) – How to create a new app. 20 | - [User Guide](https://create-react-app.dev) – How to develop apps bootstrapped with Create React App. 21 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cra-template-typescript", 3 | "version": "1.3.0", 4 | "keywords": [ 5 | "react", 6 | "create-react-app", 7 | "template", 8 | "typescript" 9 | ], 10 | "description": "The base TypeScript template for Create React App.", 11 | "repository": { 12 | "type": "git", 13 | "url": "https://github.com/facebook/create-react-app.git", 14 | "directory": "packages/cra-template-typescript" 15 | }, 16 | "license": "MIT", 17 | "engines": { 18 | "node": ">=14" 19 | }, 20 | "bugs": { 21 | "url": "https://github.com/facebook/create-react-app/issues" 22 | }, 23 | "files": [ 24 | "template", 25 | "template.json" 26 | ] 27 | } 28 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template.json: -------------------------------------------------------------------------------- 1 | { 2 | "package": { 3 | "dependencies": { 4 | "@testing-library/dom": "^10.4.0", 5 | "@testing-library/jest-dom": "^6.6.3", 6 | "@testing-library/react": "^16.1.0", 7 | "@testing-library/user-event": "^13.2.1", 8 | "@types/jest": "^27.0.1", 9 | "@types/node": "^16.7.13", 10 | "@types/react": "^19.0.0", 11 | "@types/react-dom": "^19.0.0", 12 | "typescript": "^4.4.2", 13 | "web-vitals": "^2.1.0" 14 | }, 15 | "eslintConfig": { 16 | "extends": ["react-app", "react-app/jest"] 17 | } 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/cra-template-typescript/template/public/favicon.ico -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/cra-template-typescript/template/public/logo192.png -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/cra-template-typescript/template/public/logo512.png -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | height: 40vmin; 7 | pointer-events: none; 8 | } 9 | 10 | @media (prefers-reduced-motion: no-preference) { 11 | .App-logo { 12 | animation: App-logo-spin infinite 20s linear; 13 | } 14 | } 15 | 16 | .App-header { 17 | background-color: #282c34; 18 | min-height: 100vh; 19 | display: flex; 20 | flex-direction: column; 21 | align-items: center; 22 | justify-content: center; 23 | font-size: calc(10px + 2vmin); 24 | color: white; 25 | } 26 | 27 | .App-link { 28 | color: #61dafb; 29 | } 30 | 31 | @keyframes App-logo-spin { 32 | from { 33 | transform: rotate(0deg); 34 | } 35 | to { 36 | transform: rotate(360deg); 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/src/App.test.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { render, screen } from '@testing-library/react'; 3 | import App from './App'; 4 | 5 | test('renders learn react link', () => { 6 | render(); 7 | const linkElement = screen.getByText(/learn react/i); 8 | expect(linkElement).toBeInTheDocument(); 9 | }); 10 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/src/App.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import logo from './logo.svg'; 3 | import './App.css'; 4 | 5 | function App() { 6 | return ( 7 |
8 |
9 | logo 10 |

11 | Edit src/App.tsx and save to reload. 12 |

13 | 19 | Learn React 20 | 21 |
22 |
23 | ); 24 | } 25 | 26 | export default App; 27 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/src/index.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import './index.css'; 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | 7 | const root = ReactDOM.createRoot( 8 | document.getElementById('root') as HTMLElement 9 | ); 10 | root.render( 11 | 12 | 13 | 14 | ); 15 | 16 | // If you want to start measuring performance in your app, pass a function 17 | // to log results (for example: reportWebVitals(console.log)) 18 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 19 | reportWebVitals(); 20 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/src/reportWebVitals.ts: -------------------------------------------------------------------------------- 1 | import { ReportHandler } from 'web-vitals'; 2 | 3 | const reportWebVitals = (onPerfEntry?: ReportHandler) => { 4 | if (onPerfEntry && onPerfEntry instanceof Function) { 5 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 6 | getCLS(onPerfEntry); 7 | getFID(onPerfEntry); 8 | getFCP(onPerfEntry); 9 | getLCP(onPerfEntry); 10 | getTTFB(onPerfEntry); 11 | }); 12 | } 13 | }; 14 | 15 | export default reportWebVitals; 16 | -------------------------------------------------------------------------------- /packages/cra-template-typescript/template/src/setupTests.ts: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /packages/cra-template/README.md: -------------------------------------------------------------------------------- 1 | # cra-template 2 | 3 | This is the official base template for [Create React App](https://github.com/facebook/create-react-app). 4 | 5 | If you don't specify a template (for example, `--template typescript`), this template will be used by default. 6 | 7 | For more information, please refer to: 8 | 9 | - [Getting Started](https://create-react-app.dev/docs/getting-started) – How to create a new app. 10 | - [User Guide](https://create-react-app.dev) – How to develop apps bootstrapped with Create React App. 11 | -------------------------------------------------------------------------------- /packages/cra-template/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cra-template", 3 | "version": "1.3.0", 4 | "keywords": [ 5 | "react", 6 | "create-react-app", 7 | "template" 8 | ], 9 | "description": "The base template for Create React App.", 10 | "repository": { 11 | "type": "git", 12 | "url": "https://github.com/facebook/create-react-app.git", 13 | "directory": "packages/cra-template" 14 | }, 15 | "license": "MIT", 16 | "engines": { 17 | "node": ">=14" 18 | }, 19 | "bugs": { 20 | "url": "https://github.com/facebook/create-react-app/issues" 21 | }, 22 | "files": [ 23 | "template", 24 | "template.json" 25 | ] 26 | } 27 | -------------------------------------------------------------------------------- /packages/cra-template/template.json: -------------------------------------------------------------------------------- 1 | { 2 | "package": { 3 | "dependencies": { 4 | "@testing-library/dom": "^10.4.0", 5 | "@testing-library/jest-dom": "^6.6.3", 6 | "@testing-library/react": "^16.1.0", 7 | "@testing-library/user-event": "^13.2.1", 8 | "web-vitals": "^2.1.0" 9 | }, 10 | "eslintConfig": { 11 | "extends": ["react-app", "react-app/jest"] 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /packages/cra-template/template/gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /packages/cra-template/template/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/cra-template/template/public/favicon.ico -------------------------------------------------------------------------------- /packages/cra-template/template/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/cra-template/template/public/logo192.png -------------------------------------------------------------------------------- /packages/cra-template/template/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/cra-template/template/public/logo512.png -------------------------------------------------------------------------------- /packages/cra-template/template/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /packages/cra-template/template/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /packages/cra-template/template/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | height: 40vmin; 7 | pointer-events: none; 8 | } 9 | 10 | @media (prefers-reduced-motion: no-preference) { 11 | .App-logo { 12 | animation: App-logo-spin infinite 20s linear; 13 | } 14 | } 15 | 16 | .App-header { 17 | background-color: #282c34; 18 | min-height: 100vh; 19 | display: flex; 20 | flex-direction: column; 21 | align-items: center; 22 | justify-content: center; 23 | font-size: calc(10px + 2vmin); 24 | color: white; 25 | } 26 | 27 | .App-link { 28 | color: #61dafb; 29 | } 30 | 31 | @keyframes App-logo-spin { 32 | from { 33 | transform: rotate(0deg); 34 | } 35 | to { 36 | transform: rotate(360deg); 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /packages/cra-template/template/src/App.js: -------------------------------------------------------------------------------- 1 | import logo from './logo.svg'; 2 | import './App.css'; 3 | 4 | function App() { 5 | return ( 6 |
7 |
8 | logo 9 |

10 | Edit src/App.js and save to reload. 11 |

12 | 18 | Learn React 19 | 20 |
21 |
22 | ); 23 | } 24 | 25 | export default App; 26 | -------------------------------------------------------------------------------- /packages/cra-template/template/src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /packages/cra-template/template/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /packages/cra-template/template/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import './index.css'; 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | 7 | const root = ReactDOM.createRoot(document.getElementById('root')); 8 | root.render( 9 | 10 | 11 | 12 | ); 13 | 14 | // If you want to start measuring performance in your app, pass a function 15 | // to log results (for example: reportWebVitals(console.log)) 16 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 17 | reportWebVitals(); 18 | -------------------------------------------------------------------------------- /packages/cra-template/template/src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /packages/cra-template/template/src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /packages/create-react-app/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/create-react-app/README.md: -------------------------------------------------------------------------------- 1 | # create-react-app 2 | 3 | This package includes the global command for [Create React App](https://github.com/facebook/create-react-app).
4 | Please refer to its documentation: 5 | 6 | - [Getting Started](https://facebook.github.io/create-react-app/docs/getting-started) – How to create a new app. 7 | - [User Guide](https://facebook.github.io/create-react-app/) – How to develop apps bootstrapped with Create React App. 8 | -------------------------------------------------------------------------------- /packages/create-react-app/__tests__/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "jest": true 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /packages/create-react-app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "create-react-app", 3 | "version": "5.1.0", 4 | "keywords": [ 5 | "react" 6 | ], 7 | "description": "Create React apps with no build configuration.", 8 | "repository": { 9 | "type": "git", 10 | "url": "https://github.com/facebook/create-react-app.git", 11 | "directory": "packages/create-react-app" 12 | }, 13 | "license": "MIT", 14 | "engines": { 15 | "node": ">=14" 16 | }, 17 | "bugs": { 18 | "url": "https://github.com/facebook/create-react-app/issues" 19 | }, 20 | "files": [ 21 | "index.js", 22 | "createReactApp.js" 23 | ], 24 | "bin": { 25 | "create-react-app": "./index.js" 26 | }, 27 | "scripts": { 28 | "test": "cross-env FORCE_COLOR=true jest" 29 | }, 30 | "dependencies": { 31 | "chalk": "^4.1.2", 32 | "commander": "^4.1.1", 33 | "cross-spawn": "^7.0.3", 34 | "envinfo": "^7.8.1", 35 | "fs-extra": "^10.0.0", 36 | "hyperquest": "^2.1.3", 37 | "prompts": "^2.4.2", 38 | "semver": "^7.3.5", 39 | "tar-pack": "^3.4.1", 40 | "tmp": "^0.2.1", 41 | "validate-npm-package-name": "^3.0.0" 42 | }, 43 | "devDependencies": { 44 | "cross-env": "^7.0.3", 45 | "jest": "^27.4.3" 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /packages/eslint-config-react-app/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/eslint-config-react-app/base.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | // Fix eslint shareable config (https://github.com/eslint/eslint/issues/3458) 11 | require('@rushstack/eslint-patch/modern-module-resolution'); 12 | 13 | // This file contains the minimum ESLint configuration required for Create 14 | // React App support, and is used as the `baseConfig` for `eslint-loader` 15 | // to ensure that user-provided configs don't need this boilerplate. 16 | 17 | module.exports = { 18 | root: true, 19 | 20 | parser: '@babel/eslint-parser', 21 | 22 | plugins: ['react'], 23 | 24 | env: { 25 | browser: true, 26 | commonjs: true, 27 | es6: true, 28 | jest: true, 29 | node: true, 30 | }, 31 | 32 | parserOptions: { 33 | sourceType: 'module', 34 | requireConfigFile: false, 35 | babelOptions: { 36 | presets: [require.resolve('babel-preset-react-app/prod')], 37 | }, 38 | }, 39 | 40 | settings: { 41 | react: { 42 | version: 'detect', 43 | }, 44 | }, 45 | 46 | rules: { 47 | 'react/jsx-uses-vars': 'warn', 48 | 'react/jsx-uses-react': 'warn', 49 | }, 50 | }; 51 | -------------------------------------------------------------------------------- /packages/eslint-config-react-app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "eslint-config-react-app", 3 | "version": "7.1.0", 4 | "description": "ESLint configuration used by Create React App", 5 | "repository": { 6 | "type": "git", 7 | "url": "https://github.com/facebook/create-react-app.git", 8 | "directory": "packages/eslint-config-react-app" 9 | }, 10 | "license": "MIT", 11 | "bugs": { 12 | "url": "https://github.com/facebook/create-react-app/issues" 13 | }, 14 | "files": [ 15 | "base.js", 16 | "index.js", 17 | "jest.js" 18 | ], 19 | "peerDependencies": { 20 | "eslint": "^8.0.0" 21 | }, 22 | "dependencies": { 23 | "@babel/core": "^7.16.0", 24 | "@babel/eslint-parser": "^7.16.3", 25 | "@rushstack/eslint-patch": "^1.1.0", 26 | "@typescript-eslint/eslint-plugin": "^5.5.0", 27 | "@typescript-eslint/parser": "^5.5.0", 28 | "babel-preset-react-app": "^10.1.0", 29 | "confusing-browser-globals": "^1.0.11", 30 | "eslint-plugin-flowtype": "^8.0.3", 31 | "eslint-plugin-import": "^2.25.3", 32 | "eslint-plugin-jest": "^25.3.0", 33 | "eslint-plugin-jsx-a11y": "^6.5.1", 34 | "eslint-plugin-react": "^7.27.1", 35 | "eslint-plugin-react-hooks": "^4.3.0", 36 | "eslint-plugin-testing-library": "^5.0.1" 37 | }, 38 | "engines": { 39 | "node": ">=14.0.0" 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /packages/react-app-polyfill/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/react-app-polyfill/ie11.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | if (typeof Promise === 'undefined') { 10 | // Rejection tracking prevents a common issue where React gets into an 11 | // inconsistent state due to an error, but it gets swallowed by a Promise, 12 | // and the user has no idea what causes React's erratic future behavior. 13 | require('promise/lib/rejection-tracking').enable(); 14 | self.Promise = require('promise/lib/es6-extensions.js'); 15 | } 16 | 17 | // Make sure we're in a Browser-like environment before importing polyfills 18 | // This prevents `fetch()` from being imported in a Node test environment 19 | if (typeof window !== 'undefined') { 20 | // fetch() polyfill for making API calls. 21 | require('whatwg-fetch'); 22 | } 23 | 24 | // Object.assign() is commonly used with React. 25 | // It will use the native implementation if it's present and isn't buggy. 26 | Object.assign = require('object-assign'); 27 | 28 | // Support for...of (a commonly used syntax feature that requires Symbols) 29 | require('core-js/features/symbol'); 30 | // Support iterable spread (...Set, ...Map) 31 | require('core-js/features/array/from'); 32 | -------------------------------------------------------------------------------- /packages/react-app-polyfill/ie9.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | require('./ie11'); 10 | 11 | // React 16+ relies on Map, Set, and requestAnimationFrame 12 | require('core-js/features/map'); 13 | require('core-js/features/set'); 14 | 15 | require('raf').polyfill(); 16 | -------------------------------------------------------------------------------- /packages/react-app-polyfill/jsdom.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | // Make sure we're in a Browser-like environment before importing polyfills 10 | // This prevents `fetch()` from being imported in a Node test environment 11 | if (typeof window !== 'undefined') { 12 | // fetch() polyfill for making API calls. 13 | require('whatwg-fetch'); 14 | } 15 | -------------------------------------------------------------------------------- /packages/react-app-polyfill/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-app-polyfill", 3 | "version": "3.0.0", 4 | "description": "Polyfills for various browsers including commonly used language features", 5 | "repository": { 6 | "type": "git", 7 | "url": "https://github.com/facebook/create-react-app.git", 8 | "directory": "packages/react-app-polyfill" 9 | }, 10 | "license": "MIT", 11 | "bugs": { 12 | "url": "https://github.com/facebook/create-react-app/issues" 13 | }, 14 | "engines": { 15 | "node": ">=14" 16 | }, 17 | "files": [ 18 | "ie9.js", 19 | "ie11.js", 20 | "jsdom.js", 21 | "stable.js" 22 | ], 23 | "dependencies": { 24 | "core-js": "^3.19.2", 25 | "object-assign": "^4.1.1", 26 | "promise": "^8.1.0", 27 | "raf": "^3.4.1", 28 | "regenerator-runtime": "^0.13.9", 29 | "whatwg-fetch": "^3.6.2" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /packages/react-app-polyfill/stable.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | // Polyfill stable language features. 10 | // It's recommended to use @babel/preset-env and browserslist 11 | // to only include the polyfills necessary for the target browsers. 12 | require('core-js/stable'); 13 | require('regenerator-runtime/runtime'); 14 | -------------------------------------------------------------------------------- /packages/react-dev-utils/ForkTsCheckerWarningWebpackPlugin.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | // References: 11 | // - https://github.com/TypeStrong/fork-ts-checker-webpack-plugin#plugin-hooks 12 | // - https://github.com/TypeStrong/fork-ts-checker-webpack-plugin/issues/232#issuecomment-645543747 13 | const ForkTsCheckerWebpackPlugin = require('./ForkTsCheckerWebpackPlugin'); 14 | 15 | module.exports = class ForkTsCheckerWarningWebpackPlugin { 16 | apply(compiler) { 17 | new ForkTsCheckerWebpackPlugin().apply(compiler); 18 | 19 | const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(compiler); 20 | 21 | hooks.issues.tap('ForkTsCheckerWarningWebpackPlugin', issues => 22 | issues.map(issue => ({ ...issue, severity: 'warning' })) 23 | ); 24 | } 25 | }; 26 | -------------------------------------------------------------------------------- /packages/react-dev-utils/ForkTsCheckerWebpackPlugin.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | var ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); 11 | 12 | module.exports = ForkTsCheckerWebpackPlugin; 13 | -------------------------------------------------------------------------------- /packages/react-dev-utils/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/react-dev-utils/__tests__/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "jest": true 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /packages/react-dev-utils/chalk.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | var chalk = require('chalk'); 11 | 12 | module.exports = chalk; 13 | -------------------------------------------------------------------------------- /packages/react-dev-utils/checkRequiredFiles.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | var fs = require('fs'); 11 | var path = require('path'); 12 | var chalk = require('chalk'); 13 | 14 | function checkRequiredFiles(files) { 15 | var currentFilePath; 16 | try { 17 | files.forEach(filePath => { 18 | currentFilePath = filePath; 19 | fs.accessSync(filePath, fs.F_OK); 20 | }); 21 | return true; 22 | } catch (err) { 23 | var dirName = path.dirname(currentFilePath); 24 | var fileName = path.basename(currentFilePath); 25 | console.log(chalk.red('Could not find a required file.')); 26 | console.log(chalk.red(' Name: ') + chalk.cyan(fileName)); 27 | console.log(chalk.red(' Searched in: ') + chalk.cyan(dirName)); 28 | return false; 29 | } 30 | } 31 | 32 | module.exports = checkRequiredFiles; 33 | -------------------------------------------------------------------------------- /packages/react-dev-utils/clearConsole.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | function clearConsole() { 11 | process.stdout.write( 12 | process.platform === 'win32' ? '\x1B[2J\x1B[0f' : '\x1B[2J\x1B[3J\x1B[H' 13 | ); 14 | } 15 | 16 | module.exports = clearConsole; 17 | -------------------------------------------------------------------------------- /packages/react-dev-utils/crossSpawn.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | var crossSpawn = require('cross-spawn'); 11 | 12 | module.exports = crossSpawn; 13 | -------------------------------------------------------------------------------- /packages/react-dev-utils/errorOverlayMiddleware.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const launchEditor = require('./launchEditor'); 10 | const launchEditorEndpoint = require('./launchEditorEndpoint'); 11 | 12 | module.exports = function createLaunchEditorMiddleware() { 13 | return function launchEditorMiddleware(req, res, next) { 14 | if (req.url.startsWith(launchEditorEndpoint)) { 15 | const lineNumber = parseInt(req.query.lineNumber, 10) || 1; 16 | const colNumber = parseInt(req.query.colNumber, 10) || 1; 17 | launchEditor(req.query.fileName, lineNumber, colNumber); 18 | res.end(); 19 | } else { 20 | next(); 21 | } 22 | }; 23 | }; 24 | -------------------------------------------------------------------------------- /packages/react-dev-utils/getCacheIdentifier.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | module.exports = function getCacheIdentifier(environment, packages) { 11 | let cacheIdentifier = environment == null ? '' : environment.toString(); 12 | for (const packageName of packages) { 13 | cacheIdentifier += `:${packageName}@`; 14 | try { 15 | cacheIdentifier += require(`${packageName}/package.json`).version; 16 | } catch (_) { 17 | // ignored 18 | } 19 | } 20 | return cacheIdentifier; 21 | }; 22 | -------------------------------------------------------------------------------- /packages/react-dev-utils/globby.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | var globby = require('globby'); 11 | 12 | module.exports = globby; 13 | -------------------------------------------------------------------------------- /packages/react-dev-utils/ignoredFiles.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | const path = require('path'); 11 | const escape = require('escape-string-regexp'); 12 | 13 | module.exports = function ignoredFiles(appSrc) { 14 | return new RegExp( 15 | `^(?!${escape( 16 | path.normalize(appSrc + '/').replace(/[\\]+/g, '/') 17 | )}).+/node_modules/`, 18 | 'g' 19 | ); 20 | }; 21 | -------------------------------------------------------------------------------- /packages/react-dev-utils/immer.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | 'use strict'; 9 | 10 | var immer = require('immer'); 11 | 12 | module.exports = immer; 13 | -------------------------------------------------------------------------------- /packages/react-dev-utils/launchEditorEndpoint.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | // TODO: we might want to make this injectable to support DEV-time non-root URLs. 10 | module.exports = '/__open-stack-frame-in-editor'; 11 | -------------------------------------------------------------------------------- /packages/react-dev-utils/redirectServedPathMiddleware.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const path = require('path'); 10 | 11 | module.exports = function createRedirectServedPathMiddleware(servedPath) { 12 | // remove end slash so user can land on `/test` instead of `/test/` 13 | servedPath = servedPath.slice(0, -1); 14 | return function redirectServedPathMiddleware(req, res, next) { 15 | if ( 16 | servedPath === '' || 17 | req.url === servedPath || 18 | req.url.startsWith(servedPath) 19 | ) { 20 | next(); 21 | } else { 22 | const newPath = path.posix.join( 23 | servedPath, 24 | req.path !== '/' ? req.path : '' 25 | ); 26 | res.redirect(newPath); 27 | } 28 | }; 29 | }; 30 | -------------------------------------------------------------------------------- /packages/react-dev-utils/refreshOverlayInterop.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2015-present, Facebook, Inc. 4 | * 5 | * This source code is licensed under the MIT license found in the 6 | * LICENSE file in the root directory of this source tree. 7 | */ 8 | // @remove-on-eject-end 9 | 'use strict'; 10 | 11 | const { 12 | dismissRuntimeErrors, 13 | reportRuntimeError, 14 | } = require('react-error-overlay'); 15 | 16 | module.exports = { 17 | clearRuntimeErrors: dismissRuntimeErrors, 18 | handleRuntimeError: reportRuntimeError, 19 | }; 20 | -------------------------------------------------------------------------------- /packages/react-error-overlay/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"] 3 | } 4 | -------------------------------------------------------------------------------- /packages/react-error-overlay/.flowconfig: -------------------------------------------------------------------------------- 1 | [include] 2 | /src/**/*.js 3 | 4 | [ignore] 5 | .*/node_modules/.* 6 | .*/.git/.* 7 | .*/__test__/.* 8 | .*/fixtures/.* 9 | 10 | [libs] 11 | flow/ 12 | 13 | [options] 14 | module.file_ext=.js 15 | sharedmemory.hash_table_pow=19 16 | -------------------------------------------------------------------------------- /packages/react-error-overlay/.gitattributes: -------------------------------------------------------------------------------- 1 | *.js text eol=lf 2 | -------------------------------------------------------------------------------- /packages/react-error-overlay/.gitignore: -------------------------------------------------------------------------------- 1 | lib/ 2 | coverage/ 3 | -------------------------------------------------------------------------------- /packages/react-error-overlay/.npmignore: -------------------------------------------------------------------------------- 1 | __tests__ 2 | *.test.js 3 | *.spec.js 4 | -------------------------------------------------------------------------------- /packages/react-error-overlay/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/react-error-overlay/README.md: -------------------------------------------------------------------------------- 1 | # `react-error-overlay` 2 | 3 | `react-error-overlay` is an overlay which displays when there is a runtime error. 4 | 5 | ## Development 6 | 7 | When developing within this package, make sure you run `npm start` (or `yarn start`) so that the files are compiled as you work. 8 | This is run in watch mode by default. 9 | 10 | If you would like to build this for production, run `npm run build:prod` (or `yarn build:prod`).
11 | If you would like to build this one-off for development, you can run `NODE_ENV=development npm run build` (or `NODE_ENV=development yarn build`). 12 | -------------------------------------------------------------------------------- /packages/react-error-overlay/fixtures/inline.es6.mjs: -------------------------------------------------------------------------------- 1 | function foo() { 2 | console.log('bar') 3 | } 4 | 5 | export { foo } 6 | -------------------------------------------------------------------------------- /packages/react-error-overlay/fixtures/inline.mjs: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | function foo() { 7 | console.log('bar'); 8 | } 9 | 10 | exports.foo = foo; 11 | 12 | //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlc3QuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxTQUFTLEdBQVQsR0FBZTtBQUNiLFVBQVEsR0FBUixDQUFZLEtBQVo7QUFDRDs7UUFFUSxHLEdBQUEsRyIsImZpbGUiOiJzdGRvdXQiLCJzb3VyY2VzQ29udGVudCI6WyJmdW5jdGlvbiBmb28oKSB7XG4gIGNvbnNvbGUubG9nKCdiYXInKVxufVxuXG5leHBvcnQgeyBmb28gfVxuIl19 13 | -------------------------------------------------------------------------------- /packages/react-error-overlay/fixtures/junk-inline.mjs: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | function foo() { 7 | console.log('bar'); 8 | } 9 | 10 | exports.foo = foo; 11 | 12 | //# sourceMappingURL=data:application/json;charset=utf-8;base64vlq,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlc3QuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxTQUFTLEdBQVQsR0FBZTtBQUNiLFVBQVEsR0FBUixDQUFZLEtBQVo7QUFDRDs7UUFFUSxHLEdBQUEsRyIsImZpbGUiOiJzdGRvdXQiLCJzb3VyY2VzQ29udGVudCI6WyJmdW5jdGlvbiBmb28oKSB7XG4gIGNvbnNvbGUubG9nKCdiYXInKVxufVxuXG5leHBvcnQgeyBmb28gfVxuIl19 13 | -------------------------------------------------------------------------------- /packages/react-error-overlay/flow/env.js: -------------------------------------------------------------------------------- 1 | declare module 'anser' { 2 | declare module.exports: any; 3 | } 4 | 5 | declare module '@babel/code-frame' { 6 | declare module.exports: any; 7 | } 8 | 9 | declare module 'html-entities' { 10 | declare module.exports: any; 11 | } 12 | 13 | declare module 'settle-promise' { 14 | declare module.exports: any; 15 | } 16 | 17 | declare module 'source-map' { 18 | declare module.exports: any; 19 | } 20 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/__snapshots__/lines-around.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`should return lines around from a string 1`] = ` 4 | Array [ 5 | ScriptLine { 6 | "content": "two", 7 | "highlight": false, 8 | "lineNumber": 2, 9 | }, 10 | ScriptLine { 11 | "content": "three", 12 | "highlight": false, 13 | "lineNumber": 3, 14 | }, 15 | ScriptLine { 16 | "content": "four", 17 | "highlight": true, 18 | "lineNumber": 4, 19 | }, 20 | ScriptLine { 21 | "content": "five", 22 | "highlight": false, 23 | "lineNumber": 5, 24 | }, 25 | ScriptLine { 26 | "content": "six", 27 | "highlight": false, 28 | "lineNumber": 6, 29 | }, 30 | ] 31 | `; 32 | 33 | exports[`should return lines around from an array 1`] = ` 34 | Array [ 35 | ScriptLine { 36 | "content": "two", 37 | "highlight": false, 38 | "lineNumber": 2, 39 | }, 40 | ScriptLine { 41 | "content": "three", 42 | "highlight": false, 43 | "lineNumber": 3, 44 | }, 45 | ScriptLine { 46 | "content": "four", 47 | "highlight": true, 48 | "lineNumber": 4, 49 | }, 50 | ScriptLine { 51 | "content": "five", 52 | "highlight": false, 53 | "lineNumber": 5, 54 | }, 55 | ScriptLine { 56 | "content": "six", 57 | "highlight": false, 58 | "lineNumber": 6, 59 | }, 60 | ] 61 | `; 62 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/__snapshots__/script-lines.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`script line shape 1`] = ` 4 | ScriptLine { 5 | "content": "foobar", 6 | "highlight": true, 7 | "lineNumber": 5, 8 | } 9 | `; 10 | 11 | exports[`script line to provide default highlight 1`] = ` 12 | ScriptLine { 13 | "content": "foobar", 14 | "highlight": false, 15 | "lineNumber": 5, 16 | } 17 | `; 18 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/__snapshots__/stack-frame.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`proper empty shape 1`] = ` 4 | StackFrame { 5 | "_originalColumnNumber": null, 6 | "_originalFileName": null, 7 | "_originalFunctionName": null, 8 | "_originalLineNumber": null, 9 | "_originalScriptCode": null, 10 | "_scriptCode": null, 11 | "columnNumber": null, 12 | "fileName": null, 13 | "functionName": null, 14 | "lineNumber": null, 15 | } 16 | `; 17 | 18 | exports[`proper full shape 1`] = ` 19 | StackFrame { 20 | "_originalColumnNumber": 13, 21 | "_originalFileName": "test.js", 22 | "_originalFunctionName": "apple", 23 | "_originalLineNumber": 37, 24 | "_originalScriptCode": null, 25 | "_scriptCode": null, 26 | "columnNumber": 37, 27 | "fileName": "b.js", 28 | "functionName": "a", 29 | "lineNumber": 13, 30 | } 31 | `; 32 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/extract-source-map.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { extractSourceMapUrl } from '../utils/getSourceMap'; 9 | 10 | test('extracts last source map directive', async () => { 11 | const res = await extractSourceMapUrl( 12 | `test.js`, 13 | `//# sourceMappingURL=test.js.map\nconsole.log('a')\n//# sourceMappingURL=bundle.js.map` 14 | ); 15 | expect(res).toBe('bundle.js.map'); 16 | }); 17 | 18 | test('errors when no source map', async () => { 19 | const testFileName = 'test.js'; 20 | let error; 21 | try { 22 | await extractSourceMapUrl( 23 | testFileName, 24 | `console.log('hi')\n\nconsole.log('bye')` 25 | ); 26 | } catch (e) { 27 | error = e; 28 | } 29 | expect(error).toBe(`Cannot find a source map directive for ${testFileName}.`); 30 | }); 31 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/lines-around.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { getLinesAround } from '../utils/getLinesAround'; 9 | 10 | const arr = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight']; 11 | 12 | test('should return lines around from a string', () => { 13 | expect(getLinesAround(4, 2, arr)).toMatchSnapshot(); 14 | }); 15 | 16 | test('should return lines around from an array', () => { 17 | expect(getLinesAround(4, 2, arr.join('\n'))).toMatchSnapshot(); 18 | }); 19 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/parser/chrome.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { parse } from '../../utils/parser'; 9 | 10 | test('stack with eval', () => { 11 | expect( 12 | parse( 13 | `TypeError: window[f] is not a function 14 | at e (file:///Users/joe/Documents/Development/OSS/stack-frame/index.html:25:18) 15 | at eval (eval at c (file:///Users/joe/Documents/Development/OSS/stack-frame/index.html:12:9), :1:1) 16 | at a (file:///Users/joe/Documents/Development/OSS/stack-frame/index.html:8:9) 17 | at file:///Users/joe/Documents/Development/OSS/stack-frame/index.html:32:7` 18 | ) 19 | ).toMatchSnapshot(); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/parser/generic.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { parse } from '../../utils/parser'; 9 | 10 | test('throws on null', () => { 11 | let error; 12 | try { 13 | parse(null); 14 | } catch (e) { 15 | error = e; 16 | } 17 | expect(error instanceof Error).toBe(true); 18 | expect(error.message).toBe('You cannot pass a null object.'); 19 | }); 20 | 21 | test('throws on unparsable', () => { 22 | let error; 23 | try { 24 | parse({}); 25 | } catch (e) { 26 | error = e; 27 | } 28 | expect(error instanceof Error).toBe(true); 29 | expect(error.message).toBe( 30 | 'The error you provided does not contain a stack trace.' 31 | ); 32 | }); 33 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/parser/react.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { parse } from '../../utils/parser'; 9 | 10 | test('15.y.z', () => { 11 | expect( 12 | parse( 13 | `Warning: Each child in array should have a unique "key" prop. Check render method of \`FileA\`. 14 | in div (at FileA.js:9) 15 | in FileA (at App.js:9) 16 | in div (at App.js:8) 17 | in App (at index.js:7)` 18 | ) 19 | ).toMatchSnapshot(); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/parser/safari.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { parse } from '../../utils/parser'; 9 | 10 | test('stack with eval', () => { 11 | expect( 12 | parse( 13 | `e@file:///Users/joe/Documents/Development/OSS/stack-frame/index.html:25:18 14 | eval code 15 | eval@[native code] 16 | a@file:///Users/joe/Documents/Development/OSS/stack-frame/index.html:8:10 17 | global code@file:///Users/joe/Documents/Development/OSS/stack-frame/index.html:32:8` 18 | ) 19 | ).toMatchSnapshot(); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/script-lines.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { ScriptLine } from '../utils/stack-frame'; 9 | 10 | test('script line shape', () => { 11 | expect(new ScriptLine(5, 'foobar', true)).toMatchSnapshot(); 12 | }); 13 | 14 | test('script line to provide default highlight', () => { 15 | expect(new ScriptLine(5, 'foobar')).toMatchSnapshot(); 16 | }); 17 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/setupJest.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | global.fetch = require('jest-fetch-mock'); 9 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/__tests__/stack-frame.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import { StackFrame } from '../utils/stack-frame'; 9 | 10 | test('proper empty shape', () => { 11 | const empty = new StackFrame(); 12 | expect(empty).toMatchSnapshot(); 13 | 14 | expect(empty.getFunctionName()).toBe('(anonymous function)'); 15 | expect(empty.getSource()).toBe(''); 16 | expect(empty.toString()).toBe('(anonymous function)'); 17 | }); 18 | 19 | test('proper full shape', () => { 20 | const empty = new StackFrame( 21 | 'a', 22 | 'b.js', 23 | 13, 24 | 37, 25 | undefined, 26 | 'apple', 27 | 'test.js', 28 | 37, 29 | 13 30 | ); 31 | expect(empty).toMatchSnapshot(); 32 | 33 | expect(empty.getFunctionName()).toBe('a'); 34 | expect(empty.getSource()).toBe('b.js:13:37'); 35 | expect(empty.toString()).toBe('a (b.js:13:37)'); 36 | }); 37 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/components/CloseButton.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | import React, { useContext } from 'react'; 10 | import { ThemeContext } from '../iframeScript'; 11 | import type { Theme } from '../styles'; 12 | 13 | const closeButtonStyle = (theme: Theme) => ({ 14 | color: theme.closeColor, 15 | lineHeight: '1rem', 16 | fontSize: '1.5rem', 17 | padding: '1rem', 18 | cursor: 'pointer', 19 | position: 'absolute', 20 | right: 0, 21 | top: 0, 22 | }); 23 | 24 | type CloseButtonPropsType = {| 25 | close: () => void, 26 | |}; 27 | 28 | function CloseButton({ close }: CloseButtonPropsType) { 29 | const theme = useContext(ThemeContext); 30 | return ( 31 | 36 | × 37 | 38 | ); 39 | } 40 | 41 | export default CloseButton; 42 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/components/Footer.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | import React, { useContext } from 'react'; 10 | import { ThemeContext } from '../iframeScript'; 11 | import type { Theme } from '../styles'; 12 | 13 | const footerStyle = (theme: Theme) => ({ 14 | fontFamily: 'sans-serif', 15 | color: theme.footer, 16 | marginTop: '0.5rem', 17 | flex: '0 0 auto', 18 | }); 19 | 20 | type FooterPropsType = {| 21 | line1: string, 22 | line2?: string, 23 | |}; 24 | 25 | function Footer(props: FooterPropsType) { 26 | const theme = useContext(ThemeContext); 27 | return ( 28 |
29 | {props.line1} 30 |
31 | {props.line2} 32 |
33 | ); 34 | } 35 | 36 | export default Footer; 37 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/components/Header.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | import React, { useContext } from 'react'; 10 | import { ThemeContext } from '../iframeScript'; 11 | import type { Theme } from '../styles'; 12 | 13 | const headerStyle = (theme: Theme) => ({ 14 | fontSize: '2em', 15 | fontFamily: 'sans-serif', 16 | color: theme.headerColor, 17 | whiteSpace: 'pre-wrap', 18 | // Top bottom margin spaces header 19 | // Right margin revents overlap with close button 20 | margin: '0 2rem 0.75rem 0', 21 | flex: '0 0 auto', 22 | maxHeight: '50%', 23 | overflow: 'auto', 24 | }); 25 | 26 | type HeaderPropType = {| 27 | headerText: string, 28 | |}; 29 | 30 | function Header(props: HeaderPropType) { 31 | const theme = useContext(ThemeContext); 32 | return
{props.headerText}
; 33 | } 34 | 35 | export default Header; 36 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/effects/stackTraceLimit.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | let stackTraceRegistered: boolean = false; 10 | // Default: https://docs.microsoft.com/en-us/scripting/javascript/reference/stacktracelimit-property-error-javascript 11 | let restoreStackTraceValue: number = 10; 12 | 13 | const MAX_STACK_LENGTH: number = 50; 14 | 15 | function registerStackTraceLimit(limit: number = MAX_STACK_LENGTH) { 16 | if (stackTraceRegistered) { 17 | return; 18 | } 19 | try { 20 | restoreStackTraceValue = Error.stackTraceLimit; 21 | Error.stackTraceLimit = limit; 22 | stackTraceRegistered = true; 23 | } catch (e) { 24 | // Not all browsers support this so we don't care if it errors 25 | } 26 | } 27 | 28 | function unregisterStackTraceLimit() { 29 | if (!stackTraceRegistered) { 30 | return; 31 | } 32 | try { 33 | Error.stackTraceLimit = restoreStackTraceValue; 34 | stackTraceRegistered = false; 35 | } catch (e) { 36 | // Not all browsers support this so we don't care if it errors 37 | } 38 | } 39 | 40 | export { 41 | registerStackTraceLimit as register, 42 | unregisterStackTraceLimit as unregister, 43 | }; 44 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/utils/dom/absolutifyCaret.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | function removeNextBr(parent, component: ?Element) { 10 | while (component != null && component.tagName.toLowerCase() !== 'br') { 11 | component = component.nextElementSibling; 12 | } 13 | if (component != null) { 14 | parent.removeChild(component); 15 | } 16 | } 17 | 18 | function absolutifyCaret(component: Node) { 19 | const ccn = component.childNodes; 20 | for (let index = 0; index < ccn.length; ++index) { 21 | const c = ccn[index]; 22 | // $FlowFixMe 23 | if (c.tagName.toLowerCase() !== 'span') { 24 | continue; 25 | } 26 | const _text = c.innerText; 27 | if (_text == null) { 28 | continue; 29 | } 30 | const text = _text.replace(/\s/g, ''); 31 | if (text !== '|^') { 32 | continue; 33 | } 34 | // $FlowFixMe 35 | c.style.position = 'absolute'; 36 | // $FlowFixMe 37 | removeNextBr(component, c); 38 | } 39 | } 40 | 41 | export { absolutifyCaret }; 42 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/utils/getLinesAround.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | import { ScriptLine } from './stack-frame'; 10 | 11 | /** 12 | * 13 | * @param {number} line The line number to provide context around. 14 | * @param {number} count The number of lines you'd like for context. 15 | * @param {string[] | string} lines The source code. 16 | */ 17 | function getLinesAround( 18 | line: number, 19 | count: number, 20 | lines: string[] | string 21 | ): ScriptLine[] { 22 | if (typeof lines === 'string') { 23 | lines = lines.split('\n'); 24 | } 25 | const result = []; 26 | for ( 27 | let index = Math.max(0, line - 1 - count); 28 | index <= Math.min(lines.length - 1, line - 1 + count); 29 | ++index 30 | ) { 31 | result.push(new ScriptLine(index + 1, lines[index], index === line - 1)); 32 | } 33 | return result; 34 | } 35 | 36 | export { getLinesAround }; 37 | export default getLinesAround; 38 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/utils/isBultinErrorName.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | function isBultinErrorName(errorName: ?string) { 10 | switch (errorName) { 11 | case 'EvalError': 12 | case 'InternalError': 13 | case 'RangeError': 14 | case 'ReferenceError': 15 | case 'SyntaxError': 16 | case 'TypeError': 17 | case 'URIError': 18 | return true; 19 | default: 20 | return false; 21 | } 22 | } 23 | 24 | export { isBultinErrorName }; 25 | export default isBultinErrorName; 26 | -------------------------------------------------------------------------------- /packages/react-error-overlay/src/utils/isInternalFile.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* @flow */ 9 | function isInternalFile(sourceFileName: ?string, fileName: ?string) { 10 | return ( 11 | sourceFileName == null || 12 | sourceFileName === '' || 13 | sourceFileName.indexOf('/~/') !== -1 || 14 | sourceFileName.indexOf('/node_modules/') !== -1 || 15 | sourceFileName.trim().indexOf(' ') !== -1 || 16 | fileName == null || 17 | fileName === '' 18 | ); 19 | } 20 | 21 | export { isInternalFile }; 22 | -------------------------------------------------------------------------------- /packages/react-error-overlay/webpack.config.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 'use strict'; 8 | 9 | const path = require('path'); 10 | 11 | module.exports = { 12 | mode: process.env.NODE_ENV === 'production' ? 'production' : 'development', 13 | entry: './src/index.js', 14 | output: { 15 | path: path.join(__dirname, './lib'), 16 | filename: 'index.js', 17 | library: 'ReactErrorOverlay', 18 | libraryTarget: 'umd', 19 | }, 20 | module: { 21 | rules: [ 22 | { 23 | test: /iframe-bundle\.js$/, 24 | use: 'raw-loader', 25 | }, 26 | { 27 | test: /\.js$/, 28 | include: path.resolve(__dirname, './src'), 29 | use: 'babel-loader', 30 | }, 31 | ], 32 | }, 33 | resolve: { 34 | alias: { 35 | iframeScript$: path.resolve(__dirname, './lib/iframe-bundle.js'), 36 | }, 37 | fallback: { 38 | fs: false, 39 | path: false, 40 | }, 41 | }, 42 | optimization: { 43 | nodeEnv: false, 44 | }, 45 | performance: { 46 | hints: false, 47 | }, 48 | }; 49 | -------------------------------------------------------------------------------- /packages/react-scripts/.npmignore: -------------------------------------------------------------------------------- 1 | /fixtures 2 | -------------------------------------------------------------------------------- /packages/react-scripts/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2013-present, Facebook, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/react-scripts/README.md: -------------------------------------------------------------------------------- 1 | # react-scripts 2 | 3 | This package includes scripts and configuration used by [Create React App](https://github.com/facebook/create-react-app).
4 | Please refer to its documentation: 5 | 6 | - [Getting Started](https://facebook.github.io/create-react-app/docs/getting-started) – How to create a new app. 7 | - [User Guide](https://facebook.github.io/create-react-app/) – How to develop apps bootstrapped with Create React App. 8 | -------------------------------------------------------------------------------- /packages/react-scripts/config/jest/babelTransform.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2014-present, Facebook, Inc. 4 | * 5 | * This source code is licensed under the MIT license found in the 6 | * LICENSE file in the root directory of this source tree. 7 | */ 8 | // @remove-on-eject-end 9 | 'use strict'; 10 | 11 | const babelJest = require('babel-jest').default; 12 | 13 | const hasJsxRuntime = (() => { 14 | if (process.env.DISABLE_NEW_JSX_TRANSFORM === 'true') { 15 | return false; 16 | } 17 | 18 | try { 19 | require.resolve('react/jsx-runtime'); 20 | return true; 21 | } catch (e) { 22 | return false; 23 | } 24 | })(); 25 | 26 | module.exports = babelJest.createTransformer({ 27 | presets: [ 28 | [ 29 | require.resolve('babel-preset-react-app'), 30 | { 31 | runtime: hasJsxRuntime ? 'automatic' : 'classic', 32 | }, 33 | ], 34 | ], 35 | babelrc: false, 36 | configFile: false, 37 | }); 38 | -------------------------------------------------------------------------------- /packages/react-scripts/config/jest/cssTransform.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2014-present, Facebook, Inc. 4 | * 5 | * This source code is licensed under the MIT license found in the 6 | * LICENSE file in the root directory of this source tree. 7 | */ 8 | // @remove-on-eject-end 9 | 'use strict'; 10 | 11 | // This is a custom Jest transformer turning style imports into empty objects. 12 | // http://facebook.github.io/jest/docs/en/webpack.html 13 | 14 | module.exports = { 15 | process() { 16 | return 'module.exports = {};'; 17 | }, 18 | getCacheKey() { 19 | // The output is always the same. 20 | return 'cssTransform'; 21 | }, 22 | }; 23 | -------------------------------------------------------------------------------- /packages/react-scripts/config/webpack/persistentCache/createEnvironmentHash.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | const { createHash } = require('crypto'); 3 | 4 | module.exports = env => { 5 | const hash = createHash('md5'); 6 | hash.update(JSON.stringify(env)); 7 | 8 | return hash.digest('hex'); 9 | }; 10 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "kitchensink", 3 | "main": "template.json", 4 | "version": "1.0.0" 5 | } 6 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template.json: -------------------------------------------------------------------------------- 1 | { 2 | "package": { 3 | "dependencies": { 4 | "bootstrap": "4.3.1", 5 | "jest": "27.1.0", 6 | "node-sass": "6.x", 7 | "normalize.css": "7.0.0", 8 | "prop-types": "15.7.2", 9 | "test-integrity": "2.0.1" 10 | } 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/.env: -------------------------------------------------------------------------------- 1 | REACT_APP_X = x-from-original-env 2 | REACT_APP_ORIGINAL_1 = from-original-env-1 3 | REACT_APP_ORIGINAL_2 = from-original-env-2 4 | REACT_APP_BASIC = basic 5 | REACT_APP_BASIC_EXPAND = ${REACT_APP_BASIC} 6 | REACT_APP_BASIC_EXPAND_SIMPLE = $REACT_APP_BASIC 7 | REACT_APP_EXPAND_EXISTING = $REACT_APP_SHELL_ENV_MESSAGE 8 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/.env.development: -------------------------------------------------------------------------------- 1 | REACT_APP_X = x-from-development-env 2 | REACT_APP_DEVELOPMENT = development 3 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/.env.local: -------------------------------------------------------------------------------- 1 | REACT_APP_X = x-from-original-local-env 2 | REACT_APP_ORIGINAL_2 = override-from-original-local-env-2 3 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/.env.production: -------------------------------------------------------------------------------- 1 | REACT_APP_X = x-from-production-env 2 | REACT_APP_PRODUCTION = production 3 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/.flowconfig: -------------------------------------------------------------------------------- 1 | [ignore] 2 | /node_modules/fbjs/.* 3 | 4 | [include] 5 | 6 | [libs] 7 | 8 | [options] 9 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | node_modules 5 | 6 | # testing 7 | coverage 8 | 9 | # production 10 | build 11 | 12 | # misc 13 | .DS_Store 14 | .env 15 | npm-debug.log 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/integration/config.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import initDOM from './initDOM'; 9 | 10 | describe('Integration', () => { 11 | describe('jsconfig.json/tsconfig.json', () => { 12 | let doc; 13 | 14 | afterEach(() => { 15 | doc && doc.defaultView.close(); 16 | doc = undefined; 17 | }); 18 | 19 | it('Supports setting baseUrl to src', async () => { 20 | doc = await initDOM('base-url'); 21 | 22 | expect(doc.getElementById('feature-base-url').childElementCount).toBe(4); 23 | }); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/jest.integration.config.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | module.exports = { 4 | testEnvironment: 'node', 5 | testMatch: ['**/integration/*.test.js'], 6 | transform: { '^.+\\.js$': './jest.transform.js' }, 7 | }; 8 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/jest.transform.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const babelOptions = { presets: ['react-app'] }; 4 | 5 | const babelJest = require('babel-jest').default; 6 | 7 | module.exports = babelJest.createTransformer(babelOptions); 8 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/jsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": "src" 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/react-scripts/fixtures/kitchensink/template/public/favicon.ico -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | React App 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/absoluteLoad.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | const absoluteLoad = () => [ 9 | { id: 1, name: '1' }, 10 | { id: 2, name: '2' }, 11 | { id: 3, name: '3' }, 12 | { id: 4, name: '4' }, 13 | ]; 14 | 15 | export default absoluteLoad; 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/config/BaseUrl.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | import load from 'absoluteLoad'; 11 | 12 | export default class BaseUrl extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired, 15 | }; 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load(); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/config/BaseUrl.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ReactDOMClient from 'react-dom/client'; 10 | import NodePath from './BaseUrl'; 11 | 12 | describe('BASE_URL', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render(); 17 | }); 18 | }); 19 | }); 20 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/ExpandEnvVariables.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | 10 | const ExpandEnvVariables = () => ( 11 | 12 | {process.env.REACT_APP_BASIC} 13 | {process.env.REACT_APP_BASIC_EXPAND} 14 | 15 | {process.env.REACT_APP_BASIC_EXPAND_SIMPLE} 16 | 17 | 18 | {process.env.REACT_APP_EXPAND_EXISTING} 19 | 20 | 21 | ); 22 | 23 | export default ExpandEnvVariables; 24 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/ExpandEnvVariables.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ReactDOMClient from 'react-dom/client'; 10 | import ExpandEnvVariables from './ExpandEnvVariables'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('expand .env variables', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/FileEnvVariables.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | 10 | const FileEnvVariables = () => ( 11 | 12 | 13 | {process.env.REACT_APP_ORIGINAL_1} 14 | 15 | 16 | {process.env.REACT_APP_ORIGINAL_2} 17 | 18 | 19 | {process.env.REACT_APP_DEVELOPMENT} 20 | {process.env.REACT_APP_PRODUCTION} 21 | 22 | {process.env.REACT_APP_X} 23 | 24 | ); 25 | 26 | export default FileEnvVariables; 27 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/FileEnvVariables.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import FileEnvVariables from './FileEnvVariables'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('.env variables', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/PublicUrl.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | 10 | const PublicUrl = () => ( 11 | {process.env.PUBLIC_URL}. 12 | ); 13 | 14 | export default PublicUrl; 15 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/PublicUrl.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import PublicUrl from './PublicUrl'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('PUBLIC_URL', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/ShellEnvVariables.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | 10 | const ShellEnvVariables = () => ( 11 | 12 | {process.env.REACT_APP_SHELL_ENV_MESSAGE}. 13 | 14 | ); 15 | 16 | export default ShellEnvVariables; 17 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/env/ShellEnvVariables.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ShellEnvVariables from './ShellEnvVariables'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('shell env variables', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ArrayDestructuring.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load() { 12 | return [ 13 | [1, '1'], 14 | [2, '2'], 15 | [3, '3'], 16 | [4, '4'], 17 | ]; 18 | } 19 | 20 | export default class ArrayDestructuring extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load(); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => { 43 | const [id, name] = user; 44 | return
{name}
; 45 | })} 46 |
47 | ); 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ArrayDestructuring.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ArrayDestructuring from './ArrayDestructuring'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('array destructuring', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ArraySpread.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load(users) { 12 | return [ 13 | { id: 1, name: '1' }, 14 | { id: 2, name: '2' }, 15 | { id: 3, name: '3' }, 16 | ...users, 17 | ]; 18 | } 19 | 20 | export default class ArraySpread extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load([{ id: 42, name: '42' }]); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user.name}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ArraySpread.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ArraySpread from './ArraySpread'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('array spread', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render(); 17 | }); 18 | }); 19 | }); 20 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/AsyncAwait.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import AsyncAwait from './AsyncAwait'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('async/await', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render(); 17 | }); 18 | }); 19 | }); 20 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ClassProperties.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | export default class ClassProperties extends Component { 12 | static propTypes = { 13 | onReady: PropTypes.func.isRequired, 14 | }; 15 | 16 | users = [ 17 | { id: 1, name: '1' }, 18 | { id: 2, name: '2' }, 19 | { id: 3, name: '3' }, 20 | { id: 4, name: '4' }, 21 | ]; 22 | 23 | componentDidMount() { 24 | this.props.onReady(); 25 | } 26 | 27 | render() { 28 | return ( 29 |
30 | {this.users.map(user => ( 31 |
{user.name}
32 | ))} 33 |
34 | ); 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ClassProperties.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ClassProperties from './ClassProperties'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('class properties', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ComputedProperties.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load(prefix) { 12 | return [ 13 | { id: 1, [`${prefix} name`]: '1' }, 14 | { id: 2, [`${prefix} name`]: '2' }, 15 | { id: 3, [`${prefix} name`]: '3' }, 16 | { id: 4, [`${prefix} name`]: '4' }, 17 | ]; 18 | } 19 | 20 | export default class ComputedProperties extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load('user_'); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user.user_name}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ComputedProperties.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ComputedProperties from './ComputedProperties'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('computed properties', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/CustomInterpolation.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import CustomInterpolation from './CustomInterpolation'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('custom interpolation', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/DefaultParameters.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load(id = 0) { 12 | return [ 13 | { id: id + 1, name: '1' }, 14 | { id: id + 2, name: '2' }, 15 | { id: id + 3, name: '3' }, 16 | { id: id + 4, name: '4' }, 17 | ]; 18 | } 19 | 20 | export default class DefaultParameters extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load(); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user.name}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/DefaultParameters.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import DefaultParameters from './DefaultParameters'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('default parameters', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/DestructuringAndAwait.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | async function load() { 12 | return { 13 | users: [ 14 | { id: 1, name: '1' }, 15 | { id: 2, name: '2' }, 16 | { id: 3, name: '3' }, 17 | { id: 4, name: '4' }, 18 | ], 19 | }; 20 | } 21 | 22 | export default class DestructuringAndAwait extends Component { 23 | static propTypes = { 24 | onReady: PropTypes.func.isRequired, 25 | }; 26 | 27 | constructor(props) { 28 | super(props); 29 | this.state = { users: [] }; 30 | } 31 | 32 | async componentDidMount() { 33 | const { users } = await load(); 34 | this.setState({ users }); 35 | } 36 | 37 | componentDidUpdate() { 38 | this.props.onReady(); 39 | } 40 | 41 | render() { 42 | return ( 43 |
44 | {this.state.users.map(user => ( 45 |
{user.name}
46 | ))} 47 |
48 | ); 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/DestructuringAndAwait.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import DestructuringAndAwait from './DestructuringAndAwait'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('destructuring and await', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/Generators.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function* load(limit) { 12 | let i = 1; 13 | while (i <= limit) { 14 | yield { id: i, name: i }; 15 | i++; 16 | } 17 | } 18 | 19 | export default class Generators extends Component { 20 | static propTypes = { 21 | onReady: PropTypes.func.isRequired, 22 | }; 23 | 24 | constructor(props) { 25 | super(props); 26 | this.state = { users: [] }; 27 | } 28 | 29 | componentDidMount() { 30 | const users = []; 31 | for (let user of load(4)) { 32 | users.push(user); 33 | } 34 | this.setState({ users }); 35 | } 36 | 37 | componentDidUpdate() { 38 | this.props.onReady(); 39 | } 40 | 41 | render() { 42 | return ( 43 |
44 | {this.state.users.map(user => ( 45 |
{user.name}
46 | ))} 47 |
48 | ); 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/Generators.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import Generators from './Generators'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('generators', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render(); 17 | }); 18 | }); 19 | }); 20 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/NullishCoalescing.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load() { 12 | return [ 13 | { id: 1, name: '1' }, 14 | { id: 2, name: '2' }, 15 | { id: 3, name: '3' }, 16 | { id: 4, name: '4' }, 17 | ]; 18 | } 19 | 20 | export default class NullishCoalescing extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load(); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user.name ?? 'John Doe'}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/NullishCoalescing.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import NullishCoalescing from './NullishCoalescing'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('nullish coalescing', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ObjectDestructuring.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ObjectDestructuring from './ObjectDestructuring'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('object destructuring', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ObjectSpread.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load(baseUser) { 12 | return [ 13 | { id: 1, name: '1', ...baseUser }, 14 | { id: 2, name: '2', ...baseUser }, 15 | { id: 3, name: '3', ...baseUser }, 16 | { id: 4, name: '4', ...baseUser }, 17 | ]; 18 | } 19 | 20 | export default class ObjectSpread extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load({ age: 42 }); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
44 | {user.name}: {user.age} 45 |
46 | ))} 47 |
48 | ); 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/ObjectSpread.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ObjectSpread from './ObjectSpread'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('object spread', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render(); 17 | }); 18 | }); 19 | }); 20 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/OptionalChaining.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load() { 12 | return [ 13 | { id: 1, name: '1' }, 14 | { id: 2, name: '2' }, 15 | { id: 3, name: '3' }, 16 | { id: 4, name: '4' }, 17 | ]; 18 | } 19 | 20 | export default class OptionalChaining extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load?.(); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user?.name}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/OptionalChaining.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import OptionalChaining from './OptionalChaining'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('optional chaining', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/Promises.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load() { 12 | return Promise.resolve([ 13 | { id: 1, name: '1' }, 14 | { id: 2, name: '2' }, 15 | { id: 3, name: '3' }, 16 | { id: 4, name: '4' }, 17 | ]); 18 | } 19 | 20 | export default class Promises extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | componentDidMount() { 31 | load().then(users => { 32 | this.setState({ users }); 33 | }); 34 | } 35 | 36 | componentDidUpdate() { 37 | this.props.onReady(); 38 | } 39 | 40 | render() { 41 | return ( 42 |
43 | {this.state.users.map(user => ( 44 |
{user.name}
45 | ))} 46 |
47 | ); 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/Promises.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ReactDOMClient from 'react-dom/client'; 10 | 11 | describe('promises', () => { 12 | it('renders without crashing', () => { 13 | const div = document.createElement('div'); 14 | return import('./Promises').then(({ default: Promises }) => { 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render(); 17 | }); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/RestAndDefault.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load({ id, ...rest } = { id: 0, user: { id: 42, name: '42' } }) { 12 | return [ 13 | { id: id + 1, name: '1' }, 14 | { id: id + 2, name: '2' }, 15 | { id: id + 3, name: '3' }, 16 | rest.user, 17 | ]; 18 | } 19 | 20 | export default class RestAndDefault extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load(); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user.name}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/RestAndDefault.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import RestAndDefault from './RestAndDefault'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('rest + default', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/RestParameters.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load({ id = 0, ...rest }) { 12 | return [ 13 | { id: id + 1, name: '1' }, 14 | { id: id + 2, name: '2' }, 15 | { id: id + 3, name: '3' }, 16 | rest.user, 17 | ]; 18 | } 19 | 20 | export default class RestParameters extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load({ id: 0, user: { id: 42, name: '42' } }); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user.name}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/RestParameters.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import RestParameters from './RestParameters'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('rest parameters', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/TemplateInterpolation.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | import PropTypes from 'prop-types'; 10 | 11 | function load(name) { 12 | return [ 13 | { id: 1, name: `${name}1` }, 14 | { id: 2, name: `${name}2` }, 15 | { id: 3, name: `${name}3` }, 16 | { id: 4, name: `${name}4` }, 17 | ]; 18 | } 19 | 20 | export default class TemplateInterpolation extends Component { 21 | static propTypes = { 22 | onReady: PropTypes.func.isRequired, 23 | }; 24 | 25 | constructor(props) { 26 | super(props); 27 | this.state = { users: [] }; 28 | } 29 | 30 | async componentDidMount() { 31 | const users = load('user_'); 32 | this.setState({ users }); 33 | } 34 | 35 | componentDidUpdate() { 36 | this.props.onReady(); 37 | } 38 | 39 | render() { 40 | return ( 41 |
42 | {this.state.users.map(user => ( 43 |
{user.name}
44 | ))} 45 |
46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/syntax/TemplateInterpolation.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import TemplateInterpolation from './TemplateInterpolation'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | describe('template interpolation', () => { 13 | it('renders without crashing', () => { 14 | const div = document.createElement('div'); 15 | return new Promise(resolve => { 16 | ReactDOMClient.createRoot(div).render( 17 | 18 | ); 19 | }); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/CssInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import './assets/style.css'; 10 | 11 | const CssInclusion = () => ( 12 |

We love useless text.

13 | ); 14 | 15 | export default CssInclusion; 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/CssInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import CssInclusion from './CssInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('css inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/CssModulesInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import styles from './assets/style.module.css'; 10 | import indexStyles from './assets/index.module.css'; 11 | 12 | const CssModulesInclusion = () => ( 13 |
14 |

CSS Modules are working!

15 |

16 | CSS Modules with index are working! 17 |

18 |
19 | ); 20 | 21 | export default CssModulesInclusion; 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/CssModulesInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import CssModulesInclusion from './CssModulesInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('css modules inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/DynamicImport.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | 10 | const DynamicImport = () => { 11 | return <>Hello World!; 12 | }; 13 | 14 | export default DynamicImport; 15 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/DynamicImport.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ReactDOMClient from 'react-dom/client'; 10 | import { flushSync } from 'react-dom'; 11 | 12 | describe('dynamic import', () => { 13 | it('renders without crashing', async () => { 14 | const DynamicImport = (await import('./DynamicImport')).default; 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | expect(div.textContent).toBe('Hello World!'); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/ImageInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import tiniestCat from './assets/tiniest-cat.jpg'; 10 | 11 | const ImageInclusion = () => ( 12 | tiniest cat 13 | ); 14 | 15 | export default ImageInclusion; 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/ImageInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ImageInclusion from './ImageInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('image inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/JsonInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import abstractJson from './assets/abstract.json'; 10 | 11 | const { abstract } = abstractJson; 12 | 13 | const JsonInclusion = () => ( 14 | {abstract} 15 | ); 16 | 17 | export default JsonInclusion; 18 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/JsonInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import JsonInclusion from './JsonInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('JSON inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/LinkedModules.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import './assets/style.css'; 10 | import { test, version } from 'test-integrity'; 11 | 12 | const LinkedModules = () => { 13 | const v = version(); 14 | if (!test() || v !== '2.0.0') { 15 | throw new Error('Functionality test did not pass.'); 16 | } 17 | return

{v}

; 18 | }; 19 | 20 | export default LinkedModules; 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/LinkedModules.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ReactDOMClient from 'react-dom/client'; 10 | import { test, version } from 'test-integrity'; 11 | import LinkedModules from './LinkedModules'; 12 | import { flushSync } from 'react-dom'; 13 | 14 | describe('linked modules', () => { 15 | it('has integrity', () => { 16 | expect(test()).toBeTruthy(); 17 | expect(version() === '2.0.0').toBeTruthy(); 18 | }); 19 | 20 | it('renders without crashing', () => { 21 | const div = document.createElement('div'); 22 | flushSync(() => { 23 | ReactDOMClient.createRoot(div).render(); 24 | }); 25 | }); 26 | }); 27 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/NoExtInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import aFileWithoutExt from './assets/aFileWithoutExt'; 10 | 11 | const text = aFileWithoutExt.includes('base64') 12 | ? atob(aFileWithoutExt.split('base64,')[1]).trim() 13 | : aFileWithoutExt; 14 | 15 | const NoExtInclusion = () => ( 16 | 17 | aFileWithoutExt 18 | 19 | ); 20 | 21 | export default NoExtInclusion; 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/NoExtInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import NoExtInclusion from './NoExtInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('no ext inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SassInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import './assets/sass-styles.sass'; 10 | 11 | const SassInclusion = () => ( 12 |

We love useless text.

13 | ); 14 | 15 | export default SassInclusion; 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SassInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import SassInclusion from './SassInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('sass inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SassModulesInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import styles from './assets/sass-styles.module.sass'; 10 | import indexStyles from './assets/index.module.sass'; 11 | 12 | const SassModulesInclusion = () => ( 13 |
14 |

SASS Modules are working!

15 |

16 | SASS Modules with index are working! 17 |

18 |
19 | ); 20 | 21 | export default SassModulesInclusion; 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SassModulesInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import SassModulesInclusion from './SassModulesInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('sass modules inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/ScssInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import './assets/scss-styles.scss'; 10 | 11 | const ScssInclusion = () => ( 12 |

We love useless text.

13 | ); 14 | 15 | export default ScssInclusion; 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/ScssInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ScssInclusion from './ScssInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('scss inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/ScssModulesInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import styles from './assets/scss-styles.module.scss'; 10 | import indexStyles from './assets/index.module.scss'; 11 | 12 | const ScssModulesInclusion = () => ( 13 |
14 |

SCSS Modules are working!

15 |

16 | SCSS Modules with index are working! 17 |

18 |
19 | ); 20 | 21 | export default ScssModulesInclusion; 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/ScssModulesInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ScssModulesInclusion from './ScssModulesInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('scss modules inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SvgComponent.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import { ReactComponent as Logo } from './assets/logo.svg'; 10 | 11 | const SvgComponent = () => { 12 | return ; 13 | }; 14 | 15 | export const SvgComponentWithRef = React.forwardRef((props, ref) => ( 16 | 17 | )); 18 | 19 | export default SvgComponent; 20 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SvgComponent.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import * as React from 'react'; 9 | import SvgComponent, { SvgComponentWithRef } from './SvgComponent'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | // TODO: these fail with React 19 due to the JSX transform mismatch. 14 | describe.skip('svg component', () => { 15 | it('renders without crashing', async () => { 16 | const div = document.createElement('div'); 17 | flushSync(() => { 18 | ReactDOMClient.createRoot(div).render(); 19 | }); 20 | expect(div.textContent).toBe('logo.svg'); 21 | }); 22 | 23 | it('svg root element equals the passed ref', async () => { 24 | const div = document.createElement('div'); 25 | const someRef = React.createRef(); 26 | flushSync(() => { 27 | ReactDOMClient.createRoot(div).render( 28 | 29 | ); 30 | }); 31 | const svgElement = div.getElementsByTagName('svg'); 32 | expect(svgElement).toHaveLength(1); 33 | expect(svgElement[0]).toBe(someRef.current); 34 | }); 35 | }); 36 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SvgInCss.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import './assets/svg.css'; 3 | 4 | const SvgInCss = () =>
; 5 | 6 | export default SvgInCss; 7 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SvgInCss.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import SvgInCss from './SvgInCss'; 3 | import ReactDOMClient from 'react-dom/client'; 4 | import { flushSync } from 'react-dom'; 5 | 6 | describe('svg in css', () => { 7 | it('renders without crashing', () => { 8 | const div = document.createElement('div'); 9 | flushSync(() => { 10 | ReactDOMClient.createRoot(div).render(); 11 | }); 12 | }); 13 | }); 14 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SvgInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import logo from './assets/logo.svg'; 10 | 11 | const SvgInclusion = () => ( 12 | logo 13 | ); 14 | 15 | export default SvgInclusion; 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/SvgInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import SvgInclusion from './SvgInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('svg inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/UnknownExtInclusion.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import aFileWithExtUnknown from './assets/aFileWithExt.unknown'; 10 | 11 | const text = aFileWithExtUnknown.includes('base64') 12 | ? atob(aFileWithExtUnknown.split('base64,')[1]).trim() 13 | : aFileWithExtUnknown; 14 | 15 | const UnknownExtInclusion = () => ( 16 | 17 | aFileWithExtUnknown 18 | 19 | ); 20 | 21 | export default UnknownExtInclusion; 22 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/UnknownExtInclusion.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import UnknownExtInclusion from './UnknownExtInclusion'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | import { flushSync } from 'react-dom'; 12 | 13 | describe('unknown ext inclusion', () => { 14 | it('renders without crashing', () => { 15 | const div = document.createElement('div'); 16 | flushSync(() => { 17 | ReactDOMClient.createRoot(div).render(); 18 | }); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/aFileWithExt.unknown: -------------------------------------------------------------------------------- 1 | Whoooo, spooky! 2 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/aFileWithoutExt: -------------------------------------------------------------------------------- 1 | This is just a file without an extension 2 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/abstract.json: -------------------------------------------------------------------------------- 1 | { 2 | "abstract": "This is an abstract." 3 | } 4 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/index.module.css: -------------------------------------------------------------------------------- 1 | .cssModulesIndexInclusion { 2 | background: darkblue; 3 | color: lightblue; 4 | } 5 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/index.module.sass: -------------------------------------------------------------------------------- 1 | .sassModulesIndexInclusion 2 | background: darkblue 3 | color: lightblue 4 | 5 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/index.module.scss: -------------------------------------------------------------------------------- 1 | .scssModulesIndexInclusion { 2 | background: darkblue; 3 | color: lightblue; 4 | } 5 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/sass-styles.module.sass: -------------------------------------------------------------------------------- 1 | .sassModulesInclusion 2 | background: darkblue 3 | color: lightblue 4 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/sass-styles.sass: -------------------------------------------------------------------------------- 1 | #feature-sass-inclusion 2 | background: ghostwhite 3 | color: crimson 4 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/scss-styles.module.scss: -------------------------------------------------------------------------------- 1 | .scssModulesInclusion { 2 | background: darkblue; 3 | color: lightblue; 4 | } 5 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/scss-styles.scss: -------------------------------------------------------------------------------- 1 | @import '~bootstrap/scss/functions'; 2 | @import '~bootstrap/scss/variables'; 3 | @import '~bootstrap/scss/mixins'; 4 | 5 | @import '~bootstrap/scss/reboot'; 6 | @import '~bootstrap/scss/type'; 7 | @import '~bootstrap/scss/images'; 8 | @import '~bootstrap/scss/code'; 9 | @import '~bootstrap/scss/grid'; 10 | 11 | #feature-scss-inclusion { 12 | background: ghostwhite; 13 | color: crimson; 14 | } 15 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/style.css: -------------------------------------------------------------------------------- 1 | /* 2 | * Ensure CSS inclusion doesn't regress 3 | * https://github.com/facebook/create-react-app/issues/2677 4 | */ 5 | @import '~normalize.css/normalize.css'; 6 | 7 | #feature-css-inclusion { 8 | background: palevioletred; 9 | color: papayawhip; 10 | } 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/style.module.css: -------------------------------------------------------------------------------- 1 | .cssModulesInclusion { 2 | background: darkblue; 3 | color: lightblue; 4 | } 5 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/svg.css: -------------------------------------------------------------------------------- 1 | #feature-svg-in-css { 2 | background-image: url('./logo.svg'); 3 | } 4 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/tiniest-cat.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/facebook/create-react-app/6254386531d263688ccfa542d0e628fbc0de0b28/packages/react-scripts/fixtures/kitchensink/template/src/features/webpack/assets/tiniest-cat.jpg -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import App from './App'; 10 | import ReactDOMClient from 'react-dom/client'; 11 | 12 | ReactDOMClient.createRoot(document.getElementById('root')).render(); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/template/src/subfolder/lol.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | module.exports = function () { 9 | return `haha`; 10 | }; 11 | -------------------------------------------------------------------------------- /packages/react-scripts/template-typescript/README.md: -------------------------------------------------------------------------------- 1 | This file has moved [here](https://github.com/facebook/create-react-app/blob/main/packages/cra-template-typescript/template/README.md) 2 | -------------------------------------------------------------------------------- /packages/react-scripts/template/README.md: -------------------------------------------------------------------------------- 1 | This file has moved [here](https://github.com/facebook/create-react-app/blob/main/packages/cra-template/template/README.md) 2 | -------------------------------------------------------------------------------- /tasks/.gitignore: -------------------------------------------------------------------------------- 1 | htpasswd 2 | storage 3 | -------------------------------------------------------------------------------- /tasks/local-registry.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | custom_registry_url=http://localhost:4873 4 | original_npm_registry_url=`npm get registry` 5 | original_yarn_registry_url=`yarn config get registry` 6 | default_verdaccio_package=verdaccio@^4.5.1 7 | 8 | function startLocalRegistry { 9 | # Start local registry 10 | tmp_registry_log=`mktemp` 11 | echo "Registry output file: $tmp_registry_log" 12 | (cd && nohup npx ${VERDACCIO_PACKAGE:-$default_verdaccio_package} -c $1 &>$tmp_registry_log &) 13 | # Wait for Verdaccio to boot 14 | grep -q 'http address' <(tail -f $tmp_registry_log) 15 | 16 | # Set registry to local registry 17 | npm set registry "$custom_registry_url" 18 | yarn config set registry "$custom_registry_url" 19 | } 20 | 21 | function stopLocalRegistry { 22 | # Restore the original NPM and Yarn registry URLs and stop Verdaccio 23 | npm set registry "$original_npm_registry_url" 24 | yarn config set registry "$original_yarn_registry_url" 25 | } 26 | 27 | function publishToLocalRegistry { 28 | git clean -df 29 | ./tasks/publish.sh prerelease --yes --force-publish=* --no-git-tag-version --no-commit-hooks --no-push --exact --dist-tag=latest 30 | } 31 | -------------------------------------------------------------------------------- /tasks/screencast.sh: -------------------------------------------------------------------------------- 1 | #!/bin/zsh 2 | # Copyright (c) 2015-present, Facebook, Inc. 3 | # 4 | # This source code is licensed under the MIT license found in the 5 | # LICENSE file in the root directory of this source tree. 6 | 7 | # ****************************************************************************** 8 | # This is an end-to-end test intended to be run via screencast.js 9 | # Dependencies: asciinema, pv, core-utils 10 | # ****************************************************************************** 11 | set -e 12 | 13 | printf '\e[32m%s\e[m' "λ " 14 | echo "npx create-react-app my-app" | pv -qL $[10+(-2 + RANDOM%5)] 15 | npx create-react-app my-app 16 | 17 | printf '\e[32m%s\e[m' "λ " 18 | sleep 1 19 | echo "cd my-app" | pv -qL $[10+(-2 + RANDOM%5)] 20 | cd my-app 21 | 22 | printf '\e[32m%s\e[m' "λ " 23 | sleep 1 24 | echo "npm start" | pv -qL $[10+(-2 + RANDOM%5)] 25 | 26 | BROWSER="none" node "$(dirname $0)/screencast-start.js" \ 27 | --command "npm start" \ 28 | --pattern="Compiled successfully*" \ 29 | --pattern-count 2 \ 30 | --error-pattern="*already running on port" \ 31 | --timeout 10 32 | 33 | echo "" -------------------------------------------------------------------------------- /test/fixtures/__shared__/template/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | React App 5 | 6 | 7 |
8 | 9 | 10 | -------------------------------------------------------------------------------- /test/fixtures/__shared__/test-setup.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const path = require('path'); 4 | const fs = require('fs-extra'); 5 | const TestSetup = require('./util/setup'); 6 | 7 | const fixturePath = path.dirname(module.parent.filename); 8 | const fixtureName = path.basename(fixturePath); 9 | const disablePnp = fs.existsSync(path.resolve(fixturePath, '.disable-pnp')); 10 | const testSetup = new TestSetup(fixtureName, fixturePath, { 11 | pnp: !disablePnp, 12 | }); 13 | 14 | beforeAll(async () => { 15 | await testSetup.setup(); 16 | }, 1000 * 60 * 5); 17 | afterAll(async () => { 18 | await testSetup.teardown(); 19 | }); 20 | 21 | beforeEach(() => jest.setTimeout(1000 * 60 * 5)); 22 | 23 | module.exports = testSetup; 24 | -------------------------------------------------------------------------------- /test/fixtures/boostrap-sass/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | if (testSetup.isLocal) { 6 | // TODO: make this work locally 7 | test('skipped locally', () => {}); 8 | } else { 9 | test('builds in development', async () => { 10 | const { fulfilled } = await testSetup.scripts.start({ smoke: true }); 11 | expect(fulfilled).toBe(true); 12 | }); 13 | 14 | test('builds in production', async () => { 15 | const { fulfilled } = await testSetup.scripts.build(); 16 | expect(fulfilled).toBe(true); 17 | }); 18 | } 19 | -------------------------------------------------------------------------------- /test/fixtures/boostrap-sass/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "bootstrap": "^4.x", 4 | "node-sass": "^6.x", 5 | "react": "latest", 6 | "react-dom": "latest" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /test/fixtures/boostrap-sass/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.sass'; 4 | 5 | ReactDOM.render(
, document.getElementById('root')); 6 | -------------------------------------------------------------------------------- /test/fixtures/boostrap-sass/src/index.sass: -------------------------------------------------------------------------------- 1 | @import "~bootstrap/scss/bootstrap.scss"; 2 | -------------------------------------------------------------------------------- /test/fixtures/builds-with-multiple-runtimes/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | test('builds in development', async () => { 6 | const { fulfilled } = await testSetup.scripts.start({ smoke: true }); 7 | expect(fulfilled).toBe(true); 8 | }); 9 | test('builds in production', async () => { 10 | const { fulfilled } = await testSetup.scripts.build(); 11 | expect(fulfilled).toBe(true); 12 | }); 13 | -------------------------------------------------------------------------------- /test/fixtures/builds-with-multiple-runtimes/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "dva": "^2.4.0", 4 | "history": "^4.7.2", 5 | "ky": "^0.3.0", 6 | "react": "latest", 7 | "react-dom": "latest" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /test/fixtures/builds-with-multiple-runtimes/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import dva from 'dva'; 3 | import createHistory from 'history/createHashHistory'; 4 | import ky from 'ky'; 5 | 6 | const app = dva({ history: createHistory() }); 7 | app.router(() => { 8 | ky.get('https://canihazip.com/s') 9 | .then(r => r.text()) 10 | .then(console.log, console.error) 11 | .then(() => console.log('ok')); 12 | return
Test
; 13 | }); 14 | app.start('#root'); 15 | -------------------------------------------------------------------------------- /test/fixtures/global-scss-asset-resolution/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | if (testSetup.isLocal) { 6 | // TODO: make this work locally 7 | test('skipped locally', () => {}); 8 | } else { 9 | test('builds in development', async () => { 10 | const { fulfilled } = await testSetup.scripts.start({ smoke: true }); 11 | expect(fulfilled).toBe(true); 12 | }); 13 | 14 | test('builds in production', async () => { 15 | const { fulfilled } = await testSetup.scripts.build(); 16 | expect(fulfilled).toBe(true); 17 | }); 18 | } 19 | -------------------------------------------------------------------------------- /test/fixtures/global-scss-asset-resolution/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "node-sass": "^6.x", 4 | "react": "latest", 5 | "react-dom": "latest" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /test/fixtures/global-scss-asset-resolution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.scss'; 4 | 5 | ReactDOM.render(
, document.getElementById('root')); 6 | -------------------------------------------------------------------------------- /test/fixtures/global-scss-asset-resolution/src/index.scss: -------------------------------------------------------------------------------- 1 | #root { 2 | width: 300px; 3 | height: 300px; 4 | background: url(/images/logo.svg) center/cover no-repeat; 5 | } 6 | -------------------------------------------------------------------------------- /test/fixtures/issue-5176-flow-class-properties/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | test('passes tests', async () => { 6 | const { fulfilled } = await testSetup.scripts.test({ 7 | jestEnvironment: 'node', 8 | }); 9 | expect(fulfilled).toBe(true); 10 | }); 11 | -------------------------------------------------------------------------------- /test/fixtures/issue-5176-flow-class-properties/package.json: -------------------------------------------------------------------------------- 1 | {} 2 | -------------------------------------------------------------------------------- /test/fixtures/issue-5176-flow-class-properties/src/App.js: -------------------------------------------------------------------------------- 1 | class App { 2 | constructor() { 3 | this.foo = this.foo.bind(this); 4 | } 5 | foo: void => void; 6 | foo() { 7 | return 'bar'; 8 | } 9 | } 10 | 11 | export default App; 12 | -------------------------------------------------------------------------------- /test/fixtures/issue-5176-flow-class-properties/src/App.test.js: -------------------------------------------------------------------------------- 1 | import App from './App'; 2 | 3 | it('creates instance without', () => { 4 | const app = new App(); 5 | expect(app.foo()).toBe('bar'); 6 | }); 7 | -------------------------------------------------------------------------------- /test/fixtures/issue-5947-not-typescript/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": {} 3 | } 4 | -------------------------------------------------------------------------------- /test/fixtures/jsconfig/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | test('builds in development', async () => { 6 | const { fulfilled } = await testSetup.scripts.start({ smoke: true }); 7 | expect(fulfilled).toBe(true); 8 | }); 9 | test('builds in production', async () => { 10 | const { fulfilled } = await testSetup.scripts.build(); 11 | expect(fulfilled).toBe(true); 12 | }); 13 | test('passes tests', async () => { 14 | const { fulfilled } = await testSetup.scripts.test(); 15 | expect(fulfilled).toBe(true); 16 | }); 17 | -------------------------------------------------------------------------------- /test/fixtures/jsconfig/jsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": "src" 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /test/fixtures/jsconfig/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "prop-types": "^15.7.2", 4 | "react": "latest", 5 | "react-dom": "latest" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /test/fixtures/jsconfig/src/App.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React, { Component } from 'react'; 9 | 10 | import PropTypes from 'prop-types'; 11 | import load from 'absoluteLoad'; 12 | 13 | export default class App extends Component { 14 | static propTypes = { 15 | onReady: PropTypes.func.isRequired, 16 | }; 17 | 18 | constructor(props) { 19 | super(props); 20 | this.state = { users: [] }; 21 | } 22 | 23 | async componentDidMount() { 24 | const users = load(); 25 | this.setState({ users }); 26 | } 27 | 28 | componentDidUpdate() { 29 | this.props.onReady(); 30 | } 31 | 32 | render() { 33 | return ( 34 |
35 | {this.state.users.map(user => ( 36 |
{user.name}
37 | ))} 38 |
39 | ); 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /test/fixtures/jsconfig/src/App.test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | import React from 'react'; 9 | import ReactDOM from 'react-dom'; 10 | import App from './App'; 11 | 12 | test('loads modules absolutely with baseUrl', () => { 13 | const div = document.createElement('div'); 14 | return new Promise(resolve => { 15 | ReactDOM.render(, div); 16 | }); 17 | }); 18 | -------------------------------------------------------------------------------- /test/fixtures/jsconfig/src/absoluteLoad.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | const absoluteLoad = () => [ 9 | { id: 1, name: '1' }, 10 | { id: 2, name: '2' }, 11 | { id: 3, name: '3' }, 12 | { id: 4, name: '4' }, 13 | ]; 14 | 15 | export default absoluteLoad; 16 | -------------------------------------------------------------------------------- /test/fixtures/jsconfig/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render(, document.getElementById('root')); 6 | -------------------------------------------------------------------------------- /test/fixtures/mjs-support/__snapshots__/index.test.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`can use mjs library in development 1`] = `"world"`; 4 | 5 | exports[`can use mjs library in production 1`] = `"world"`; 6 | -------------------------------------------------------------------------------- /test/fixtures/mjs-support/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "graphql": "^14.0.2", 4 | "react": "latest", 5 | "react-dom": "latest", 6 | "serve": "^10.0.2" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /test/fixtures/mjs-support/src/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { 3 | graphql, 4 | GraphQLSchema, 5 | GraphQLObjectType, 6 | GraphQLString, 7 | } from 'graphql'; 8 | 9 | const schema = new GraphQLSchema({ 10 | query: new GraphQLObjectType({ 11 | name: 'RootQueryType', 12 | fields: { 13 | hello: { 14 | type: GraphQLString, 15 | resolve() { 16 | return 'world'; 17 | }, 18 | }, 19 | }, 20 | }), 21 | }); 22 | 23 | class App extends Component { 24 | state = {}; 25 | componentDidMount() { 26 | graphql(schema, '{ hello }').then(({ data }) => { 27 | this.setState({ result: data.hello }); 28 | }); 29 | } 30 | render() { 31 | const { result } = this.state; 32 | return result ?
{result}
: null; 33 | } 34 | } 35 | 36 | export default App; 37 | -------------------------------------------------------------------------------- /test/fixtures/mjs-support/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render(, document.getElementById('root')); 6 | -------------------------------------------------------------------------------- /test/fixtures/relative-paths/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | const fs = require('fs-extra'); 6 | const globby = require('globby'); 7 | const path = require('path'); 8 | 9 | test('contains a relative path in production build', async () => { 10 | await testSetup.scripts.build(); 11 | 12 | const buildDir = path.join(testSetup.testDirectory, 'build'); 13 | const cssFile = path.join( 14 | buildDir, 15 | globby.sync('**/*.css', { cwd: buildDir }).pop() 16 | ); 17 | const svgFile = path.join( 18 | buildDir, 19 | globby.sync('**/*.svg', { cwd: buildDir }).pop() 20 | ); 21 | const desiredPath = /url\((.+?)\)/ 22 | .exec(fs.readFileSync(cssFile, 'utf8')) 23 | .pop(); 24 | expect(path.resolve(path.join(path.dirname(cssFile), desiredPath))).toBe( 25 | path.resolve(svgFile) 26 | ); 27 | }); 28 | -------------------------------------------------------------------------------- /test/fixtures/relative-paths/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "react": "latest", 4 | "react-dom": "latest" 5 | }, 6 | "homepage": "." 7 | } 8 | -------------------------------------------------------------------------------- /test/fixtures/relative-paths/src/index.css: -------------------------------------------------------------------------------- 1 | .RootSvg:before { 2 | display: block; 3 | content: ' '; 4 | background-image: url(./logo.svg); 5 | background-size: 28px 28px; 6 | height: 28px; 7 | width: 28px; 8 | } 9 | -------------------------------------------------------------------------------- /test/fixtures/relative-paths/src/index.js: -------------------------------------------------------------------------------- 1 | import './index.css'; 2 | -------------------------------------------------------------------------------- /test/fixtures/typescript-advanced/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | test('builds in development', async () => { 6 | const { fulfilled } = await testSetup.scripts.start({ smoke: true }); 7 | expect(fulfilled).toBe(true); 8 | }); 9 | test('builds in production', async () => { 10 | const { fulfilled } = await testSetup.scripts.build(); 11 | expect(fulfilled).toBe(true); 12 | }); 13 | test('passes tests', async () => { 14 | const { fulfilled } = await testSetup.scripts.test({ 15 | jestEnvironment: 'node', 16 | }); 17 | expect(fulfilled).toBe(true); 18 | }); 19 | -------------------------------------------------------------------------------- /test/fixtures/typescript-advanced/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "@types/react": "*", 4 | "@types/react-dom": "*", 5 | "@types/jest": "*", 6 | "react": "*", 7 | "react-dom": "*", 8 | "typescript": "^3.9.5" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /test/fixtures/typescript-advanced/src/App.test.ts: -------------------------------------------------------------------------------- 1 | import App from './App'; 2 | 3 | it('reads a typescript file with no syntax error', () => { 4 | const app = new App({}); 5 | expect(App.foo.bar).toBe(true); 6 | expect(App.foo.baz!.n).toBe(123); 7 | expect(app.n).toBe(123); 8 | }); 9 | -------------------------------------------------------------------------------- /test/fixtures/typescript-advanced/src/App.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | 3 | interface MyType { 4 | foo: number; 5 | bar: boolean; 6 | baz?: { n: number }; 7 | } 8 | 9 | function assertIsString(val: any): asserts val is string { 10 | if (typeof val !== 'string') { 11 | throw new Error('Not a string!'); 12 | } 13 | } 14 | 15 | const foo: any = 'bar'; 16 | assertIsString(foo); 17 | 18 | type MyObject = Pick; 19 | 20 | class App extends React.Component { 21 | static foo: MyObject = { bar: true, baz: { n: 123 } }; 22 | n = App.foo?.baz!.n ?? 'foo'; 23 | 24 | render() { 25 | return
; 26 | } 27 | } 28 | 29 | export default App; 30 | -------------------------------------------------------------------------------- /test/fixtures/typescript-advanced/src/index.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import * as ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render(, document.getElementById('root')); 6 | -------------------------------------------------------------------------------- /test/fixtures/typescript-typecheck/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | const puppeteer = require('puppeteer'); 5 | 6 | const expectedErrorMsg = `Argument of type '123' is not assignable to parameter of type 'string'`; 7 | 8 | test('shows error overlay in browser', async () => { 9 | const { port, done } = await testSetup.scripts.start(); 10 | 11 | const browser = await puppeteer.launch({ headless: true }); 12 | try { 13 | const page = await browser.newPage(); 14 | await page.goto(`http://localhost:${port}/`); 15 | await page.waitForSelector('iframe', { timeout: 5000 }); 16 | const overlayMsg = await page.evaluate(() => { 17 | const overlay = document.querySelector('iframe').contentWindow; 18 | return overlay.document.body.innerHTML; 19 | }); 20 | expect(overlayMsg).toContain(expectedErrorMsg); 21 | } finally { 22 | browser.close(); 23 | done(); 24 | } 25 | }); 26 | 27 | test('shows error in console (dev mode)', async () => { 28 | const { stderr } = await testSetup.scripts.start({ smoke: true }); 29 | expect(stderr).toContain(expectedErrorMsg); 30 | }); 31 | 32 | test('shows error in console (prod mode)', async () => { 33 | const { stderr } = await testSetup.scripts.build(); 34 | expect(stderr).toContain(expectedErrorMsg); 35 | }); 36 | -------------------------------------------------------------------------------- /test/fixtures/typescript-typecheck/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "@types/react": "*", 4 | "@types/react-dom": "*", 5 | "react": "*", 6 | "react-dom": "*", 7 | "typescript": "^3.9.5" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /test/fixtures/typescript-typecheck/src/App.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | 3 | class App extends React.Component { 4 | render() { 5 | return
{format(123)}
; 6 | } 7 | } 8 | 9 | function format(value: string) { 10 | return value; 11 | } 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /test/fixtures/typescript-typecheck/src/index.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import * as ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render(, document.getElementById('root')); 6 | -------------------------------------------------------------------------------- /test/fixtures/typescript/index.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const testSetup = require('../__shared__/test-setup'); 4 | 5 | test('passes tests', async () => { 6 | const { fulfilled } = await testSetup.scripts.test({ 7 | jestEnvironment: 'node', 8 | }); 9 | expect(fulfilled).toBe(true); 10 | }); 11 | -------------------------------------------------------------------------------- /test/fixtures/typescript/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "typescript": "^3.9.5" 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /test/fixtures/typescript/src/App.test.ts: -------------------------------------------------------------------------------- 1 | import App from './App'; 2 | 3 | it('reads a typescript file with no syntax error', () => { 4 | const app = new App(); 5 | expect(App.foo.bar).toBe(true); 6 | expect(App.foo.baz!.n).toBe(123); 7 | expect(app.n).toBe(123); 8 | }); 9 | 10 | it('supports decorators', () => { 11 | expect((App as any).annotated).toBe(true); 12 | 13 | const app = new App(); 14 | expect(app.decorated).toBe(42); 15 | }); 16 | 17 | it('supports loading modules with baseUrl', () => { 18 | const app = new App(); 19 | expect(app.users).toEqual([ 20 | { id: 1, name: '1' }, 21 | { id: 2, name: '2' }, 22 | { id: 3, name: '3' }, 23 | { id: 4, name: '4' }, 24 | ]); 25 | }); 26 | -------------------------------------------------------------------------------- /test/fixtures/typescript/src/App.ts: -------------------------------------------------------------------------------- 1 | import absoluteLoad from 'absoluteLoad'; 2 | 3 | interface MyType { 4 | foo: number; 5 | bar: boolean; 6 | baz?: { n: number }; 7 | } 8 | 9 | type MyObject = Pick; 10 | 11 | @annotation 12 | class App { 13 | static foo: MyObject = { bar: true, baz: { n: 123 } }; 14 | n = App.foo.baz!.n; 15 | @propertyDecorator 16 | decorated = 5; 17 | users = absoluteLoad(); 18 | } 19 | 20 | function annotation(target: any) { 21 | target.annotated = true; 22 | } 23 | 24 | function propertyDecorator(target: any, key: string) { 25 | arguments[2].initializer = function () { 26 | return 42; 27 | }; 28 | } 29 | 30 | declare namespace MyNamespace { 31 | interface MyType { 32 | foo: string; 33 | bar: (n: number) => void; 34 | } 35 | } 36 | 37 | export default App; 38 | -------------------------------------------------------------------------------- /test/fixtures/typescript/src/absoluteLoad.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | export default () => [ 9 | { id: 1, name: '1' }, 10 | { id: 2, name: '2' }, 11 | { id: 3, name: '3' }, 12 | { id: 4, name: '4' }, 13 | ]; 14 | -------------------------------------------------------------------------------- /test/fixtures/typescript/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": "src", 4 | "experimentalDecorators": true 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "react": "latest", 4 | "react-dom": "latest" 5 | }, 6 | "browserslist": [ 7 | ">0.2%" 8 | ] 9 | } 10 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppAliasUnknownExport.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { bar as bar2 } from './AppUnknownExport'; 3 | 4 | class App extends Component { 5 | componentDidMount() { 6 | bar2(); 7 | } 8 | render() { 9 | return
; 10 | } 11 | } 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppBabel.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | 3 | class App extends Component { 4 | render() { 5 | return ( 6 |
7 | 8 |
9 | ); 10 | } 11 | } 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppCss.css: -------------------------------------------------------------------------------- 1 | .App { 2 | color: red; 3 | }} 4 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppCss.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import './AppCss.css'; 3 | 4 | class App extends Component { 5 | render() { 6 | return
; 7 | } 8 | } 9 | 10 | export default App; 11 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppIncorrectCase.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import five from './export5'; 3 | 4 | class App extends Component { 5 | render() { 6 | return
{five}
; 7 | } 8 | } 9 | 10 | export default App; 11 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppLintError.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | 3 | function foo() { 4 | const a = b; 5 | } 6 | 7 | class App extends Component { 8 | render() { 9 | return
; 10 | } 11 | } 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppLintWarning.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | 3 | function foo() {} 4 | 5 | class App extends Component { 6 | render() { 7 | return
; 8 | } 9 | } 10 | 11 | export default App; 12 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppMissingPackage.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { bar } from 'unknown-package'; 3 | 4 | class App extends Component { 5 | componentDidMount() { 6 | bar(); 7 | } 8 | render() { 9 | return
; 10 | } 11 | } 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppNoDefault.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import myImport from './ExportNoDefault'; 3 | 4 | class App extends Component { 5 | render() { 6 | return
{myImport}
; 7 | } 8 | } 9 | 10 | export default App; 11 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppOutOfScopeImport.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import myImport from '../OutOfScopeImport'; 3 | 4 | class App extends Component { 5 | render() { 6 | return
{myImport}
; 7 | } 8 | } 9 | 10 | export default App; 11 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppSass.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import './AppSass.scss'; 3 | 4 | class App extends Component { 5 | render() { 6 | return
; 7 | } 8 | } 9 | 10 | export default App; 11 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppSass.scss: -------------------------------------------------------------------------------- 1 | .App { 2 | color: red; 3 | } 4 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppUnknownExport.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { bar } from './AppUnknownExport'; 3 | 4 | class App extends Component { 5 | componentDidMount() { 6 | bar(); 7 | } 8 | render() { 9 | return
; 10 | } 11 | } 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/AppUnknownFile.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import DefaultExport from './ThisFileSouldNotExist'; 3 | 4 | class App extends Component { 5 | render() { 6 | return
; 7 | } 8 | } 9 | 10 | export default App; 11 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/Export5.js: -------------------------------------------------------------------------------- 1 | export default 5; 2 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/ExportNoDefault.js: -------------------------------------------------------------------------------- 1 | export const six = 6; 2 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/FooExport.js: -------------------------------------------------------------------------------- 1 | export function foo() { 2 | console.log('bar'); 3 | } 4 | -------------------------------------------------------------------------------- /test/fixtures/webpack-message-formatting/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render(, document.getElementById('root')); 6 | -------------------------------------------------------------------------------- /test/jest.config.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | module.exports = { 4 | testEnvironment: 'node', 5 | testMatch: ['/**/*.test.js'], 6 | testPathIgnorePatterns: ['/src/', 'node_modules'], 7 | }; 8 | --------------------------------------------------------------------------------