mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Fixture: Legacy JSX Runtimes (#20012)
* Fixture: Legacy JSX Runtimes * Add more comments
This commit is contained in:
Dan Abramov
@@ -0,0 +1,12 @@
|
||||
# Legacy JSX Runtimes
|
||||
|
||||
This is an internal testing fixture for the special JSX runtime versions released for 0.14, 15, and 16.
|
||||
|
||||
They are checked into the corresponding `react-*/cjs/*` folders.
|
||||
|
||||
Run the full regression suite:
|
||||
|
||||
```
|
||||
yarn
|
||||
yarn test
|
||||
```
|
||||
@@ -0,0 +1,12 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
[
|
||||
'@babel/react',
|
||||
{
|
||||
runtime: 'automatic',
|
||||
development: process.env.BABEL_ENV === 'development',
|
||||
},
|
||||
],
|
||||
],
|
||||
plugins: ['@babel/plugin-transform-modules-commonjs'],
|
||||
};
|
||||
@@ -0,0 +1,63 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @emails react-core
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
const path = require('path');
|
||||
|
||||
const {ESLint} = require('eslint');
|
||||
|
||||
function getESLintInstance(format) {
|
||||
return new ESLint({
|
||||
useEslintrc: false,
|
||||
overrideConfigFile:
|
||||
__dirname + `../../../scripts/rollup/validate/eslintrc.${format}.js`,
|
||||
ignore: false,
|
||||
});
|
||||
}
|
||||
|
||||
const esLints = {
|
||||
cjs: getESLintInstance('cjs'),
|
||||
};
|
||||
|
||||
// Performs sanity checks on bundles *built* by Rollup.
|
||||
// Helps catch Rollup regressions.
|
||||
async function lint(folder) {
|
||||
console.log(`Linting ` + folder);
|
||||
const eslint = esLints.cjs;
|
||||
|
||||
const results = await eslint.lintFiles([
|
||||
__dirname + '/' + folder + '/cjs/react-jsx-dev-runtime.development.js',
|
||||
__dirname + '/' + folder + '/cjs/react-jsx-dev-runtime.production.min.js',
|
||||
__dirname + '/' + folder + '/cjs/react-jsx-runtime.development.js',
|
||||
__dirname + '/' + folder + '/cjs/react-jsx-runtime.production.min.js',
|
||||
]);
|
||||
if (
|
||||
results.some(result => result.errorCount > 0 || result.warningCount > 0)
|
||||
) {
|
||||
process.exitCode = 1;
|
||||
console.log(`Failed`);
|
||||
const formatter = await eslint.loadFormatter('stylish');
|
||||
const resultText = formatter.format(results);
|
||||
console.log(resultText);
|
||||
}
|
||||
}
|
||||
|
||||
async function lintEverything() {
|
||||
console.log(`Linting known bundles...`);
|
||||
await lint('react-14');
|
||||
await lint('react-15');
|
||||
await lint('react-16');
|
||||
await lint('react-17');
|
||||
}
|
||||
|
||||
lintEverything().catch(error => {
|
||||
process.exitCode = 1;
|
||||
console.error(error);
|
||||
});
|
||||
@@ -0,0 +1,19 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"@babel/plugin-transform-modules-commonjs": "^7.10.4",
|
||||
"@babel/preset-react": "^7.10.4",
|
||||
"jest": "^26.5.3"
|
||||
},
|
||||
"jest": {
|
||||
"setupFilesAfterEnv": ["./setupTests.js"]
|
||||
},
|
||||
"scripts": {
|
||||
"install-all": "cd react-14 && yarn && cd ../react-15 && yarn && cd ../react-16 && yarn && cd ../react-17 && yarn && cd ..",
|
||||
"lint": "node lint-runtimes.js",
|
||||
"pretest": "yarn install-all && yarn lint",
|
||||
"test-jsxdev-dev": "BABEL_ENV=development NODE_ENV=development jest",
|
||||
"test-jsx-dev": "BABEL_ENV=production NODE_ENV=development jest",
|
||||
"test-jsx-prod": "BABEL_ENV=production NODE_ENV=production jest",
|
||||
"test": "yarn test-jsxdev-dev && yarn test-jsx-dev && yarn test-jsx-prod"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,861 @@
|
||||
/** @license React v0.14.10
|
||||
* react-jsx-dev-runtime.development.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var React = require('react');
|
||||
|
||||
// ATTENTION
|
||||
// When adding new symbols to this file,
|
||||
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
||||
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
||||
// nor polyfill, then a plain number is used for performance.
|
||||
var REACT_ELEMENT_TYPE = 0xeac7;
|
||||
var REACT_PORTAL_TYPE = 0xeaca;
|
||||
exports.Fragment = 0xeacb;
|
||||
var REACT_STRICT_MODE_TYPE = 0xeacc;
|
||||
var REACT_PROFILER_TYPE = 0xead2;
|
||||
var REACT_PROVIDER_TYPE = 0xeacd;
|
||||
var REACT_CONTEXT_TYPE = 0xeace;
|
||||
var REACT_FORWARD_REF_TYPE = 0xead0;
|
||||
var REACT_SUSPENSE_TYPE = 0xead1;
|
||||
var REACT_SUSPENSE_LIST_TYPE = 0xead8;
|
||||
var REACT_MEMO_TYPE = 0xead3;
|
||||
var REACT_LAZY_TYPE = 0xead4;
|
||||
var REACT_BLOCK_TYPE = 0xead9;
|
||||
var REACT_SERVER_BLOCK_TYPE = 0xeada;
|
||||
var REACT_FUNDAMENTAL_TYPE = 0xead5;
|
||||
var REACT_SCOPE_TYPE = 0xead7;
|
||||
var REACT_OPAQUE_ID_TYPE = 0xeae0;
|
||||
var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
|
||||
var REACT_OFFSCREEN_TYPE = 0xeae2;
|
||||
var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
|
||||
|
||||
if (typeof Symbol === 'function' && Symbol.for) {
|
||||
var symbolFor = Symbol.for;
|
||||
REACT_ELEMENT_TYPE = symbolFor('react.element');
|
||||
REACT_PORTAL_TYPE = symbolFor('react.portal');
|
||||
exports.Fragment = symbolFor('react.fragment');
|
||||
REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
|
||||
REACT_PROFILER_TYPE = symbolFor('react.profiler');
|
||||
REACT_PROVIDER_TYPE = symbolFor('react.provider');
|
||||
REACT_CONTEXT_TYPE = symbolFor('react.context');
|
||||
REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
|
||||
REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
|
||||
REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
|
||||
REACT_MEMO_TYPE = symbolFor('react.memo');
|
||||
REACT_LAZY_TYPE = symbolFor('react.lazy');
|
||||
REACT_BLOCK_TYPE = symbolFor('react.block');
|
||||
REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
|
||||
REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
|
||||
REACT_SCOPE_TYPE = symbolFor('react.scope');
|
||||
REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
|
||||
REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
|
||||
REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
|
||||
REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
|
||||
}
|
||||
|
||||
var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
|
||||
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
||||
function getIteratorFn(maybeIterable) {
|
||||
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
||||
return null;
|
||||
}
|
||||
|
||||
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
||||
|
||||
if (typeof maybeIterator === 'function') {
|
||||
return maybeIterator;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function error(format) {
|
||||
{
|
||||
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
printWarning('error', format, args);
|
||||
}
|
||||
}
|
||||
|
||||
function printWarning(level, format, args) {
|
||||
// When changing this logic, you might want to also
|
||||
// update consoleWithStackDev.www.js as well.
|
||||
{
|
||||
var stack = '';
|
||||
|
||||
|
||||
if (stack !== '') {
|
||||
format += '%s';
|
||||
args = args.concat([stack]);
|
||||
}
|
||||
|
||||
var argsWithFormat = args.map(function (item) {
|
||||
return '' + item;
|
||||
}); // Careful: RN currently depends on this prefix
|
||||
|
||||
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
||||
// breaks IE9: https://github.com/facebook/react/issues/13610
|
||||
// eslint-disable-next-line react-internal/no-production-logging
|
||||
|
||||
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
||||
}
|
||||
}
|
||||
|
||||
// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
|
||||
|
||||
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
||||
|
||||
function isValidElementType(type) {
|
||||
if (typeof type === 'string' || typeof type === 'function') {
|
||||
return true;
|
||||
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
||||
|
||||
|
||||
if (type === exports.Fragment || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (typeof type === 'object' && type !== null) {
|
||||
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
|
||||
function describeComponentFrame (name, source, ownerName) {
|
||||
var sourceInfo = '';
|
||||
|
||||
if (source) {
|
||||
var path = source.fileName;
|
||||
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
||||
|
||||
{
|
||||
// In DEV, include code for a common special case:
|
||||
// prefer "folder/index.js" instead of just "index.js".
|
||||
if (/^index\./.test(fileName)) {
|
||||
var match = path.match(BEFORE_SLASH_RE);
|
||||
|
||||
if (match) {
|
||||
var pathBeforeSlash = match[1];
|
||||
|
||||
if (pathBeforeSlash) {
|
||||
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
||||
fileName = folderName + '/' + fileName;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
||||
} else if (ownerName) {
|
||||
sourceInfo = ' (created by ' + ownerName + ')';
|
||||
}
|
||||
|
||||
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
||||
}
|
||||
|
||||
var Resolved = 1;
|
||||
function refineResolvedLazyComponent(lazyComponent) {
|
||||
return lazyComponent._status === Resolved ? lazyComponent._result : null;
|
||||
}
|
||||
|
||||
function getWrappedName(outerType, innerType, wrapperName) {
|
||||
var functionName = innerType.displayName || innerType.name || '';
|
||||
return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
|
||||
}
|
||||
|
||||
function getComponentName(type) {
|
||||
if (type == null) {
|
||||
// Host root, text node or just invalid type.
|
||||
return null;
|
||||
}
|
||||
|
||||
{
|
||||
if (typeof type.tag === 'number') {
|
||||
error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof type === 'function') {
|
||||
return type.displayName || type.name || null;
|
||||
}
|
||||
|
||||
if (typeof type === 'string') {
|
||||
return type;
|
||||
}
|
||||
|
||||
switch (type) {
|
||||
case exports.Fragment:
|
||||
return 'Fragment';
|
||||
|
||||
case REACT_PORTAL_TYPE:
|
||||
return 'Portal';
|
||||
|
||||
case REACT_PROFILER_TYPE:
|
||||
return "Profiler";
|
||||
|
||||
case REACT_STRICT_MODE_TYPE:
|
||||
return 'StrictMode';
|
||||
|
||||
case REACT_SUSPENSE_TYPE:
|
||||
return 'Suspense';
|
||||
|
||||
case REACT_SUSPENSE_LIST_TYPE:
|
||||
return 'SuspenseList';
|
||||
}
|
||||
|
||||
if (typeof type === 'object') {
|
||||
switch (type.$$typeof) {
|
||||
case REACT_CONTEXT_TYPE:
|
||||
return 'Context.Consumer';
|
||||
|
||||
case REACT_PROVIDER_TYPE:
|
||||
return 'Context.Provider';
|
||||
|
||||
case REACT_FORWARD_REF_TYPE:
|
||||
return getWrappedName(type, type.render, 'ForwardRef');
|
||||
|
||||
case REACT_MEMO_TYPE:
|
||||
return getComponentName(type.type);
|
||||
|
||||
case REACT_BLOCK_TYPE:
|
||||
return getComponentName(type.render);
|
||||
|
||||
case REACT_LAZY_TYPE:
|
||||
{
|
||||
var thenable = type;
|
||||
var resolvedThenable = refineResolvedLazyComponent(thenable);
|
||||
|
||||
if (resolvedThenable) {
|
||||
return getComponentName(resolvedThenable);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
var loggedTypeFailures = {};
|
||||
var currentlyValidatingElement = null;
|
||||
|
||||
function setCurrentlyValidatingElement(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
||||
{
|
||||
// $FlowFixMe This is okay but Flow doesn't know it.
|
||||
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
||||
|
||||
for (var typeSpecName in typeSpecs) {
|
||||
if (has(typeSpecs, typeSpecName)) {
|
||||
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
||||
// fail the render phase where it didn't fail before. So we log it.
|
||||
// After these have been cleaned up, we'll let them throw.
|
||||
|
||||
try {
|
||||
// This is intentionally an invariant that gets caught. It's the same
|
||||
// behavior as without this statement except with a better message.
|
||||
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
||||
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
||||
err.name = 'Invariant Violation';
|
||||
throw err;
|
||||
}
|
||||
|
||||
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
||||
} catch (ex) {
|
||||
error$1 = ex;
|
||||
}
|
||||
|
||||
if (error$1 && !(error$1 instanceof Error)) {
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
|
||||
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
||||
// Only monitor this failure once because there tends to be a lot of the
|
||||
// same error.
|
||||
loggedTypeFailures[error$1.message] = true;
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('Failed %s type: %s', location, error$1.message);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner = require('react/lib/ReactCurrentOwner');
|
||||
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
||||
var RESERVED_PROPS = {
|
||||
key: true,
|
||||
ref: true,
|
||||
__self: true,
|
||||
__source: true
|
||||
};
|
||||
var specialPropKeyWarningShown;
|
||||
var specialPropRefWarningShown;
|
||||
var didWarnAboutStringRefs;
|
||||
|
||||
{
|
||||
didWarnAboutStringRefs = {};
|
||||
}
|
||||
|
||||
function hasValidRef(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'ref')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.ref !== undefined;
|
||||
}
|
||||
|
||||
function hasValidKey(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'key')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.key !== undefined;
|
||||
}
|
||||
|
||||
function defineKeyPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingKey = function () {
|
||||
if (!specialPropKeyWarningShown) {
|
||||
specialPropKeyWarningShown = true;
|
||||
|
||||
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingKey.isReactWarning = true;
|
||||
Object.defineProperty(props, 'key', {
|
||||
get: warnAboutAccessingKey,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function defineRefPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingRef = function () {
|
||||
if (!specialPropRefWarningShown) {
|
||||
specialPropRefWarningShown = true;
|
||||
|
||||
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingRef.isReactWarning = true;
|
||||
Object.defineProperty(props, 'ref', {
|
||||
get: warnAboutAccessingRef,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Factory method to create a new React element. This no longer adheres to
|
||||
* the class pattern, so do not use new to call it. Also, instanceof check
|
||||
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
||||
* if something is a React Element.
|
||||
*
|
||||
* @param {*} type
|
||||
* @param {*} props
|
||||
* @param {*} key
|
||||
* @param {string|object} ref
|
||||
* @param {*} owner
|
||||
* @param {*} self A *temporary* helper to detect places where `this` is
|
||||
* different from the `owner` when React.createElement is called, so that we
|
||||
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
||||
* functions, and as long as `this` and owner are the same, there will be no
|
||||
* change in behavior.
|
||||
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
||||
* indicating filename, line number, and/or other information.
|
||||
* @internal
|
||||
*/
|
||||
|
||||
|
||||
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
||||
var element = {
|
||||
// This tag allows us to uniquely identify this as a React Element
|
||||
$$typeof: REACT_ELEMENT_TYPE,
|
||||
// Built-in properties that belong on the element
|
||||
type: type,
|
||||
key: key,
|
||||
ref: ref,
|
||||
props: props,
|
||||
// Record the component responsible for creating this element.
|
||||
_owner: owner
|
||||
};
|
||||
|
||||
{
|
||||
// The validation flag is currently mutative. We put it on
|
||||
// an external backing store so that we can freeze the whole object.
|
||||
// This can be replaced with a WeakMap once they are implemented in
|
||||
// commonly used development environments.
|
||||
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
||||
// the validation flag non-enumerable (where possible, which should
|
||||
// include every environment we run tests in), so the test framework
|
||||
// ignores it.
|
||||
|
||||
Object.defineProperty(element._store, 'validated', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
value: false
|
||||
}); // self and source are DEV only properties.
|
||||
|
||||
Object.defineProperty(element, '_self', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: self
|
||||
}); // Two elements created in two different places should be considered
|
||||
// equal for testing purposes and therefore we hide it from enumeration.
|
||||
|
||||
Object.defineProperty(element, '_source', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: source
|
||||
});
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(element.props);
|
||||
Object.freeze(element);
|
||||
}
|
||||
}
|
||||
|
||||
return element;
|
||||
};
|
||||
/**
|
||||
* https://github.com/reactjs/rfcs/pull/107
|
||||
* @param {*} type
|
||||
* @param {object} props
|
||||
* @param {string} key
|
||||
*/
|
||||
|
||||
function jsxDEV(type, config, maybeKey, source, self) {
|
||||
{
|
||||
var propName; // Reserved names are extracted
|
||||
|
||||
var props = {};
|
||||
var key = null;
|
||||
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
||||
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
||||
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
||||
// but as an intermediary step, we will use jsxDEV for everything except
|
||||
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
||||
// key is explicitly declared to be undefined or not.
|
||||
|
||||
if (maybeKey !== undefined) {
|
||||
key = '' + maybeKey;
|
||||
}
|
||||
|
||||
if (hasValidKey(config)) {
|
||||
key = '' + config.key;
|
||||
}
|
||||
|
||||
if (hasValidRef(config)) {
|
||||
ref = config.ref;
|
||||
} // Remaining properties are added to a new props object
|
||||
|
||||
|
||||
for (propName in config) {
|
||||
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
||||
props[propName] = config[propName];
|
||||
}
|
||||
} // Resolve default props
|
||||
|
||||
|
||||
if (type && type.defaultProps) {
|
||||
var defaultProps = type.defaultProps;
|
||||
|
||||
for (propName in defaultProps) {
|
||||
if (props[propName] === undefined) {
|
||||
props[propName] = defaultProps[propName];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (key || ref) {
|
||||
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
||||
|
||||
if (key) {
|
||||
defineKeyPropWarningGetter(props, displayName);
|
||||
}
|
||||
|
||||
if (ref) {
|
||||
defineRefPropWarningGetter(props, displayName);
|
||||
}
|
||||
}
|
||||
|
||||
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner$1 = require('react/lib/ReactCurrentOwner');
|
||||
|
||||
function setCurrentlyValidatingElement$1(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
var propTypesMisspellWarningShown;
|
||||
|
||||
{
|
||||
propTypesMisspellWarningShown = false;
|
||||
}
|
||||
/**
|
||||
* Verifies the object is a ReactElement.
|
||||
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
||||
* @param {?object} object
|
||||
* @return {boolean} True if `object` is a ReactElement.
|
||||
* @final
|
||||
*/
|
||||
|
||||
function isValidElement(object) {
|
||||
{
|
||||
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
||||
}
|
||||
}
|
||||
|
||||
function getDeclarationErrorAddendum() {
|
||||
{
|
||||
if (ReactCurrentOwner$1.current) {
|
||||
var name = ReactCurrentOwner$1.current.getName();
|
||||
|
||||
if (name) {
|
||||
return '\n\nCheck the render method of `' + name + '`.';
|
||||
}
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function getSourceInfoErrorAddendum(source) {
|
||||
{
|
||||
if (source !== undefined) {
|
||||
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
||||
var lineNumber = source.lineNumber;
|
||||
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if there's no key explicitly set on dynamic arrays of children or
|
||||
* object keys are not valid. This allows us to keep track of children between
|
||||
* updates.
|
||||
*/
|
||||
|
||||
|
||||
var ownerHasKeyUseWarning = {};
|
||||
|
||||
function getCurrentComponentErrorInfo(parentType) {
|
||||
{
|
||||
var info = getDeclarationErrorAddendum();
|
||||
|
||||
if (!info) {
|
||||
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
||||
|
||||
if (parentName) {
|
||||
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
||||
}
|
||||
}
|
||||
|
||||
return info;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if the element doesn't have an explicit key assigned to it.
|
||||
* This element is in an array. The array could grow and shrink or be
|
||||
* reordered. All children that haven't already been validated are required to
|
||||
* have a "key" property assigned to it. Error statuses are cached so a warning
|
||||
* will only be shown once.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactElement} element Element that requires a key.
|
||||
* @param {*} parentType element's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateExplicitKey(element, parentType) {
|
||||
{
|
||||
if (!element._store || element._store.validated || element.key != null) {
|
||||
return;
|
||||
}
|
||||
|
||||
element._store.validated = true;
|
||||
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
||||
|
||||
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
||||
return;
|
||||
}
|
||||
|
||||
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
||||
// property, it may be the creator of the child that's responsible for
|
||||
// assigning it a key.
|
||||
|
||||
var childOwner = '';
|
||||
|
||||
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
||||
// Give the component that originally created this child.
|
||||
childOwner = " It was passed a child from " + element._owner.getName() + ".";
|
||||
}
|
||||
|
||||
setCurrentlyValidatingElement$1(element);
|
||||
|
||||
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Ensure that every element either is passed in a static location, in an
|
||||
* array with an explicit keys property defined, or in an object literal
|
||||
* with valid key property.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactNode} node Statically passed child of any type.
|
||||
* @param {*} parentType node's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateChildKeys(node, parentType) {
|
||||
{
|
||||
if (typeof node !== 'object') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (Array.isArray(node)) {
|
||||
for (var i = 0; i < node.length; i++) {
|
||||
var child = node[i];
|
||||
|
||||
if (isValidElement(child)) {
|
||||
validateExplicitKey(child, parentType);
|
||||
}
|
||||
}
|
||||
} else if (isValidElement(node)) {
|
||||
// This element was passed in a valid location.
|
||||
if (node._store) {
|
||||
node._store.validated = true;
|
||||
}
|
||||
} else if (node) {
|
||||
var iteratorFn = getIteratorFn(node);
|
||||
|
||||
if (typeof iteratorFn === 'function') {
|
||||
// Entry iterators used to provide implicit keys,
|
||||
// but now we print a separate warning for them later.
|
||||
if (iteratorFn !== node.entries) {
|
||||
var iterator = iteratorFn.call(node);
|
||||
var step;
|
||||
|
||||
while (!(step = iterator.next()).done) {
|
||||
if (isValidElement(step.value)) {
|
||||
validateExplicitKey(step.value, parentType);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given an element, validate that its props follow the propTypes definition,
|
||||
* provided by the type.
|
||||
*
|
||||
* @param {ReactElement} element
|
||||
*/
|
||||
|
||||
|
||||
function validatePropTypes(element) {
|
||||
{
|
||||
var type = element.type;
|
||||
|
||||
if (type === null || type === undefined || typeof type === 'string') {
|
||||
return;
|
||||
}
|
||||
|
||||
var propTypes;
|
||||
|
||||
if (typeof type === 'function') {
|
||||
propTypes = type.propTypes;
|
||||
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
||||
// Inner props are checked in the reconciler.
|
||||
type.$$typeof === REACT_MEMO_TYPE)) {
|
||||
propTypes = type.propTypes;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
if (propTypes) {
|
||||
// Intentionally inside to avoid triggering lazy initializers:
|
||||
var name = getComponentName(type);
|
||||
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
||||
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
||||
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
||||
|
||||
var _name = getComponentName(type);
|
||||
|
||||
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
||||
}
|
||||
|
||||
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
||||
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given a fragment, validate that it can only be provided with fragment props
|
||||
* @param {ReactElement} fragment
|
||||
*/
|
||||
|
||||
|
||||
function validateFragmentProps(fragment) {
|
||||
{
|
||||
var keys = Object.keys(fragment.props);
|
||||
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
|
||||
if (key !== 'children' && key !== 'key') {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (fragment.ref !== null) {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
||||
{
|
||||
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
||||
// succeed and there will likely be errors in render.
|
||||
|
||||
if (!validType) {
|
||||
var info = '';
|
||||
|
||||
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
||||
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
||||
}
|
||||
|
||||
var sourceInfo = getSourceInfoErrorAddendum(source);
|
||||
|
||||
if (sourceInfo) {
|
||||
info += sourceInfo;
|
||||
} else {
|
||||
info += getDeclarationErrorAddendum();
|
||||
}
|
||||
|
||||
var typeString;
|
||||
|
||||
if (type === null) {
|
||||
typeString = 'null';
|
||||
} else if (Array.isArray(type)) {
|
||||
typeString = 'array';
|
||||
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
||||
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
||||
info = ' Did you accidentally export a JSX literal instead of a component?';
|
||||
} else {
|
||||
typeString = typeof type;
|
||||
}
|
||||
|
||||
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
||||
}
|
||||
|
||||
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
||||
// TODO: Drop this when these are no longer allowed as the type argument.
|
||||
|
||||
if (element == null) {
|
||||
return element;
|
||||
} // Skip key warning if the type isn't valid since our key validation logic
|
||||
// doesn't expect a non-string/function type and can throw confusing errors.
|
||||
// We don't want exception behavior to differ between dev and prod.
|
||||
// (Rendering will throw with a helpful message and as soon as the type is
|
||||
// fixed, the key warnings will appear.)
|
||||
|
||||
|
||||
if (validType) {
|
||||
var children = props.children;
|
||||
|
||||
if (children !== undefined) {
|
||||
if (isStaticChildren) {
|
||||
if (Array.isArray(children)) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
validateChildKeys(children[i], type);
|
||||
}
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(children);
|
||||
}
|
||||
} else {
|
||||
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
||||
}
|
||||
} else {
|
||||
validateChildKeys(children, type);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (type === exports.Fragment) {
|
||||
validateFragmentProps(element);
|
||||
} else {
|
||||
validatePropTypes(element);
|
||||
}
|
||||
|
||||
return element;
|
||||
}
|
||||
} // These two functions exist to still get child warnings in dev
|
||||
|
||||
var jsxDEV$1 = jsxWithValidation ;
|
||||
|
||||
exports.jsxDEV = jsxDEV$1;
|
||||
})();
|
||||
}
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
/** @license React v0.14.10
|
||||
* react-jsx-dev-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';require("react");exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var a=Symbol.for;exports.Fragment=a("react.fragment")}exports.jsxDEV=void 0;
|
||||
@@ -0,0 +1,883 @@
|
||||
/** @license React v0.14.10
|
||||
* react-jsx-runtime.development.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var React = require('react');
|
||||
|
||||
// ATTENTION
|
||||
// When adding new symbols to this file,
|
||||
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
||||
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
||||
// nor polyfill, then a plain number is used for performance.
|
||||
var REACT_ELEMENT_TYPE = 0xeac7;
|
||||
var REACT_PORTAL_TYPE = 0xeaca;
|
||||
exports.Fragment = 0xeacb;
|
||||
var REACT_STRICT_MODE_TYPE = 0xeacc;
|
||||
var REACT_PROFILER_TYPE = 0xead2;
|
||||
var REACT_PROVIDER_TYPE = 0xeacd;
|
||||
var REACT_CONTEXT_TYPE = 0xeace;
|
||||
var REACT_FORWARD_REF_TYPE = 0xead0;
|
||||
var REACT_SUSPENSE_TYPE = 0xead1;
|
||||
var REACT_SUSPENSE_LIST_TYPE = 0xead8;
|
||||
var REACT_MEMO_TYPE = 0xead3;
|
||||
var REACT_LAZY_TYPE = 0xead4;
|
||||
var REACT_BLOCK_TYPE = 0xead9;
|
||||
var REACT_SERVER_BLOCK_TYPE = 0xeada;
|
||||
var REACT_FUNDAMENTAL_TYPE = 0xead5;
|
||||
var REACT_SCOPE_TYPE = 0xead7;
|
||||
var REACT_OPAQUE_ID_TYPE = 0xeae0;
|
||||
var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
|
||||
var REACT_OFFSCREEN_TYPE = 0xeae2;
|
||||
var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
|
||||
|
||||
if (typeof Symbol === 'function' && Symbol.for) {
|
||||
var symbolFor = Symbol.for;
|
||||
REACT_ELEMENT_TYPE = symbolFor('react.element');
|
||||
REACT_PORTAL_TYPE = symbolFor('react.portal');
|
||||
exports.Fragment = symbolFor('react.fragment');
|
||||
REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
|
||||
REACT_PROFILER_TYPE = symbolFor('react.profiler');
|
||||
REACT_PROVIDER_TYPE = symbolFor('react.provider');
|
||||
REACT_CONTEXT_TYPE = symbolFor('react.context');
|
||||
REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
|
||||
REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
|
||||
REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
|
||||
REACT_MEMO_TYPE = symbolFor('react.memo');
|
||||
REACT_LAZY_TYPE = symbolFor('react.lazy');
|
||||
REACT_BLOCK_TYPE = symbolFor('react.block');
|
||||
REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
|
||||
REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
|
||||
REACT_SCOPE_TYPE = symbolFor('react.scope');
|
||||
REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
|
||||
REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
|
||||
REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
|
||||
REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
|
||||
}
|
||||
|
||||
var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
|
||||
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
||||
function getIteratorFn(maybeIterable) {
|
||||
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
||||
return null;
|
||||
}
|
||||
|
||||
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
||||
|
||||
if (typeof maybeIterator === 'function') {
|
||||
return maybeIterator;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function error(format) {
|
||||
{
|
||||
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
printWarning('error', format, args);
|
||||
}
|
||||
}
|
||||
|
||||
function printWarning(level, format, args) {
|
||||
// When changing this logic, you might want to also
|
||||
// update consoleWithStackDev.www.js as well.
|
||||
{
|
||||
var stack = '';
|
||||
|
||||
if (stack !== '') {
|
||||
format += '%s';
|
||||
args = args.concat([stack]);
|
||||
}
|
||||
|
||||
var argsWithFormat = args.map(function (item) {
|
||||
return '' + item;
|
||||
}); // Careful: RN currently depends on this prefix
|
||||
|
||||
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
||||
// breaks IE9: https://github.com/facebook/react/issues/13610
|
||||
// eslint-disable-next-line react-internal/no-production-logging
|
||||
|
||||
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
||||
}
|
||||
}
|
||||
|
||||
// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
|
||||
|
||||
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
||||
|
||||
function isValidElementType(type) {
|
||||
if (typeof type === 'string' || typeof type === 'function') {
|
||||
return true;
|
||||
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
||||
|
||||
|
||||
if (type === exports.Fragment || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (typeof type === 'object' && type !== null) {
|
||||
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
|
||||
function describeComponentFrame (name, source, ownerName) {
|
||||
var sourceInfo = '';
|
||||
|
||||
if (source) {
|
||||
var path = source.fileName;
|
||||
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
||||
|
||||
{
|
||||
// In DEV, include code for a common special case:
|
||||
// prefer "folder/index.js" instead of just "index.js".
|
||||
if (/^index\./.test(fileName)) {
|
||||
var match = path.match(BEFORE_SLASH_RE);
|
||||
|
||||
if (match) {
|
||||
var pathBeforeSlash = match[1];
|
||||
|
||||
if (pathBeforeSlash) {
|
||||
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
||||
fileName = folderName + '/' + fileName;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
||||
} else if (ownerName) {
|
||||
sourceInfo = ' (created by ' + ownerName + ')';
|
||||
}
|
||||
|
||||
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
||||
}
|
||||
|
||||
var Resolved = 1;
|
||||
function refineResolvedLazyComponent(lazyComponent) {
|
||||
return lazyComponent._status === Resolved ? lazyComponent._result : null;
|
||||
}
|
||||
|
||||
function getWrappedName(outerType, innerType, wrapperName) {
|
||||
var functionName = innerType.displayName || innerType.name || '';
|
||||
return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
|
||||
}
|
||||
|
||||
function getComponentName(type) {
|
||||
if (type == null) {
|
||||
// Host root, text node or just invalid type.
|
||||
return null;
|
||||
}
|
||||
|
||||
{
|
||||
if (typeof type.tag === 'number') {
|
||||
error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof type === 'function') {
|
||||
return type.displayName || type.name || null;
|
||||
}
|
||||
|
||||
if (typeof type === 'string') {
|
||||
return type;
|
||||
}
|
||||
|
||||
switch (type) {
|
||||
case exports.Fragment:
|
||||
return 'Fragment';
|
||||
|
||||
case REACT_PORTAL_TYPE:
|
||||
return 'Portal';
|
||||
|
||||
case REACT_PROFILER_TYPE:
|
||||
return "Profiler";
|
||||
|
||||
case REACT_STRICT_MODE_TYPE:
|
||||
return 'StrictMode';
|
||||
|
||||
case REACT_SUSPENSE_TYPE:
|
||||
return 'Suspense';
|
||||
|
||||
case REACT_SUSPENSE_LIST_TYPE:
|
||||
return 'SuspenseList';
|
||||
}
|
||||
|
||||
if (typeof type === 'object') {
|
||||
switch (type.$$typeof) {
|
||||
case REACT_CONTEXT_TYPE:
|
||||
return 'Context.Consumer';
|
||||
|
||||
case REACT_PROVIDER_TYPE:
|
||||
return 'Context.Provider';
|
||||
|
||||
case REACT_FORWARD_REF_TYPE:
|
||||
return getWrappedName(type, type.render, 'ForwardRef');
|
||||
|
||||
case REACT_MEMO_TYPE:
|
||||
return getComponentName(type.type);
|
||||
|
||||
case REACT_BLOCK_TYPE:
|
||||
return getComponentName(type.render);
|
||||
|
||||
case REACT_LAZY_TYPE:
|
||||
{
|
||||
var thenable = type;
|
||||
var resolvedThenable = refineResolvedLazyComponent(thenable);
|
||||
|
||||
if (resolvedThenable) {
|
||||
return getComponentName(resolvedThenable);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
var loggedTypeFailures = {};
|
||||
var currentlyValidatingElement = null;
|
||||
|
||||
function setCurrentlyValidatingElement(element) {
|
||||
{
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
}
|
||||
|
||||
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
||||
{
|
||||
// $FlowFixMe This is okay but Flow doesn't know it.
|
||||
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
||||
|
||||
for (var typeSpecName in typeSpecs) {
|
||||
if (has(typeSpecs, typeSpecName)) {
|
||||
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
||||
// fail the render phase where it didn't fail before. So we log it.
|
||||
// After these have been cleaned up, we'll let them throw.
|
||||
|
||||
try {
|
||||
// This is intentionally an invariant that gets caught. It's the same
|
||||
// behavior as without this statement except with a better message.
|
||||
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
||||
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
||||
err.name = 'Invariant Violation';
|
||||
throw err;
|
||||
}
|
||||
|
||||
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
||||
} catch (ex) {
|
||||
error$1 = ex;
|
||||
}
|
||||
|
||||
if (error$1 && !(error$1 instanceof Error)) {
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
|
||||
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
||||
// Only monitor this failure once because there tends to be a lot of the
|
||||
// same error.
|
||||
loggedTypeFailures[error$1.message] = true;
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('Failed %s type: %s', location, error$1.message);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner = require('react/lib/ReactCurrentOwner');
|
||||
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
||||
var RESERVED_PROPS = {
|
||||
key: true,
|
||||
ref: true,
|
||||
__self: true,
|
||||
__source: true
|
||||
};
|
||||
var specialPropKeyWarningShown;
|
||||
var specialPropRefWarningShown;
|
||||
var didWarnAboutStringRefs;
|
||||
|
||||
{
|
||||
didWarnAboutStringRefs = {};
|
||||
}
|
||||
|
||||
function hasValidRef(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'ref')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.ref !== undefined;
|
||||
}
|
||||
|
||||
function hasValidKey(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'key')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.key !== undefined;
|
||||
}
|
||||
|
||||
function defineKeyPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingKey = function () {
|
||||
if (!specialPropKeyWarningShown) {
|
||||
specialPropKeyWarningShown = true;
|
||||
|
||||
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingKey.isReactWarning = true;
|
||||
Object.defineProperty(props, 'key', {
|
||||
get: warnAboutAccessingKey,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function defineRefPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingRef = function () {
|
||||
if (!specialPropRefWarningShown) {
|
||||
specialPropRefWarningShown = true;
|
||||
|
||||
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingRef.isReactWarning = true;
|
||||
Object.defineProperty(props, 'ref', {
|
||||
get: warnAboutAccessingRef,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Factory method to create a new React element. This no longer adheres to
|
||||
* the class pattern, so do not use new to call it. Also, instanceof check
|
||||
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
||||
* if something is a React Element.
|
||||
*
|
||||
* @param {*} type
|
||||
* @param {*} props
|
||||
* @param {*} key
|
||||
* @param {string|object} ref
|
||||
* @param {*} owner
|
||||
* @param {*} self A *temporary* helper to detect places where `this` is
|
||||
* different from the `owner` when React.createElement is called, so that we
|
||||
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
||||
* functions, and as long as `this` and owner are the same, there will be no
|
||||
* change in behavior.
|
||||
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
||||
* indicating filename, line number, and/or other information.
|
||||
* @internal
|
||||
*/
|
||||
|
||||
|
||||
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
||||
var element = {
|
||||
// This tag allows us to uniquely identify this as a React Element
|
||||
$$typeof: REACT_ELEMENT_TYPE,
|
||||
// Built-in properties that belong on the element
|
||||
type: type,
|
||||
key: key,
|
||||
ref: ref,
|
||||
props: props,
|
||||
// Record the component responsible for creating this element.
|
||||
_owner: owner
|
||||
};
|
||||
|
||||
{
|
||||
// The validation flag is currently mutative. We put it on
|
||||
// an external backing store so that we can freeze the whole object.
|
||||
// This can be replaced with a WeakMap once they are implemented in
|
||||
// commonly used development environments.
|
||||
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
||||
// the validation flag non-enumerable (where possible, which should
|
||||
// include every environment we run tests in), so the test framework
|
||||
// ignores it.
|
||||
|
||||
Object.defineProperty(element._store, 'validated', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
value: false
|
||||
}); // self and source are DEV only properties.
|
||||
|
||||
Object.defineProperty(element, '_self', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: self
|
||||
}); // Two elements created in two different places should be considered
|
||||
// equal for testing purposes and therefore we hide it from enumeration.
|
||||
|
||||
Object.defineProperty(element, '_source', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: source
|
||||
});
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(element.props);
|
||||
Object.freeze(element);
|
||||
}
|
||||
}
|
||||
|
||||
return element;
|
||||
};
|
||||
/**
|
||||
* https://github.com/reactjs/rfcs/pull/107
|
||||
* @param {*} type
|
||||
* @param {object} props
|
||||
* @param {string} key
|
||||
*/
|
||||
|
||||
function jsxDEV(type, config, maybeKey, source, self) {
|
||||
{
|
||||
var propName; // Reserved names are extracted
|
||||
|
||||
var props = {};
|
||||
var key = null;
|
||||
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
||||
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
||||
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
||||
// but as an intermediary step, we will use jsxDEV for everything except
|
||||
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
||||
// key is explicitly declared to be undefined or not.
|
||||
|
||||
if (maybeKey !== undefined) {
|
||||
key = '' + maybeKey;
|
||||
}
|
||||
|
||||
if (hasValidKey(config)) {
|
||||
key = '' + config.key;
|
||||
}
|
||||
|
||||
if (hasValidRef(config)) {
|
||||
ref = config.ref;
|
||||
} // Remaining properties are added to a new props object
|
||||
|
||||
|
||||
for (propName in config) {
|
||||
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
||||
props[propName] = config[propName];
|
||||
}
|
||||
} // Resolve default props
|
||||
|
||||
|
||||
if (type && type.defaultProps) {
|
||||
var defaultProps = type.defaultProps;
|
||||
|
||||
for (propName in defaultProps) {
|
||||
if (props[propName] === undefined) {
|
||||
props[propName] = defaultProps[propName];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (key || ref) {
|
||||
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
||||
|
||||
if (key) {
|
||||
defineKeyPropWarningGetter(props, displayName);
|
||||
}
|
||||
|
||||
if (ref) {
|
||||
defineRefPropWarningGetter(props, displayName);
|
||||
}
|
||||
}
|
||||
|
||||
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner$1 = require('react/lib/ReactCurrentOwner');
|
||||
|
||||
function setCurrentlyValidatingElement$1(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
var propTypesMisspellWarningShown;
|
||||
|
||||
{
|
||||
propTypesMisspellWarningShown = false;
|
||||
}
|
||||
/**
|
||||
* Verifies the object is a ReactElement.
|
||||
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
||||
* @param {?object} object
|
||||
* @return {boolean} True if `object` is a ReactElement.
|
||||
* @final
|
||||
*/
|
||||
|
||||
function isValidElement(object) {
|
||||
{
|
||||
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
||||
}
|
||||
}
|
||||
|
||||
function getDeclarationErrorAddendum() {
|
||||
{
|
||||
if (ReactCurrentOwner$1.current) {
|
||||
var name = ReactCurrentOwner$1.current.getName();
|
||||
|
||||
if (name) {
|
||||
return '\n\nCheck the render method of `' + name + '`.';
|
||||
}
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function getSourceInfoErrorAddendum(source) {
|
||||
{
|
||||
if (source !== undefined) {
|
||||
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
||||
var lineNumber = source.lineNumber;
|
||||
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if there's no key explicitly set on dynamic arrays of children or
|
||||
* object keys are not valid. This allows us to keep track of children between
|
||||
* updates.
|
||||
*/
|
||||
|
||||
|
||||
var ownerHasKeyUseWarning = {};
|
||||
|
||||
function getCurrentComponentErrorInfo(parentType) {
|
||||
{
|
||||
var info = getDeclarationErrorAddendum();
|
||||
|
||||
if (!info) {
|
||||
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
||||
|
||||
if (parentName) {
|
||||
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
||||
}
|
||||
}
|
||||
|
||||
return info;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if the element doesn't have an explicit key assigned to it.
|
||||
* This element is in an array. The array could grow and shrink or be
|
||||
* reordered. All children that haven't already been validated are required to
|
||||
* have a "key" property assigned to it. Error statuses are cached so a warning
|
||||
* will only be shown once.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactElement} element Element that requires a key.
|
||||
* @param {*} parentType element's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateExplicitKey(element, parentType) {
|
||||
{
|
||||
if (!element._store || element._store.validated || element.key != null) {
|
||||
return;
|
||||
}
|
||||
|
||||
element._store.validated = true;
|
||||
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
||||
|
||||
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
||||
return;
|
||||
}
|
||||
|
||||
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
||||
// property, it may be the creator of the child that's responsible for
|
||||
// assigning it a key.
|
||||
|
||||
var childOwner = '';
|
||||
|
||||
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
||||
// Give the component that originally created this child.
|
||||
childOwner = " It was passed a child from " + element._owner.getName() + ".";
|
||||
}
|
||||
|
||||
setCurrentlyValidatingElement$1(element);
|
||||
|
||||
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Ensure that every element either is passed in a static location, in an
|
||||
* array with an explicit keys property defined, or in an object literal
|
||||
* with valid key property.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactNode} node Statically passed child of any type.
|
||||
* @param {*} parentType node's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateChildKeys(node, parentType) {
|
||||
{
|
||||
if (typeof node !== 'object') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (Array.isArray(node)) {
|
||||
for (var i = 0; i < node.length; i++) {
|
||||
var child = node[i];
|
||||
|
||||
if (isValidElement(child)) {
|
||||
validateExplicitKey(child, parentType);
|
||||
}
|
||||
}
|
||||
} else if (isValidElement(node)) {
|
||||
// This element was passed in a valid location.
|
||||
if (node._store) {
|
||||
node._store.validated = true;
|
||||
}
|
||||
} else if (node) {
|
||||
var iteratorFn = getIteratorFn(node);
|
||||
|
||||
if (typeof iteratorFn === 'function') {
|
||||
// Entry iterators used to provide implicit keys,
|
||||
// but now we print a separate warning for them later.
|
||||
if (iteratorFn !== node.entries) {
|
||||
var iterator = iteratorFn.call(node);
|
||||
var step;
|
||||
|
||||
while (!(step = iterator.next()).done) {
|
||||
if (isValidElement(step.value)) {
|
||||
validateExplicitKey(step.value, parentType);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given an element, validate that its props follow the propTypes definition,
|
||||
* provided by the type.
|
||||
*
|
||||
* @param {ReactElement} element
|
||||
*/
|
||||
|
||||
|
||||
function validatePropTypes(element) {
|
||||
{
|
||||
var type = element.type;
|
||||
|
||||
if (type === null || type === undefined || typeof type === 'string') {
|
||||
return;
|
||||
}
|
||||
|
||||
var propTypes;
|
||||
|
||||
if (typeof type === 'function') {
|
||||
propTypes = type.propTypes;
|
||||
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
||||
// Inner props are checked in the reconciler.
|
||||
type.$$typeof === REACT_MEMO_TYPE)) {
|
||||
propTypes = type.propTypes;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
if (propTypes) {
|
||||
// Intentionally inside to avoid triggering lazy initializers:
|
||||
var name = getComponentName(type);
|
||||
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
||||
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
||||
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
||||
|
||||
var _name = getComponentName(type);
|
||||
|
||||
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
||||
}
|
||||
|
||||
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
||||
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given a fragment, validate that it can only be provided with fragment props
|
||||
* @param {ReactElement} fragment
|
||||
*/
|
||||
|
||||
|
||||
function validateFragmentProps(fragment) {
|
||||
{
|
||||
var keys = Object.keys(fragment.props);
|
||||
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
|
||||
if (key !== 'children' && key !== 'key') {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (fragment.ref !== null) {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
||||
{
|
||||
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
||||
// succeed and there will likely be errors in render.
|
||||
|
||||
if (!validType) {
|
||||
var info = '';
|
||||
|
||||
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
||||
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
||||
}
|
||||
|
||||
var sourceInfo = getSourceInfoErrorAddendum(source);
|
||||
|
||||
if (sourceInfo) {
|
||||
info += sourceInfo;
|
||||
} else {
|
||||
info += getDeclarationErrorAddendum();
|
||||
}
|
||||
|
||||
var typeString;
|
||||
|
||||
if (type === null) {
|
||||
typeString = 'null';
|
||||
} else if (Array.isArray(type)) {
|
||||
typeString = 'array';
|
||||
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
||||
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
||||
info = ' Did you accidentally export a JSX literal instead of a component?';
|
||||
} else {
|
||||
typeString = typeof type;
|
||||
}
|
||||
|
||||
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
||||
}
|
||||
|
||||
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
||||
// TODO: Drop this when these are no longer allowed as the type argument.
|
||||
|
||||
if (element == null) {
|
||||
return element;
|
||||
} // Skip key warning if the type isn't valid since our key validation logic
|
||||
// doesn't expect a non-string/function type and can throw confusing errors.
|
||||
// We don't want exception behavior to differ between dev and prod.
|
||||
// (Rendering will throw with a helpful message and as soon as the type is
|
||||
// fixed, the key warnings will appear.)
|
||||
|
||||
|
||||
if (validType) {
|
||||
var children = props.children;
|
||||
|
||||
if (children !== undefined) {
|
||||
if (isStaticChildren) {
|
||||
if (Array.isArray(children)) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
validateChildKeys(children[i], type);
|
||||
}
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(children);
|
||||
}
|
||||
} else {
|
||||
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
||||
}
|
||||
} else {
|
||||
validateChildKeys(children, type);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (type === exports.Fragment) {
|
||||
validateFragmentProps(element);
|
||||
} else {
|
||||
validatePropTypes(element);
|
||||
}
|
||||
|
||||
return element;
|
||||
}
|
||||
} // These two functions exist to still get child warnings in dev
|
||||
// even with the prod transform. This means that jsxDEV is purely
|
||||
// opt-in behavior for better messages but that we won't stop
|
||||
// giving you warnings if you use production apis.
|
||||
|
||||
function jsxWithValidationStatic(type, props, key) {
|
||||
{
|
||||
return jsxWithValidation(type, props, key, true);
|
||||
}
|
||||
}
|
||||
function jsxWithValidationDynamic(type, props, key) {
|
||||
{
|
||||
return jsxWithValidation(type, props, key, false);
|
||||
}
|
||||
}
|
||||
|
||||
var jsx = jsxWithValidationDynamic ; // we may want to special case jsxs internally to take advantage of static children.
|
||||
// for now we can ship identical prod functions
|
||||
|
||||
var jsxs = jsxWithValidationStatic ;
|
||||
|
||||
exports.jsx = jsx;
|
||||
exports.jsxs = jsxs;
|
||||
})();
|
||||
}
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
/** @license React v0.14.10
|
||||
* react-jsx-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';var f=require("react"),g=60103;exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var h=Symbol.for;g=h("react.element");exports.Fragment=h("react.fragment")}var m=require("react/lib/ReactCurrentOwner"),n=Object.prototype.hasOwnProperty,p={key:!0,ref:!0,__self:!0,__source:!0};
|
||||
function q(c,a,k){var b,d={},e=null,l=null;void 0!==k&&(e=""+k);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(l=a.ref);for(b in a)n.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:g,type:c,key:e,ref:l,props:d,_owner:m.current}}exports.jsx=q;exports.jsxs=q;
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"react": "0.14",
|
||||
"react-dom": "0.14"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,780 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @emails react-core
|
||||
*/
|
||||
|
||||
// These tests are based on ReactJSXElement-test,
|
||||
// ReactJSXElementValidator-test, ReactComponent-test,
|
||||
// and ReactElementJSX-test.
|
||||
|
||||
jest.mock('react/jsx-runtime', () => require('./jsx-runtime'), {virtual: true});
|
||||
jest.mock('react/jsx-dev-runtime', () => require('./jsx-dev-runtime'), {
|
||||
virtual: true,
|
||||
});
|
||||
|
||||
let React = require('react');
|
||||
let ReactDOM = require('react-dom');
|
||||
let ReactTestUtils = {
|
||||
renderIntoDocument(el) {
|
||||
const container = document.createElement('div');
|
||||
return ReactDOM.render(el, container);
|
||||
},
|
||||
};
|
||||
let PropTypes = React.PropTypes;
|
||||
let Component = class Component extends React.Component {
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
};
|
||||
let RequiredPropComponent = class extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
};
|
||||
RequiredPropComponent.displayName = 'RequiredPropComponent';
|
||||
RequiredPropComponent.propTypes = {prop: PropTypes.string.isRequired};
|
||||
|
||||
it('works', () => {
|
||||
const container = document.createElement('div');
|
||||
ReactDOM.render(<h1>hello</h1>, container);
|
||||
expect(container.textContent).toBe('hello');
|
||||
});
|
||||
|
||||
it('returns a complete element according to spec', () => {
|
||||
const element = <Component />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a lower-case to be passed as the string type', () => {
|
||||
const element = <div />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a string to be passed as the type', () => {
|
||||
const TagName = 'div';
|
||||
const element = <TagName />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('returns an immutable element', () => {
|
||||
const element = <Component />;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
expect(() => (element.type = 'div')).toThrow();
|
||||
} else {
|
||||
expect(() => (element.type = 'div')).not.toThrow();
|
||||
}
|
||||
});
|
||||
|
||||
it('does not reuse the object that is spread into props', () => {
|
||||
const config = {foo: 1};
|
||||
const element = <Component {...config} />;
|
||||
expect(element.props.foo).toBe(1);
|
||||
config.foo = 2;
|
||||
expect(element.props.foo).toBe(1);
|
||||
});
|
||||
|
||||
it('extracts key and ref from the rest of the props', () => {
|
||||
const element = <Component key="12" ref="34" foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe('34');
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('coerces the key to a string', () => {
|
||||
const element = <Component key={12} foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop', () => {
|
||||
const a = 1;
|
||||
const element = <Component children="text">{a}</Component>;
|
||||
expect(element.props.children).toBe(a);
|
||||
});
|
||||
|
||||
it('does not override children if no JSX children are provided', () => {
|
||||
const element = <Component children="text" />;
|
||||
expect(element.props.children).toBe('text');
|
||||
});
|
||||
|
||||
it('overrides children if null is provided as a JSX child', () => {
|
||||
const element = <Component children="text">{null}</Component>;
|
||||
expect(element.props.children).toBe(null);
|
||||
});
|
||||
|
||||
it('overrides children if undefined is provided as an argument', () => {
|
||||
const element = <Component children="text">{undefined}</Component>;
|
||||
expect(element.props.children).toBe(undefined);
|
||||
|
||||
const element2 = React.cloneElement(
|
||||
<Component children="text" />,
|
||||
{},
|
||||
undefined
|
||||
);
|
||||
expect(element2.props.children).toBe(undefined);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop in an array', () => {
|
||||
const a = 1;
|
||||
const b = 2;
|
||||
const c = 3;
|
||||
const element = (
|
||||
<Component>
|
||||
{a}
|
||||
{b}
|
||||
{c}
|
||||
</Component>
|
||||
);
|
||||
expect(element.props.children).toEqual([1, 2, 3]);
|
||||
});
|
||||
|
||||
it('allows static methods to be called using the type property', () => {
|
||||
class StaticMethodComponent {
|
||||
static someStaticMethod() {
|
||||
return 'someReturnValue';
|
||||
}
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
}
|
||||
|
||||
const element = <StaticMethodComponent />;
|
||||
expect(element.type.someStaticMethod()).toBe('someReturnValue');
|
||||
});
|
||||
|
||||
it('identifies valid elements', () => {
|
||||
expect(React.isValidElement(<div />)).toEqual(true);
|
||||
expect(React.isValidElement(<Component />)).toEqual(true);
|
||||
|
||||
expect(React.isValidElement(null)).toEqual(false);
|
||||
expect(React.isValidElement(true)).toEqual(false);
|
||||
expect(React.isValidElement({})).toEqual(false);
|
||||
expect(React.isValidElement('string')).toEqual(false);
|
||||
expect(React.isValidElement(Component)).toEqual(false);
|
||||
expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);
|
||||
});
|
||||
|
||||
it('is indistinguishable from a plain object', () => {
|
||||
const element = <div className="foo" />;
|
||||
const object = {};
|
||||
expect(element.constructor).toBe(object.constructor);
|
||||
});
|
||||
|
||||
it('should use default prop value when removing a prop', () => {
|
||||
Component.defaultProps = {fruit: 'persimmon'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Component fruit="mango" />, container);
|
||||
expect(instance.props.fruit).toBe('mango');
|
||||
|
||||
ReactDOM.render(<Component />, container);
|
||||
expect(instance.props.fruit).toBe('persimmon');
|
||||
});
|
||||
|
||||
it('should normalize props with default values', () => {
|
||||
class NormalizingComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NormalizingComponent.defaultProps = {prop: 'testKey'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<NormalizingComponent />, container);
|
||||
expect(instance.props.prop).toBe('testKey');
|
||||
|
||||
const inst2 = ReactDOM.render(
|
||||
<NormalizingComponent prop={null} />,
|
||||
container
|
||||
);
|
||||
expect(inst2.props.prop).toBe(null);
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements in children position', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component />, <Component />]}</Component>
|
||||
)
|
||||
).toErrorDev('Each child in a list should have a unique "key" prop.', {
|
||||
withoutStack: true,
|
||||
});
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements with owner info', () => {
|
||||
class InnerComponent extends React.Component {
|
||||
render() {
|
||||
return <Component>{this.props.childSet}</Component>;
|
||||
}
|
||||
}
|
||||
|
||||
class ComponentWrapper extends React.Component {
|
||||
render() {
|
||||
return <InnerComponent childSet={[<Component />, <Component />]} />;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<ComponentWrapper />)
|
||||
).toErrorDev(
|
||||
'Each child in a list should have a unique "key" prop.' +
|
||||
'\n\nCheck the render method of `InnerComponent`. ' +
|
||||
'It was passed a child from ComponentWrapper. ',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for arrays of elements with keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component key="#1" />, <Component key="#2" />]}</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for iterable elements with keys', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {
|
||||
value: done ? undefined : <Component key={'#' + i} />,
|
||||
done: done,
|
||||
};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn for numeric keys in entry iterable as a child', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {value: done ? undefined : [i, <Component />], done: done};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
iterable.entries = iterable['@@iterator'];
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn when the element is directly as children', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>
|
||||
<Component />
|
||||
<Component />
|
||||
</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn when the child array contains non-elements', () => {
|
||||
void (<Component>{[{}, {}]}</Component>);
|
||||
});
|
||||
|
||||
it('should give context for PropType errors in nested components.', () => {
|
||||
// In this test, we're making sure that if a proptype error is found in a
|
||||
// component, we give a small hint as to which parent instantiated that
|
||||
// component as per warnings about key usage in ReactElementValidator.
|
||||
function MyComp({color}) {
|
||||
return <div>My color is {color}</div>;
|
||||
}
|
||||
MyComp.propTypes = {
|
||||
color: PropTypes.string,
|
||||
};
|
||||
class ParentComp extends React.Component {
|
||||
render() {
|
||||
return <MyComp color={123} />;
|
||||
}
|
||||
}
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<ParentComp />)
|
||||
).toErrorDev(
|
||||
'Warning: Failed prop type: ' +
|
||||
'Invalid prop `color` of type `number` supplied to `MyComp`, ' +
|
||||
'expected `string`.',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('gives a helpful error when passing null, undefined, or boolean', () => {
|
||||
const Undefined = undefined;
|
||||
const Null = null;
|
||||
const True = true;
|
||||
const Div = 'div';
|
||||
expect(
|
||||
() => void (<Undefined />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: undefined. You likely forgot to export your ' +
|
||||
"component from the file it's defined in, or you might have mixed up " +
|
||||
'default and named imports.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<Null />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: null.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<True />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: boolean.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
// No error expected
|
||||
void (<Div />);
|
||||
});
|
||||
|
||||
it('should check default prop values', () => {
|
||||
RequiredPropComponent.defaultProps = {prop: null};
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<RequiredPropComponent />)
|
||||
).toErrorDev(
|
||||
'Warning: Failed prop type: Required prop `prop` was not specified in ' +
|
||||
'`RequiredPropComponent`.',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn on invalid prop types', () => {
|
||||
// Since there is no prevalidation step for ES6 classes, there is no hook
|
||||
// for us to issue a warning earlier than element creation when the error
|
||||
// actually occurs. Since this step is skipped in production, we should just
|
||||
// warn instead of throwing for this case.
|
||||
class NullPropTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullPropTypeComponent.propTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullPropTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullPropTypeComponent: prop type `prop` is invalid; it must be a ' +
|
||||
'function, usually from the `prop-types` package,',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
xit('should warn on invalid context types', () => {
|
||||
class NullContextTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullContextTypeComponent.contextTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullContextTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullContextTypeComponent: type `prop` is invalid; it must ' +
|
||||
'be a function, usually from the `prop-types` package,'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if getDefaultProps is specified on the class', () => {
|
||||
class GetDefaultPropsComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
GetDefaultPropsComponent.getDefaultProps = () => ({
|
||||
prop: 'foo',
|
||||
});
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<GetDefaultPropsComponent />)
|
||||
).toErrorDev(
|
||||
'getDefaultProps is only used on classic React.createClass definitions.' +
|
||||
' Use a static property named `defaultProps` instead.',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if component declares PropTypes instead of propTypes', () => {
|
||||
class MisspelledPropTypesComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
MisspelledPropTypesComponent.PropTypes = {
|
||||
prop: PropTypes.string,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<MisspelledPropTypesComponent prop="hi" />
|
||||
)
|
||||
).toErrorDev(
|
||||
'Warning: Component MisspelledPropTypesComponent declared `PropTypes` ' +
|
||||
'instead of `propTypes`. Did you misspell the property assignment?',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('warns for fragments with illegal attributes', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <React.Fragment a={1}>hello</React.Fragment>;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid prop `a` supplied to `React.Fragment`. React.Fragment ' +
|
||||
'can only have `key` and `children` props.'
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('warns for fragments with refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<React.Fragment
|
||||
ref={bar => {
|
||||
this.foo = bar;
|
||||
}}>
|
||||
hello
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid attribute `ref` supplied to `React.Fragment`.'
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('does not warn for fragments of multiple elements without keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span>1</span>
|
||||
<span>2</span>
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('warns for fragments of multiple elements with same key', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span key="a">1</span>
|
||||
<span key="a">2</span>
|
||||
<span key="b">3</span>
|
||||
</>
|
||||
)
|
||||
).toErrorDev('Encountered two children with the same key, `a`.', {
|
||||
withoutStack: true,
|
||||
});
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('does not call lazy initializers eagerly', () => {
|
||||
let didCall = false;
|
||||
const Lazy = React.lazy(() => {
|
||||
didCall = true;
|
||||
return {then() {}};
|
||||
});
|
||||
<Lazy />;
|
||||
expect(didCall).toBe(false);
|
||||
});
|
||||
|
||||
it('supports classic refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <div className="foo" ref="inner" />;
|
||||
}
|
||||
}
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Foo />, container);
|
||||
expect(instance.refs.inner.className).toBe('foo');
|
||||
});
|
||||
|
||||
it('should support refs on owned components', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref="inner" />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref="outer">
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.refs.inner.getObject()).toEqual(innerObj);
|
||||
expect(this.refs.outer.getObject()).toEqual(outerObj);
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
});
|
||||
|
||||
it('should support callback-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = (
|
||||
<Wrapper object={innerObj} ref={c => (this.innerRef = c)} />
|
||||
);
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={c => (this.outerRef = c)}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('should support object-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.innerRef = React.createRef();
|
||||
this.outerRef = React.createRef();
|
||||
}
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref={this.innerRef} />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={this.outerRef}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.current.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.current.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should support new-style refs with mixed-up owners', () => {
|
||||
class Wrapper extends React.Component {
|
||||
getTitle = () => {
|
||||
return this.props.title;
|
||||
};
|
||||
|
||||
render() {
|
||||
return this.props.getContent();
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
getInner = () => {
|
||||
// (With old-style refs, it's impossible to get a ref to this div
|
||||
// because Wrapper is the current owner when this function is called.)
|
||||
return <div className="inner" ref={c => (this.innerRef = c)} />;
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Wrapper
|
||||
title="wrapper"
|
||||
ref={c => (this.wrapperRef = c)}
|
||||
getContent={this.getInner}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
// Check .props.title to make sure we got the right elements back
|
||||
expect(this.wrapperRef.getTitle()).toBe('wrapper');
|
||||
expect(this.innerRef.className).toBe('inner');
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should warn when `key` is being accessed on composite element', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.key} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child key="0" />
|
||||
<Child key="1" />
|
||||
<Child key="2" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() =>
|
||||
ReactDOM.render(<Parent />, container)
|
||||
).toErrorDev(
|
||||
'Child: `key` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn when `ref` is being accessed', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.ref} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child ref="childElement" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() =>
|
||||
ReactDOM.render(<Parent />, container)
|
||||
).toErrorDev(
|
||||
'Child: `ref` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
// Note: no warning before 16.
|
||||
it('should NOT warn when owner and self are different for string refs', () => {
|
||||
class ClassWithRenderProp extends React.Component {
|
||||
render() {
|
||||
return this.props.children();
|
||||
}
|
||||
}
|
||||
|
||||
class ClassParent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<ClassWithRenderProp>{() => <div ref="myRef" />}</ClassWithRenderProp>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const container = document.createElement('div');
|
||||
ReactDOM.render(<ClassParent />, container);
|
||||
});
|
||||
@@ -0,0 +1,285 @@
|
||||
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||
# yarn lockfile v1
|
||||
|
||||
|
||||
acorn@^5.2.1:
|
||||
version "5.7.4"
|
||||
resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.4.tgz#3e8d8a9947d0599a1796d10225d7432f4a4acf5e"
|
||||
integrity sha512-1D++VG7BhrtvQpNbBzovKNc1FLGGEE/oGe7b9xJm/RFHMBeUaUGpluV9RLjZa47YFdPcDAenEYuq9pQPcMdLJg==
|
||||
|
||||
amdefine@>=0.0.4:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5"
|
||||
integrity sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=
|
||||
|
||||
asap@~2.0.3:
|
||||
version "2.0.6"
|
||||
resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
|
||||
integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=
|
||||
|
||||
ast-types@0.9.6:
|
||||
version "0.9.6"
|
||||
resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.9.6.tgz#102c9e9e9005d3e7e3829bf0c4fa24ee862ee9b9"
|
||||
integrity sha1-ECyenpAF0+fjgpvwxPok7oYu6bk=
|
||||
|
||||
balanced-match@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
|
||||
integrity sha1-ibTRmasr7kneFk6gK4nORi1xt2c=
|
||||
|
||||
base62@^1.1.0:
|
||||
version "1.2.8"
|
||||
resolved "https://registry.yarnpkg.com/base62/-/base62-1.2.8.tgz#1264cb0fb848d875792877479dbe8bae6bae3428"
|
||||
integrity sha512-V6YHUbjLxN1ymqNLb1DPHoU1CpfdL7d2YTIp5W3U4hhoG4hhxNmsFDs66M9EXxBiSEke5Bt5dwdfMwwZF70iLA==
|
||||
|
||||
brace-expansion@^1.1.7:
|
||||
version "1.1.11"
|
||||
resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
|
||||
integrity sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==
|
||||
dependencies:
|
||||
balanced-match "^1.0.0"
|
||||
concat-map "0.0.1"
|
||||
|
||||
commander@^2.5.0:
|
||||
version "2.20.3"
|
||||
resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
|
||||
integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
|
||||
|
||||
commoner@^0.10.1:
|
||||
version "0.10.8"
|
||||
resolved "https://registry.yarnpkg.com/commoner/-/commoner-0.10.8.tgz#34fc3672cd24393e8bb47e70caa0293811f4f2c5"
|
||||
integrity sha1-NPw2cs0kOT6LtH5wyqApOBH08sU=
|
||||
dependencies:
|
||||
commander "^2.5.0"
|
||||
detective "^4.3.1"
|
||||
glob "^5.0.15"
|
||||
graceful-fs "^4.1.2"
|
||||
iconv-lite "^0.4.5"
|
||||
mkdirp "^0.5.0"
|
||||
private "^0.1.6"
|
||||
q "^1.1.2"
|
||||
recast "^0.11.17"
|
||||
|
||||
concat-map@0.0.1:
|
||||
version "0.0.1"
|
||||
resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
|
||||
integrity sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=
|
||||
|
||||
core-js@^1.0.0:
|
||||
version "1.2.7"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
|
||||
integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
|
||||
|
||||
defined@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/defined/-/defined-1.0.0.tgz#c98d9bcef75674188e110969151199e39b1fa693"
|
||||
integrity sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM=
|
||||
|
||||
detective@^4.3.1:
|
||||
version "4.7.1"
|
||||
resolved "https://registry.yarnpkg.com/detective/-/detective-4.7.1.tgz#0eca7314338442febb6d65da54c10bb1c82b246e"
|
||||
integrity sha512-H6PmeeUcZloWtdt4DAkFyzFL94arpHr3NOwwmVILFiy+9Qd4JTxxXrzfyGk/lmct2qVGBwTSwSXagqu2BxmWig==
|
||||
dependencies:
|
||||
acorn "^5.2.1"
|
||||
defined "^1.0.0"
|
||||
|
||||
envify@^3.0.0:
|
||||
version "3.4.1"
|
||||
resolved "https://registry.yarnpkg.com/envify/-/envify-3.4.1.tgz#d7122329e8df1688ba771b12501917c9ce5cbce8"
|
||||
integrity sha1-1xIjKejfFoi6dxsSUBkXyc5cvOg=
|
||||
dependencies:
|
||||
jstransform "^11.0.3"
|
||||
through "~2.3.4"
|
||||
|
||||
esprima-fb@^15001.1.0-dev-harmony-fb:
|
||||
version "15001.1.0-dev-harmony-fb"
|
||||
resolved "https://registry.yarnpkg.com/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz#30a947303c6b8d5e955bee2b99b1d233206a6901"
|
||||
integrity sha1-MKlHMDxrjV6VW+4rmbHSMyBqaQE=
|
||||
|
||||
esprima@~3.1.0:
|
||||
version "3.1.3"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
|
||||
integrity sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=
|
||||
|
||||
fbjs@^0.6.1:
|
||||
version "0.6.1"
|
||||
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.6.1.tgz#9636b7705f5ba9684d44b72f78321254afc860f7"
|
||||
integrity sha1-lja3cF9bqWhNRLcveDISVK/IYPc=
|
||||
dependencies:
|
||||
core-js "^1.0.0"
|
||||
loose-envify "^1.0.0"
|
||||
promise "^7.0.3"
|
||||
ua-parser-js "^0.7.9"
|
||||
whatwg-fetch "^0.9.0"
|
||||
|
||||
glob@^5.0.15:
|
||||
version "5.0.15"
|
||||
resolved "https://registry.yarnpkg.com/glob/-/glob-5.0.15.tgz#1bc936b9e02f4a603fcc222ecf7633d30b8b93b1"
|
||||
integrity sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E=
|
||||
dependencies:
|
||||
inflight "^1.0.4"
|
||||
inherits "2"
|
||||
minimatch "2 || 3"
|
||||
once "^1.3.0"
|
||||
path-is-absolute "^1.0.0"
|
||||
|
||||
graceful-fs@^4.1.2:
|
||||
version "4.2.4"
|
||||
resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb"
|
||||
integrity sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw==
|
||||
|
||||
iconv-lite@^0.4.5:
|
||||
version "0.4.24"
|
||||
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
|
||||
integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==
|
||||
dependencies:
|
||||
safer-buffer ">= 2.1.2 < 3"
|
||||
|
||||
inflight@^1.0.4:
|
||||
version "1.0.6"
|
||||
resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
|
||||
integrity sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=
|
||||
dependencies:
|
||||
once "^1.3.0"
|
||||
wrappy "1"
|
||||
|
||||
inherits@2:
|
||||
version "2.0.4"
|
||||
resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
|
||||
integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
|
||||
|
||||
"js-tokens@^3.0.0 || ^4.0.0":
|
||||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
|
||||
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
|
||||
|
||||
jstransform@^11.0.3:
|
||||
version "11.0.3"
|
||||
resolved "https://registry.yarnpkg.com/jstransform/-/jstransform-11.0.3.tgz#09a78993e0ae4d4ef4487f6155a91f6190cb4223"
|
||||
integrity sha1-CaeJk+CuTU70SH9hVakfYZDLQiM=
|
||||
dependencies:
|
||||
base62 "^1.1.0"
|
||||
commoner "^0.10.1"
|
||||
esprima-fb "^15001.1.0-dev-harmony-fb"
|
||||
object-assign "^2.0.0"
|
||||
source-map "^0.4.2"
|
||||
|
||||
loose-envify@^1.0.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
|
||||
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
|
||||
dependencies:
|
||||
js-tokens "^3.0.0 || ^4.0.0"
|
||||
|
||||
"minimatch@2 || 3":
|
||||
version "3.0.4"
|
||||
resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
|
||||
integrity sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==
|
||||
dependencies:
|
||||
brace-expansion "^1.1.7"
|
||||
|
||||
minimist@^1.2.5:
|
||||
version "1.2.5"
|
||||
resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
|
||||
integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==
|
||||
|
||||
mkdirp@^0.5.0:
|
||||
version "0.5.5"
|
||||
resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def"
|
||||
integrity sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ==
|
||||
dependencies:
|
||||
minimist "^1.2.5"
|
||||
|
||||
object-assign@^2.0.0:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-2.1.1.tgz#43c36e5d569ff8e4816c4efa8be02d26967c18aa"
|
||||
integrity sha1-Q8NuXVaf+OSBbE76i+AtJpZ8GKo=
|
||||
|
||||
once@^1.3.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
|
||||
integrity sha1-WDsap3WWHUsROsF9nFC6753Xa9E=
|
||||
dependencies:
|
||||
wrappy "1"
|
||||
|
||||
path-is-absolute@^1.0.0:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
|
||||
integrity sha1-F0uSaHNVNP+8es5r9TpanhtcX18=
|
||||
|
||||
private@^0.1.6, private@~0.1.5:
|
||||
version "0.1.8"
|
||||
resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
|
||||
integrity sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg==
|
||||
|
||||
promise@^7.0.3:
|
||||
version "7.3.1"
|
||||
resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
|
||||
integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
|
||||
dependencies:
|
||||
asap "~2.0.3"
|
||||
|
||||
q@^1.1.2:
|
||||
version "1.5.1"
|
||||
resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7"
|
||||
integrity sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=
|
||||
|
||||
react-dom@0.14:
|
||||
version "0.14.9"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-0.14.9.tgz#05064a3dcf0fb1880a3b2bfc9d58c55d8d9f6293"
|
||||
integrity sha1-BQZKPc8PsYgKOyv8nVjFXY2fYpM=
|
||||
|
||||
react@0.14:
|
||||
version "0.14.9"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-0.14.9.tgz#9110a6497c49d44ba1c0edd317aec29c2e0d91d1"
|
||||
integrity sha1-kRCmSXxJ1EuhwO3TF67CnC4NkdE=
|
||||
dependencies:
|
||||
envify "^3.0.0"
|
||||
fbjs "^0.6.1"
|
||||
|
||||
recast@^0.11.17:
|
||||
version "0.11.23"
|
||||
resolved "https://registry.yarnpkg.com/recast/-/recast-0.11.23.tgz#451fd3004ab1e4df9b4e4b66376b2a21912462d3"
|
||||
integrity sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM=
|
||||
dependencies:
|
||||
ast-types "0.9.6"
|
||||
esprima "~3.1.0"
|
||||
private "~0.1.5"
|
||||
source-map "~0.5.0"
|
||||
|
||||
"safer-buffer@>= 2.1.2 < 3":
|
||||
version "2.1.2"
|
||||
resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
|
||||
integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
|
||||
|
||||
source-map@^0.4.2:
|
||||
version "0.4.4"
|
||||
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b"
|
||||
integrity sha1-66T12pwNyZneaAMti092FzZSA2s=
|
||||
dependencies:
|
||||
amdefine ">=0.0.4"
|
||||
|
||||
source-map@~0.5.0:
|
||||
version "0.5.7"
|
||||
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
|
||||
integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
|
||||
|
||||
through@~2.3.4:
|
||||
version "2.3.8"
|
||||
resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
|
||||
integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=
|
||||
|
||||
ua-parser-js@^0.7.9:
|
||||
version "0.7.22"
|
||||
resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.22.tgz#960df60a5f911ea8f1c818f3747b99c6e177eae3"
|
||||
integrity sha512-YUxzMjJ5T71w6a8WWVcMGM6YWOTX27rCoIQgLXiWaxqXSx9D7DNjiGWn1aJIRSQ5qr0xuhra77bSIh6voR/46Q==
|
||||
|
||||
whatwg-fetch@^0.9.0:
|
||||
version "0.9.0"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz#0e3684c6cb9995b43efc9df03e4c365d95fd9cc0"
|
||||
integrity sha1-DjaExsuZlbQ+/J3wPkw2XZX9nMA=
|
||||
|
||||
wrappy@1:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
|
||||
integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=
|
||||
@@ -0,0 +1,866 @@
|
||||
/** @license React v15.7.0
|
||||
* react-jsx-dev-runtime.development.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var React = require('react');
|
||||
var ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook');
|
||||
|
||||
// ATTENTION
|
||||
// When adding new symbols to this file,
|
||||
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
||||
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
||||
// nor polyfill, then a plain number is used for performance.
|
||||
var REACT_ELEMENT_TYPE = 0xeac7;
|
||||
var REACT_PORTAL_TYPE = 0xeaca;
|
||||
exports.Fragment = 0xeacb;
|
||||
var REACT_STRICT_MODE_TYPE = 0xeacc;
|
||||
var REACT_PROFILER_TYPE = 0xead2;
|
||||
var REACT_PROVIDER_TYPE = 0xeacd;
|
||||
var REACT_CONTEXT_TYPE = 0xeace;
|
||||
var REACT_FORWARD_REF_TYPE = 0xead0;
|
||||
var REACT_SUSPENSE_TYPE = 0xead1;
|
||||
var REACT_SUSPENSE_LIST_TYPE = 0xead8;
|
||||
var REACT_MEMO_TYPE = 0xead3;
|
||||
var REACT_LAZY_TYPE = 0xead4;
|
||||
var REACT_BLOCK_TYPE = 0xead9;
|
||||
var REACT_SERVER_BLOCK_TYPE = 0xeada;
|
||||
var REACT_FUNDAMENTAL_TYPE = 0xead5;
|
||||
var REACT_SCOPE_TYPE = 0xead7;
|
||||
var REACT_OPAQUE_ID_TYPE = 0xeae0;
|
||||
var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
|
||||
var REACT_OFFSCREEN_TYPE = 0xeae2;
|
||||
var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
|
||||
|
||||
if (typeof Symbol === 'function' && Symbol.for) {
|
||||
var symbolFor = Symbol.for;
|
||||
REACT_ELEMENT_TYPE = symbolFor('react.element');
|
||||
REACT_PORTAL_TYPE = symbolFor('react.portal');
|
||||
exports.Fragment = symbolFor('react.fragment');
|
||||
REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
|
||||
REACT_PROFILER_TYPE = symbolFor('react.profiler');
|
||||
REACT_PROVIDER_TYPE = symbolFor('react.provider');
|
||||
REACT_CONTEXT_TYPE = symbolFor('react.context');
|
||||
REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
|
||||
REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
|
||||
REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
|
||||
REACT_MEMO_TYPE = symbolFor('react.memo');
|
||||
REACT_LAZY_TYPE = symbolFor('react.lazy');
|
||||
REACT_BLOCK_TYPE = symbolFor('react.block');
|
||||
REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
|
||||
REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
|
||||
REACT_SCOPE_TYPE = symbolFor('react.scope');
|
||||
REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
|
||||
REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
|
||||
REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
|
||||
REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
|
||||
}
|
||||
|
||||
var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
|
||||
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
||||
function getIteratorFn(maybeIterable) {
|
||||
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
||||
return null;
|
||||
}
|
||||
|
||||
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
||||
|
||||
if (typeof maybeIterator === 'function') {
|
||||
return maybeIterator;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function error(format) {
|
||||
{
|
||||
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
printWarning('error', format, args);
|
||||
}
|
||||
}
|
||||
|
||||
function printWarning(level, format, args) {
|
||||
// When changing this logic, you might want to also
|
||||
// update consoleWithStackDev.www.js as well.
|
||||
{
|
||||
var stack = '';
|
||||
|
||||
if (currentlyValidatingElement) {
|
||||
stack += ReactComponentTreeHook.getCurrentStackAddendum(currentlyValidatingElement)
|
||||
}
|
||||
|
||||
|
||||
if (stack !== '') {
|
||||
format += '%s';
|
||||
args = args.concat([stack]);
|
||||
}
|
||||
|
||||
var argsWithFormat = args.map(function (item) {
|
||||
return '' + item;
|
||||
}); // Careful: RN currently depends on this prefix
|
||||
|
||||
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
||||
// breaks IE9: https://github.com/facebook/react/issues/13610
|
||||
// eslint-disable-next-line react-internal/no-production-logging
|
||||
|
||||
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
||||
}
|
||||
}
|
||||
|
||||
// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
|
||||
|
||||
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
||||
|
||||
function isValidElementType(type) {
|
||||
if (typeof type === 'string' || typeof type === 'function') {
|
||||
return true;
|
||||
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
||||
|
||||
|
||||
if (type === exports.Fragment || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (typeof type === 'object' && type !== null) {
|
||||
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
|
||||
function describeComponentFrame (name, source, ownerName) {
|
||||
var sourceInfo = '';
|
||||
|
||||
if (source) {
|
||||
var path = source.fileName;
|
||||
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
||||
|
||||
{
|
||||
// In DEV, include code for a common special case:
|
||||
// prefer "folder/index.js" instead of just "index.js".
|
||||
if (/^index\./.test(fileName)) {
|
||||
var match = path.match(BEFORE_SLASH_RE);
|
||||
|
||||
if (match) {
|
||||
var pathBeforeSlash = match[1];
|
||||
|
||||
if (pathBeforeSlash) {
|
||||
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
||||
fileName = folderName + '/' + fileName;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
||||
} else if (ownerName) {
|
||||
sourceInfo = ' (created by ' + ownerName + ')';
|
||||
}
|
||||
|
||||
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
||||
}
|
||||
|
||||
var Resolved = 1;
|
||||
function refineResolvedLazyComponent(lazyComponent) {
|
||||
return lazyComponent._status === Resolved ? lazyComponent._result : null;
|
||||
}
|
||||
|
||||
function getWrappedName(outerType, innerType, wrapperName) {
|
||||
var functionName = innerType.displayName || innerType.name || '';
|
||||
return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
|
||||
}
|
||||
|
||||
function getComponentName(type) {
|
||||
if (type == null) {
|
||||
// Host root, text node or just invalid type.
|
||||
return null;
|
||||
}
|
||||
|
||||
{
|
||||
if (typeof type.tag === 'number') {
|
||||
error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof type === 'function') {
|
||||
return type.displayName || type.name || null;
|
||||
}
|
||||
|
||||
if (typeof type === 'string') {
|
||||
return type;
|
||||
}
|
||||
|
||||
switch (type) {
|
||||
case exports.Fragment:
|
||||
return 'Fragment';
|
||||
|
||||
case REACT_PORTAL_TYPE:
|
||||
return 'Portal';
|
||||
|
||||
case REACT_PROFILER_TYPE:
|
||||
return "Profiler";
|
||||
|
||||
case REACT_STRICT_MODE_TYPE:
|
||||
return 'StrictMode';
|
||||
|
||||
case REACT_SUSPENSE_TYPE:
|
||||
return 'Suspense';
|
||||
|
||||
case REACT_SUSPENSE_LIST_TYPE:
|
||||
return 'SuspenseList';
|
||||
}
|
||||
|
||||
if (typeof type === 'object') {
|
||||
switch (type.$$typeof) {
|
||||
case REACT_CONTEXT_TYPE:
|
||||
return 'Context.Consumer';
|
||||
|
||||
case REACT_PROVIDER_TYPE:
|
||||
return 'Context.Provider';
|
||||
|
||||
case REACT_FORWARD_REF_TYPE:
|
||||
return getWrappedName(type, type.render, 'ForwardRef');
|
||||
|
||||
case REACT_MEMO_TYPE:
|
||||
return getComponentName(type.type);
|
||||
|
||||
case REACT_BLOCK_TYPE:
|
||||
return getComponentName(type.render);
|
||||
|
||||
case REACT_LAZY_TYPE:
|
||||
{
|
||||
var thenable = type;
|
||||
var resolvedThenable = refineResolvedLazyComponent(thenable);
|
||||
|
||||
if (resolvedThenable) {
|
||||
return getComponentName(resolvedThenable);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
var loggedTypeFailures = {};
|
||||
var currentlyValidatingElement = null;
|
||||
|
||||
function setCurrentlyValidatingElement(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
||||
{
|
||||
// $FlowFixMe This is okay but Flow doesn't know it.
|
||||
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
||||
|
||||
for (var typeSpecName in typeSpecs) {
|
||||
if (has(typeSpecs, typeSpecName)) {
|
||||
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
||||
// fail the render phase where it didn't fail before. So we log it.
|
||||
// After these have been cleaned up, we'll let them throw.
|
||||
|
||||
try {
|
||||
// This is intentionally an invariant that gets caught. It's the same
|
||||
// behavior as without this statement except with a better message.
|
||||
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
||||
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
||||
err.name = 'Invariant Violation';
|
||||
throw err;
|
||||
}
|
||||
|
||||
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
||||
} catch (ex) {
|
||||
error$1 = ex;
|
||||
}
|
||||
|
||||
if (error$1 && !(error$1 instanceof Error)) {
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
|
||||
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
||||
// Only monitor this failure once because there tends to be a lot of the
|
||||
// same error.
|
||||
loggedTypeFailures[error$1.message] = true;
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('Failed %s type: %s', location, error$1.message);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner = require('react/lib/ReactCurrentOwner');
|
||||
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
||||
var RESERVED_PROPS = {
|
||||
key: true,
|
||||
ref: true,
|
||||
__self: true,
|
||||
__source: true
|
||||
};
|
||||
var specialPropKeyWarningShown;
|
||||
var specialPropRefWarningShown;
|
||||
var didWarnAboutStringRefs;
|
||||
|
||||
{
|
||||
didWarnAboutStringRefs = {};
|
||||
}
|
||||
|
||||
function hasValidRef(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'ref')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.ref !== undefined;
|
||||
}
|
||||
|
||||
function hasValidKey(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'key')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.key !== undefined;
|
||||
}
|
||||
|
||||
function defineKeyPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingKey = function () {
|
||||
if (!specialPropKeyWarningShown) {
|
||||
specialPropKeyWarningShown = true;
|
||||
|
||||
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingKey.isReactWarning = true;
|
||||
Object.defineProperty(props, 'key', {
|
||||
get: warnAboutAccessingKey,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function defineRefPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingRef = function () {
|
||||
if (!specialPropRefWarningShown) {
|
||||
specialPropRefWarningShown = true;
|
||||
|
||||
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingRef.isReactWarning = true;
|
||||
Object.defineProperty(props, 'ref', {
|
||||
get: warnAboutAccessingRef,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Factory method to create a new React element. This no longer adheres to
|
||||
* the class pattern, so do not use new to call it. Also, instanceof check
|
||||
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
||||
* if something is a React Element.
|
||||
*
|
||||
* @param {*} type
|
||||
* @param {*} props
|
||||
* @param {*} key
|
||||
* @param {string|object} ref
|
||||
* @param {*} owner
|
||||
* @param {*} self A *temporary* helper to detect places where `this` is
|
||||
* different from the `owner` when React.createElement is called, so that we
|
||||
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
||||
* functions, and as long as `this` and owner are the same, there will be no
|
||||
* change in behavior.
|
||||
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
||||
* indicating filename, line number, and/or other information.
|
||||
* @internal
|
||||
*/
|
||||
|
||||
|
||||
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
||||
var element = {
|
||||
// This tag allows us to uniquely identify this as a React Element
|
||||
$$typeof: REACT_ELEMENT_TYPE,
|
||||
// Built-in properties that belong on the element
|
||||
type: type,
|
||||
key: key,
|
||||
ref: ref,
|
||||
props: props,
|
||||
// Record the component responsible for creating this element.
|
||||
_owner: owner
|
||||
};
|
||||
|
||||
{
|
||||
// The validation flag is currently mutative. We put it on
|
||||
// an external backing store so that we can freeze the whole object.
|
||||
// This can be replaced with a WeakMap once they are implemented in
|
||||
// commonly used development environments.
|
||||
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
||||
// the validation flag non-enumerable (where possible, which should
|
||||
// include every environment we run tests in), so the test framework
|
||||
// ignores it.
|
||||
|
||||
Object.defineProperty(element._store, 'validated', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
value: false
|
||||
}); // self and source are DEV only properties.
|
||||
|
||||
Object.defineProperty(element, '_self', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: self
|
||||
}); // Two elements created in two different places should be considered
|
||||
// equal for testing purposes and therefore we hide it from enumeration.
|
||||
|
||||
Object.defineProperty(element, '_source', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: source
|
||||
});
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(element.props);
|
||||
Object.freeze(element);
|
||||
}
|
||||
}
|
||||
|
||||
return element;
|
||||
};
|
||||
/**
|
||||
* https://github.com/reactjs/rfcs/pull/107
|
||||
* @param {*} type
|
||||
* @param {object} props
|
||||
* @param {string} key
|
||||
*/
|
||||
|
||||
function jsxDEV(type, config, maybeKey, source, self) {
|
||||
{
|
||||
var propName; // Reserved names are extracted
|
||||
|
||||
var props = {};
|
||||
var key = null;
|
||||
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
||||
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
||||
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
||||
// but as an intermediary step, we will use jsxDEV for everything except
|
||||
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
||||
// key is explicitly declared to be undefined or not.
|
||||
|
||||
if (maybeKey !== undefined) {
|
||||
key = '' + maybeKey;
|
||||
}
|
||||
|
||||
if (hasValidKey(config)) {
|
||||
key = '' + config.key;
|
||||
}
|
||||
|
||||
if (hasValidRef(config)) {
|
||||
ref = config.ref;
|
||||
} // Remaining properties are added to a new props object
|
||||
|
||||
|
||||
for (propName in config) {
|
||||
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
||||
props[propName] = config[propName];
|
||||
}
|
||||
} // Resolve default props
|
||||
|
||||
|
||||
if (type && type.defaultProps) {
|
||||
var defaultProps = type.defaultProps;
|
||||
|
||||
for (propName in defaultProps) {
|
||||
if (props[propName] === undefined) {
|
||||
props[propName] = defaultProps[propName];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (key || ref) {
|
||||
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
||||
|
||||
if (key) {
|
||||
defineKeyPropWarningGetter(props, displayName);
|
||||
}
|
||||
|
||||
if (ref) {
|
||||
defineRefPropWarningGetter(props, displayName);
|
||||
}
|
||||
}
|
||||
|
||||
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner$1 = require('react/lib/ReactCurrentOwner');
|
||||
|
||||
function setCurrentlyValidatingElement$1(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
var propTypesMisspellWarningShown;
|
||||
|
||||
{
|
||||
propTypesMisspellWarningShown = false;
|
||||
}
|
||||
/**
|
||||
* Verifies the object is a ReactElement.
|
||||
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
||||
* @param {?object} object
|
||||
* @return {boolean} True if `object` is a ReactElement.
|
||||
* @final
|
||||
*/
|
||||
|
||||
function isValidElement(object) {
|
||||
{
|
||||
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
||||
}
|
||||
}
|
||||
|
||||
function getDeclarationErrorAddendum() {
|
||||
{
|
||||
if (ReactCurrentOwner$1.current) {
|
||||
var name = ReactCurrentOwner$1.current.getName();
|
||||
|
||||
if (name) {
|
||||
return '\n\nCheck the render method of `' + name + '`.';
|
||||
}
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function getSourceInfoErrorAddendum(source) {
|
||||
{
|
||||
if (source !== undefined) {
|
||||
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
||||
var lineNumber = source.lineNumber;
|
||||
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if there's no key explicitly set on dynamic arrays of children or
|
||||
* object keys are not valid. This allows us to keep track of children between
|
||||
* updates.
|
||||
*/
|
||||
|
||||
|
||||
var ownerHasKeyUseWarning = {};
|
||||
|
||||
function getCurrentComponentErrorInfo(parentType) {
|
||||
{
|
||||
var info = getDeclarationErrorAddendum();
|
||||
|
||||
if (!info) {
|
||||
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
||||
|
||||
if (parentName) {
|
||||
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
||||
}
|
||||
}
|
||||
|
||||
return info;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if the element doesn't have an explicit key assigned to it.
|
||||
* This element is in an array. The array could grow and shrink or be
|
||||
* reordered. All children that haven't already been validated are required to
|
||||
* have a "key" property assigned to it. Error statuses are cached so a warning
|
||||
* will only be shown once.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactElement} element Element that requires a key.
|
||||
* @param {*} parentType element's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateExplicitKey(element, parentType) {
|
||||
{
|
||||
if (!element._store || element._store.validated || element.key != null) {
|
||||
return;
|
||||
}
|
||||
|
||||
element._store.validated = true;
|
||||
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
||||
|
||||
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
||||
return;
|
||||
}
|
||||
|
||||
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
||||
// property, it may be the creator of the child that's responsible for
|
||||
// assigning it a key.
|
||||
|
||||
var childOwner = '';
|
||||
|
||||
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
||||
// Give the component that originally created this child.
|
||||
childOwner = " It was passed a child from " + element._owner.getName() + ".";
|
||||
}
|
||||
|
||||
setCurrentlyValidatingElement$1(element);
|
||||
|
||||
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Ensure that every element either is passed in a static location, in an
|
||||
* array with an explicit keys property defined, or in an object literal
|
||||
* with valid key property.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactNode} node Statically passed child of any type.
|
||||
* @param {*} parentType node's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateChildKeys(node, parentType) {
|
||||
{
|
||||
if (typeof node !== 'object') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (Array.isArray(node)) {
|
||||
for (var i = 0; i < node.length; i++) {
|
||||
var child = node[i];
|
||||
|
||||
if (isValidElement(child)) {
|
||||
validateExplicitKey(child, parentType);
|
||||
}
|
||||
}
|
||||
} else if (isValidElement(node)) {
|
||||
// This element was passed in a valid location.
|
||||
if (node._store) {
|
||||
node._store.validated = true;
|
||||
}
|
||||
} else if (node) {
|
||||
var iteratorFn = getIteratorFn(node);
|
||||
|
||||
if (typeof iteratorFn === 'function') {
|
||||
// Entry iterators used to provide implicit keys,
|
||||
// but now we print a separate warning for them later.
|
||||
if (iteratorFn !== node.entries) {
|
||||
var iterator = iteratorFn.call(node);
|
||||
var step;
|
||||
|
||||
while (!(step = iterator.next()).done) {
|
||||
if (isValidElement(step.value)) {
|
||||
validateExplicitKey(step.value, parentType);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given an element, validate that its props follow the propTypes definition,
|
||||
* provided by the type.
|
||||
*
|
||||
* @param {ReactElement} element
|
||||
*/
|
||||
|
||||
|
||||
function validatePropTypes(element) {
|
||||
{
|
||||
var type = element.type;
|
||||
|
||||
if (type === null || type === undefined || typeof type === 'string') {
|
||||
return;
|
||||
}
|
||||
|
||||
var propTypes;
|
||||
|
||||
if (typeof type === 'function') {
|
||||
propTypes = type.propTypes;
|
||||
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
||||
// Inner props are checked in the reconciler.
|
||||
type.$$typeof === REACT_MEMO_TYPE)) {
|
||||
propTypes = type.propTypes;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
if (propTypes) {
|
||||
// Intentionally inside to avoid triggering lazy initializers:
|
||||
var name = getComponentName(type);
|
||||
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
||||
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
||||
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
||||
|
||||
var _name = getComponentName(type);
|
||||
|
||||
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
||||
}
|
||||
|
||||
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
||||
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given a fragment, validate that it can only be provided with fragment props
|
||||
* @param {ReactElement} fragment
|
||||
*/
|
||||
|
||||
|
||||
function validateFragmentProps(fragment) {
|
||||
{
|
||||
var keys = Object.keys(fragment.props);
|
||||
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
|
||||
if (key !== 'children' && key !== 'key') {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (fragment.ref !== null) {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
||||
{
|
||||
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
||||
// succeed and there will likely be errors in render.
|
||||
|
||||
if (!validType) {
|
||||
var info = '';
|
||||
|
||||
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
||||
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
||||
}
|
||||
|
||||
var sourceInfo = getSourceInfoErrorAddendum(source);
|
||||
|
||||
if (sourceInfo) {
|
||||
info += sourceInfo;
|
||||
} else {
|
||||
info += getDeclarationErrorAddendum();
|
||||
}
|
||||
|
||||
var typeString;
|
||||
|
||||
if (type === null) {
|
||||
typeString = 'null';
|
||||
} else if (Array.isArray(type)) {
|
||||
typeString = 'array';
|
||||
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
||||
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
||||
info = ' Did you accidentally export a JSX literal instead of a component?';
|
||||
} else {
|
||||
typeString = typeof type;
|
||||
}
|
||||
|
||||
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
||||
}
|
||||
|
||||
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
||||
// TODO: Drop this when these are no longer allowed as the type argument.
|
||||
|
||||
if (element == null) {
|
||||
return element;
|
||||
} // Skip key warning if the type isn't valid since our key validation logic
|
||||
// doesn't expect a non-string/function type and can throw confusing errors.
|
||||
// We don't want exception behavior to differ between dev and prod.
|
||||
// (Rendering will throw with a helpful message and as soon as the type is
|
||||
// fixed, the key warnings will appear.)
|
||||
|
||||
|
||||
if (validType) {
|
||||
var children = props.children;
|
||||
|
||||
if (children !== undefined) {
|
||||
if (isStaticChildren) {
|
||||
if (Array.isArray(children)) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
validateChildKeys(children[i], type);
|
||||
}
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(children);
|
||||
}
|
||||
} else {
|
||||
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
||||
}
|
||||
} else {
|
||||
validateChildKeys(children, type);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (type === exports.Fragment) {
|
||||
validateFragmentProps(element);
|
||||
} else {
|
||||
validatePropTypes(element);
|
||||
}
|
||||
|
||||
return element;
|
||||
}
|
||||
} // These two functions exist to still get child warnings in dev
|
||||
|
||||
var jsxDEV$1 = jsxWithValidation ;
|
||||
|
||||
exports.jsxDEV = jsxDEV$1;
|
||||
})();
|
||||
}
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
/** @license React v15.7.0
|
||||
* react-jsx-dev-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';require("react");exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var a=Symbol.for;exports.Fragment=a("react.fragment")}exports.jsxDEV=void 0;
|
||||
@@ -0,0 +1,888 @@
|
||||
/** @license React v15.7.0
|
||||
* react-jsx-runtime.development.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var React = require('react');
|
||||
var ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook');
|
||||
|
||||
// ATTENTION
|
||||
// When adding new symbols to this file,
|
||||
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
||||
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
||||
// nor polyfill, then a plain number is used for performance.
|
||||
var REACT_ELEMENT_TYPE = 0xeac7;
|
||||
var REACT_PORTAL_TYPE = 0xeaca;
|
||||
exports.Fragment = 0xeacb;
|
||||
var REACT_STRICT_MODE_TYPE = 0xeacc;
|
||||
var REACT_PROFILER_TYPE = 0xead2;
|
||||
var REACT_PROVIDER_TYPE = 0xeacd;
|
||||
var REACT_CONTEXT_TYPE = 0xeace;
|
||||
var REACT_FORWARD_REF_TYPE = 0xead0;
|
||||
var REACT_SUSPENSE_TYPE = 0xead1;
|
||||
var REACT_SUSPENSE_LIST_TYPE = 0xead8;
|
||||
var REACT_MEMO_TYPE = 0xead3;
|
||||
var REACT_LAZY_TYPE = 0xead4;
|
||||
var REACT_BLOCK_TYPE = 0xead9;
|
||||
var REACT_SERVER_BLOCK_TYPE = 0xeada;
|
||||
var REACT_FUNDAMENTAL_TYPE = 0xead5;
|
||||
var REACT_SCOPE_TYPE = 0xead7;
|
||||
var REACT_OPAQUE_ID_TYPE = 0xeae0;
|
||||
var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
|
||||
var REACT_OFFSCREEN_TYPE = 0xeae2;
|
||||
var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
|
||||
|
||||
if (typeof Symbol === 'function' && Symbol.for) {
|
||||
var symbolFor = Symbol.for;
|
||||
REACT_ELEMENT_TYPE = symbolFor('react.element');
|
||||
REACT_PORTAL_TYPE = symbolFor('react.portal');
|
||||
exports.Fragment = symbolFor('react.fragment');
|
||||
REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
|
||||
REACT_PROFILER_TYPE = symbolFor('react.profiler');
|
||||
REACT_PROVIDER_TYPE = symbolFor('react.provider');
|
||||
REACT_CONTEXT_TYPE = symbolFor('react.context');
|
||||
REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
|
||||
REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
|
||||
REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
|
||||
REACT_MEMO_TYPE = symbolFor('react.memo');
|
||||
REACT_LAZY_TYPE = symbolFor('react.lazy');
|
||||
REACT_BLOCK_TYPE = symbolFor('react.block');
|
||||
REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
|
||||
REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
|
||||
REACT_SCOPE_TYPE = symbolFor('react.scope');
|
||||
REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
|
||||
REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
|
||||
REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
|
||||
REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
|
||||
}
|
||||
|
||||
var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
|
||||
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
||||
function getIteratorFn(maybeIterable) {
|
||||
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
||||
return null;
|
||||
}
|
||||
|
||||
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
||||
|
||||
if (typeof maybeIterator === 'function') {
|
||||
return maybeIterator;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function error(format) {
|
||||
{
|
||||
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
printWarning('error', format, args);
|
||||
}
|
||||
}
|
||||
|
||||
function printWarning(level, format, args) {
|
||||
// When changing this logic, you might want to also
|
||||
// update consoleWithStackDev.www.js as well.
|
||||
{
|
||||
var stack = '';
|
||||
|
||||
if (currentlyValidatingElement) {
|
||||
stack += ReactComponentTreeHook.getCurrentStackAddendum(currentlyValidatingElement)
|
||||
}
|
||||
|
||||
if (stack !== '') {
|
||||
format += '%s';
|
||||
args = args.concat([stack]);
|
||||
}
|
||||
|
||||
var argsWithFormat = args.map(function (item) {
|
||||
return '' + item;
|
||||
}); // Careful: RN currently depends on this prefix
|
||||
|
||||
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
||||
// breaks IE9: https://github.com/facebook/react/issues/13610
|
||||
// eslint-disable-next-line react-internal/no-production-logging
|
||||
|
||||
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
||||
}
|
||||
}
|
||||
|
||||
// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
|
||||
|
||||
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
||||
|
||||
function isValidElementType(type) {
|
||||
if (typeof type === 'string' || typeof type === 'function') {
|
||||
return true;
|
||||
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
||||
|
||||
|
||||
if (type === exports.Fragment || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (typeof type === 'object' && type !== null) {
|
||||
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
|
||||
function describeComponentFrame (name, source, ownerName) {
|
||||
var sourceInfo = '';
|
||||
|
||||
if (source) {
|
||||
var path = source.fileName;
|
||||
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
||||
|
||||
{
|
||||
// In DEV, include code for a common special case:
|
||||
// prefer "folder/index.js" instead of just "index.js".
|
||||
if (/^index\./.test(fileName)) {
|
||||
var match = path.match(BEFORE_SLASH_RE);
|
||||
|
||||
if (match) {
|
||||
var pathBeforeSlash = match[1];
|
||||
|
||||
if (pathBeforeSlash) {
|
||||
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
||||
fileName = folderName + '/' + fileName;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
||||
} else if (ownerName) {
|
||||
sourceInfo = ' (created by ' + ownerName + ')';
|
||||
}
|
||||
|
||||
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
||||
}
|
||||
|
||||
var Resolved = 1;
|
||||
function refineResolvedLazyComponent(lazyComponent) {
|
||||
return lazyComponent._status === Resolved ? lazyComponent._result : null;
|
||||
}
|
||||
|
||||
function getWrappedName(outerType, innerType, wrapperName) {
|
||||
var functionName = innerType.displayName || innerType.name || '';
|
||||
return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
|
||||
}
|
||||
|
||||
function getComponentName(type) {
|
||||
if (type == null) {
|
||||
// Host root, text node or just invalid type.
|
||||
return null;
|
||||
}
|
||||
|
||||
{
|
||||
if (typeof type.tag === 'number') {
|
||||
error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof type === 'function') {
|
||||
return type.displayName || type.name || null;
|
||||
}
|
||||
|
||||
if (typeof type === 'string') {
|
||||
return type;
|
||||
}
|
||||
|
||||
switch (type) {
|
||||
case exports.Fragment:
|
||||
return 'Fragment';
|
||||
|
||||
case REACT_PORTAL_TYPE:
|
||||
return 'Portal';
|
||||
|
||||
case REACT_PROFILER_TYPE:
|
||||
return "Profiler";
|
||||
|
||||
case REACT_STRICT_MODE_TYPE:
|
||||
return 'StrictMode';
|
||||
|
||||
case REACT_SUSPENSE_TYPE:
|
||||
return 'Suspense';
|
||||
|
||||
case REACT_SUSPENSE_LIST_TYPE:
|
||||
return 'SuspenseList';
|
||||
}
|
||||
|
||||
if (typeof type === 'object') {
|
||||
switch (type.$$typeof) {
|
||||
case REACT_CONTEXT_TYPE:
|
||||
return 'Context.Consumer';
|
||||
|
||||
case REACT_PROVIDER_TYPE:
|
||||
return 'Context.Provider';
|
||||
|
||||
case REACT_FORWARD_REF_TYPE:
|
||||
return getWrappedName(type, type.render, 'ForwardRef');
|
||||
|
||||
case REACT_MEMO_TYPE:
|
||||
return getComponentName(type.type);
|
||||
|
||||
case REACT_BLOCK_TYPE:
|
||||
return getComponentName(type.render);
|
||||
|
||||
case REACT_LAZY_TYPE:
|
||||
{
|
||||
var thenable = type;
|
||||
var resolvedThenable = refineResolvedLazyComponent(thenable);
|
||||
|
||||
if (resolvedThenable) {
|
||||
return getComponentName(resolvedThenable);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
var loggedTypeFailures = {};
|
||||
var currentlyValidatingElement = null;
|
||||
|
||||
function setCurrentlyValidatingElement(element) {
|
||||
{
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
}
|
||||
|
||||
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
||||
{
|
||||
// $FlowFixMe This is okay but Flow doesn't know it.
|
||||
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
||||
|
||||
for (var typeSpecName in typeSpecs) {
|
||||
if (has(typeSpecs, typeSpecName)) {
|
||||
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
||||
// fail the render phase where it didn't fail before. So we log it.
|
||||
// After these have been cleaned up, we'll let them throw.
|
||||
|
||||
try {
|
||||
// This is intentionally an invariant that gets caught. It's the same
|
||||
// behavior as without this statement except with a better message.
|
||||
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
||||
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
||||
err.name = 'Invariant Violation';
|
||||
throw err;
|
||||
}
|
||||
|
||||
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
||||
} catch (ex) {
|
||||
error$1 = ex;
|
||||
}
|
||||
|
||||
if (error$1 && !(error$1 instanceof Error)) {
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
|
||||
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
||||
// Only monitor this failure once because there tends to be a lot of the
|
||||
// same error.
|
||||
loggedTypeFailures[error$1.message] = true;
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('Failed %s type: %s', location, error$1.message);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner = require('react/lib/ReactCurrentOwner');
|
||||
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
||||
var RESERVED_PROPS = {
|
||||
key: true,
|
||||
ref: true,
|
||||
__self: true,
|
||||
__source: true
|
||||
};
|
||||
var specialPropKeyWarningShown;
|
||||
var specialPropRefWarningShown;
|
||||
var didWarnAboutStringRefs;
|
||||
|
||||
{
|
||||
didWarnAboutStringRefs = {};
|
||||
}
|
||||
|
||||
function hasValidRef(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'ref')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.ref !== undefined;
|
||||
}
|
||||
|
||||
function hasValidKey(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'key')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.key !== undefined;
|
||||
}
|
||||
|
||||
function defineKeyPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingKey = function () {
|
||||
if (!specialPropKeyWarningShown) {
|
||||
specialPropKeyWarningShown = true;
|
||||
|
||||
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingKey.isReactWarning = true;
|
||||
Object.defineProperty(props, 'key', {
|
||||
get: warnAboutAccessingKey,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function defineRefPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingRef = function () {
|
||||
if (!specialPropRefWarningShown) {
|
||||
specialPropRefWarningShown = true;
|
||||
|
||||
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingRef.isReactWarning = true;
|
||||
Object.defineProperty(props, 'ref', {
|
||||
get: warnAboutAccessingRef,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Factory method to create a new React element. This no longer adheres to
|
||||
* the class pattern, so do not use new to call it. Also, instanceof check
|
||||
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
||||
* if something is a React Element.
|
||||
*
|
||||
* @param {*} type
|
||||
* @param {*} props
|
||||
* @param {*} key
|
||||
* @param {string|object} ref
|
||||
* @param {*} owner
|
||||
* @param {*} self A *temporary* helper to detect places where `this` is
|
||||
* different from the `owner` when React.createElement is called, so that we
|
||||
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
||||
* functions, and as long as `this` and owner are the same, there will be no
|
||||
* change in behavior.
|
||||
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
||||
* indicating filename, line number, and/or other information.
|
||||
* @internal
|
||||
*/
|
||||
|
||||
|
||||
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
||||
var element = {
|
||||
// This tag allows us to uniquely identify this as a React Element
|
||||
$$typeof: REACT_ELEMENT_TYPE,
|
||||
// Built-in properties that belong on the element
|
||||
type: type,
|
||||
key: key,
|
||||
ref: ref,
|
||||
props: props,
|
||||
// Record the component responsible for creating this element.
|
||||
_owner: owner
|
||||
};
|
||||
|
||||
{
|
||||
// The validation flag is currently mutative. We put it on
|
||||
// an external backing store so that we can freeze the whole object.
|
||||
// This can be replaced with a WeakMap once they are implemented in
|
||||
// commonly used development environments.
|
||||
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
||||
// the validation flag non-enumerable (where possible, which should
|
||||
// include every environment we run tests in), so the test framework
|
||||
// ignores it.
|
||||
|
||||
Object.defineProperty(element._store, 'validated', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
value: false
|
||||
}); // self and source are DEV only properties.
|
||||
|
||||
Object.defineProperty(element, '_self', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: self
|
||||
}); // Two elements created in two different places should be considered
|
||||
// equal for testing purposes and therefore we hide it from enumeration.
|
||||
|
||||
Object.defineProperty(element, '_source', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: source
|
||||
});
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(element.props);
|
||||
Object.freeze(element);
|
||||
}
|
||||
}
|
||||
|
||||
return element;
|
||||
};
|
||||
/**
|
||||
* https://github.com/reactjs/rfcs/pull/107
|
||||
* @param {*} type
|
||||
* @param {object} props
|
||||
* @param {string} key
|
||||
*/
|
||||
|
||||
function jsxDEV(type, config, maybeKey, source, self) {
|
||||
{
|
||||
var propName; // Reserved names are extracted
|
||||
|
||||
var props = {};
|
||||
var key = null;
|
||||
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
||||
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
||||
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
||||
// but as an intermediary step, we will use jsxDEV for everything except
|
||||
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
||||
// key is explicitly declared to be undefined or not.
|
||||
|
||||
if (maybeKey !== undefined) {
|
||||
key = '' + maybeKey;
|
||||
}
|
||||
|
||||
if (hasValidKey(config)) {
|
||||
key = '' + config.key;
|
||||
}
|
||||
|
||||
if (hasValidRef(config)) {
|
||||
ref = config.ref;
|
||||
} // Remaining properties are added to a new props object
|
||||
|
||||
|
||||
for (propName in config) {
|
||||
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
||||
props[propName] = config[propName];
|
||||
}
|
||||
} // Resolve default props
|
||||
|
||||
|
||||
if (type && type.defaultProps) {
|
||||
var defaultProps = type.defaultProps;
|
||||
|
||||
for (propName in defaultProps) {
|
||||
if (props[propName] === undefined) {
|
||||
props[propName] = defaultProps[propName];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (key || ref) {
|
||||
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
||||
|
||||
if (key) {
|
||||
defineKeyPropWarningGetter(props, displayName);
|
||||
}
|
||||
|
||||
if (ref) {
|
||||
defineRefPropWarningGetter(props, displayName);
|
||||
}
|
||||
}
|
||||
|
||||
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner$1 = require('react/lib/ReactCurrentOwner');
|
||||
|
||||
function setCurrentlyValidatingElement$1(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
var propTypesMisspellWarningShown;
|
||||
|
||||
{
|
||||
propTypesMisspellWarningShown = false;
|
||||
}
|
||||
/**
|
||||
* Verifies the object is a ReactElement.
|
||||
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
||||
* @param {?object} object
|
||||
* @return {boolean} True if `object` is a ReactElement.
|
||||
* @final
|
||||
*/
|
||||
|
||||
function isValidElement(object) {
|
||||
{
|
||||
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
||||
}
|
||||
}
|
||||
|
||||
function getDeclarationErrorAddendum() {
|
||||
{
|
||||
if (ReactCurrentOwner$1.current) {
|
||||
var name = ReactCurrentOwner$1.current.getName();
|
||||
|
||||
if (name) {
|
||||
return '\n\nCheck the render method of `' + name + '`.';
|
||||
}
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function getSourceInfoErrorAddendum(source) {
|
||||
{
|
||||
if (source !== undefined) {
|
||||
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
||||
var lineNumber = source.lineNumber;
|
||||
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if there's no key explicitly set on dynamic arrays of children or
|
||||
* object keys are not valid. This allows us to keep track of children between
|
||||
* updates.
|
||||
*/
|
||||
|
||||
|
||||
var ownerHasKeyUseWarning = {};
|
||||
|
||||
function getCurrentComponentErrorInfo(parentType) {
|
||||
{
|
||||
var info = getDeclarationErrorAddendum();
|
||||
|
||||
if (!info) {
|
||||
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
||||
|
||||
if (parentName) {
|
||||
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
||||
}
|
||||
}
|
||||
|
||||
return info;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if the element doesn't have an explicit key assigned to it.
|
||||
* This element is in an array. The array could grow and shrink or be
|
||||
* reordered. All children that haven't already been validated are required to
|
||||
* have a "key" property assigned to it. Error statuses are cached so a warning
|
||||
* will only be shown once.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactElement} element Element that requires a key.
|
||||
* @param {*} parentType element's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateExplicitKey(element, parentType) {
|
||||
{
|
||||
if (!element._store || element._store.validated || element.key != null) {
|
||||
return;
|
||||
}
|
||||
|
||||
element._store.validated = true;
|
||||
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
||||
|
||||
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
||||
return;
|
||||
}
|
||||
|
||||
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
||||
// property, it may be the creator of the child that's responsible for
|
||||
// assigning it a key.
|
||||
|
||||
var childOwner = '';
|
||||
|
||||
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
||||
// Give the component that originally created this child.
|
||||
childOwner = " It was passed a child from " + element._owner.getName() + ".";
|
||||
}
|
||||
|
||||
setCurrentlyValidatingElement$1(element);
|
||||
|
||||
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Ensure that every element either is passed in a static location, in an
|
||||
* array with an explicit keys property defined, or in an object literal
|
||||
* with valid key property.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactNode} node Statically passed child of any type.
|
||||
* @param {*} parentType node's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateChildKeys(node, parentType) {
|
||||
{
|
||||
if (typeof node !== 'object') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (Array.isArray(node)) {
|
||||
for (var i = 0; i < node.length; i++) {
|
||||
var child = node[i];
|
||||
|
||||
if (isValidElement(child)) {
|
||||
validateExplicitKey(child, parentType);
|
||||
}
|
||||
}
|
||||
} else if (isValidElement(node)) {
|
||||
// This element was passed in a valid location.
|
||||
if (node._store) {
|
||||
node._store.validated = true;
|
||||
}
|
||||
} else if (node) {
|
||||
var iteratorFn = getIteratorFn(node);
|
||||
|
||||
if (typeof iteratorFn === 'function') {
|
||||
// Entry iterators used to provide implicit keys,
|
||||
// but now we print a separate warning for them later.
|
||||
if (iteratorFn !== node.entries) {
|
||||
var iterator = iteratorFn.call(node);
|
||||
var step;
|
||||
|
||||
while (!(step = iterator.next()).done) {
|
||||
if (isValidElement(step.value)) {
|
||||
validateExplicitKey(step.value, parentType);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given an element, validate that its props follow the propTypes definition,
|
||||
* provided by the type.
|
||||
*
|
||||
* @param {ReactElement} element
|
||||
*/
|
||||
|
||||
|
||||
function validatePropTypes(element) {
|
||||
{
|
||||
var type = element.type;
|
||||
|
||||
if (type === null || type === undefined || typeof type === 'string') {
|
||||
return;
|
||||
}
|
||||
|
||||
var propTypes;
|
||||
|
||||
if (typeof type === 'function') {
|
||||
propTypes = type.propTypes;
|
||||
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
||||
// Inner props are checked in the reconciler.
|
||||
type.$$typeof === REACT_MEMO_TYPE)) {
|
||||
propTypes = type.propTypes;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
if (propTypes) {
|
||||
// Intentionally inside to avoid triggering lazy initializers:
|
||||
var name = getComponentName(type);
|
||||
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
||||
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
||||
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
||||
|
||||
var _name = getComponentName(type);
|
||||
|
||||
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
||||
}
|
||||
|
||||
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
||||
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given a fragment, validate that it can only be provided with fragment props
|
||||
* @param {ReactElement} fragment
|
||||
*/
|
||||
|
||||
|
||||
function validateFragmentProps(fragment) {
|
||||
{
|
||||
var keys = Object.keys(fragment.props);
|
||||
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
|
||||
if (key !== 'children' && key !== 'key') {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (fragment.ref !== null) {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
||||
{
|
||||
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
||||
// succeed and there will likely be errors in render.
|
||||
|
||||
if (!validType) {
|
||||
var info = '';
|
||||
|
||||
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
||||
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
||||
}
|
||||
|
||||
var sourceInfo = getSourceInfoErrorAddendum(source);
|
||||
|
||||
if (sourceInfo) {
|
||||
info += sourceInfo;
|
||||
} else {
|
||||
info += getDeclarationErrorAddendum();
|
||||
}
|
||||
|
||||
var typeString;
|
||||
|
||||
if (type === null) {
|
||||
typeString = 'null';
|
||||
} else if (Array.isArray(type)) {
|
||||
typeString = 'array';
|
||||
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
||||
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
||||
info = ' Did you accidentally export a JSX literal instead of a component?';
|
||||
} else {
|
||||
typeString = typeof type;
|
||||
}
|
||||
|
||||
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
||||
}
|
||||
|
||||
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
||||
// TODO: Drop this when these are no longer allowed as the type argument.
|
||||
|
||||
if (element == null) {
|
||||
return element;
|
||||
} // Skip key warning if the type isn't valid since our key validation logic
|
||||
// doesn't expect a non-string/function type and can throw confusing errors.
|
||||
// We don't want exception behavior to differ between dev and prod.
|
||||
// (Rendering will throw with a helpful message and as soon as the type is
|
||||
// fixed, the key warnings will appear.)
|
||||
|
||||
|
||||
if (validType) {
|
||||
var children = props.children;
|
||||
|
||||
if (children !== undefined) {
|
||||
if (isStaticChildren) {
|
||||
if (Array.isArray(children)) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
validateChildKeys(children[i], type);
|
||||
}
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(children);
|
||||
}
|
||||
} else {
|
||||
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
||||
}
|
||||
} else {
|
||||
validateChildKeys(children, type);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (type === exports.Fragment) {
|
||||
validateFragmentProps(element);
|
||||
} else {
|
||||
validatePropTypes(element);
|
||||
}
|
||||
|
||||
return element;
|
||||
}
|
||||
} // These two functions exist to still get child warnings in dev
|
||||
// even with the prod transform. This means that jsxDEV is purely
|
||||
// opt-in behavior for better messages but that we won't stop
|
||||
// giving you warnings if you use production apis.
|
||||
|
||||
function jsxWithValidationStatic(type, props, key) {
|
||||
{
|
||||
return jsxWithValidation(type, props, key, true);
|
||||
}
|
||||
}
|
||||
function jsxWithValidationDynamic(type, props, key) {
|
||||
{
|
||||
return jsxWithValidation(type, props, key, false);
|
||||
}
|
||||
}
|
||||
|
||||
var jsx = jsxWithValidationDynamic ; // we may want to special case jsxs internally to take advantage of static children.
|
||||
// for now we can ship identical prod functions
|
||||
|
||||
var jsxs = jsxWithValidationStatic ;
|
||||
|
||||
exports.jsx = jsx;
|
||||
exports.jsxs = jsxs;
|
||||
})();
|
||||
}
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
/** @license React v15.7.0
|
||||
* react-jsx-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';var f=require("react"),g=60103;exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var h=Symbol.for;g=h("react.element");exports.Fragment=h("react.fragment")}var m=require("react/lib/ReactCurrentOwner"),n=Object.prototype.hasOwnProperty,p={key:!0,ref:!0,__self:!0,__source:!0};
|
||||
function q(c,a,k){var b,d={},e=null,l=null;void 0!==k&&(e=""+k);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(l=a.ref);for(b in a)n.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:g,type:c,key:e,ref:l,props:d,_owner:m.current}}exports.jsx=q;exports.jsxs=q;
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"react": "15",
|
||||
"react-dom": "15"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,775 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @emails react-core
|
||||
*/
|
||||
|
||||
// These tests are based on ReactJSXElement-test,
|
||||
// ReactJSXElementValidator-test, ReactComponent-test,
|
||||
// and ReactElementJSX-test.
|
||||
|
||||
jest.mock('react/jsx-runtime', () => require('./jsx-runtime'), {virtual: true});
|
||||
jest.mock('react/jsx-dev-runtime', () => require('./jsx-dev-runtime'), {
|
||||
virtual: true,
|
||||
});
|
||||
|
||||
let React = require('react');
|
||||
let ReactDOM = require('react-dom');
|
||||
let ReactTestUtils = {
|
||||
renderIntoDocument(el) {
|
||||
const container = document.createElement('div');
|
||||
return ReactDOM.render(el, container);
|
||||
},
|
||||
};
|
||||
let PropTypes = require('prop-types');
|
||||
let Component = class Component extends React.Component {
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
};
|
||||
let RequiredPropComponent = class extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
};
|
||||
RequiredPropComponent.displayName = 'RequiredPropComponent';
|
||||
RequiredPropComponent.propTypes = {prop: PropTypes.string.isRequired};
|
||||
|
||||
it('works', () => {
|
||||
const container = document.createElement('div');
|
||||
ReactDOM.render(<h1>hello</h1>, container);
|
||||
expect(container.textContent).toBe('hello');
|
||||
});
|
||||
|
||||
it('returns a complete element according to spec', () => {
|
||||
const element = <Component />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a lower-case to be passed as the string type', () => {
|
||||
const element = <div />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a string to be passed as the type', () => {
|
||||
const TagName = 'div';
|
||||
const element = <TagName />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('returns an immutable element', () => {
|
||||
const element = <Component />;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
expect(() => (element.type = 'div')).toThrow();
|
||||
} else {
|
||||
expect(() => (element.type = 'div')).not.toThrow();
|
||||
}
|
||||
});
|
||||
|
||||
it('does not reuse the object that is spread into props', () => {
|
||||
const config = {foo: 1};
|
||||
const element = <Component {...config} />;
|
||||
expect(element.props.foo).toBe(1);
|
||||
config.foo = 2;
|
||||
expect(element.props.foo).toBe(1);
|
||||
});
|
||||
|
||||
it('extracts key and ref from the rest of the props', () => {
|
||||
const element = <Component key="12" ref="34" foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe('34');
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('coerces the key to a string', () => {
|
||||
const element = <Component key={12} foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop', () => {
|
||||
const a = 1;
|
||||
const element = <Component children="text">{a}</Component>;
|
||||
expect(element.props.children).toBe(a);
|
||||
});
|
||||
|
||||
it('does not override children if no JSX children are provided', () => {
|
||||
const element = <Component children="text" />;
|
||||
expect(element.props.children).toBe('text');
|
||||
});
|
||||
|
||||
it('overrides children if null is provided as a JSX child', () => {
|
||||
const element = <Component children="text">{null}</Component>;
|
||||
expect(element.props.children).toBe(null);
|
||||
});
|
||||
|
||||
it('overrides children if undefined is provided as an argument', () => {
|
||||
const element = <Component children="text">{undefined}</Component>;
|
||||
expect(element.props.children).toBe(undefined);
|
||||
|
||||
const element2 = React.cloneElement(
|
||||
<Component children="text" />,
|
||||
{},
|
||||
undefined
|
||||
);
|
||||
expect(element2.props.children).toBe(undefined);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop in an array', () => {
|
||||
const a = 1;
|
||||
const b = 2;
|
||||
const c = 3;
|
||||
const element = (
|
||||
<Component>
|
||||
{a}
|
||||
{b}
|
||||
{c}
|
||||
</Component>
|
||||
);
|
||||
expect(element.props.children).toEqual([1, 2, 3]);
|
||||
});
|
||||
|
||||
it('allows static methods to be called using the type property', () => {
|
||||
class StaticMethodComponent {
|
||||
static someStaticMethod() {
|
||||
return 'someReturnValue';
|
||||
}
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
}
|
||||
|
||||
const element = <StaticMethodComponent />;
|
||||
expect(element.type.someStaticMethod()).toBe('someReturnValue');
|
||||
});
|
||||
|
||||
it('identifies valid elements', () => {
|
||||
expect(React.isValidElement(<div />)).toEqual(true);
|
||||
expect(React.isValidElement(<Component />)).toEqual(true);
|
||||
|
||||
expect(React.isValidElement(null)).toEqual(false);
|
||||
expect(React.isValidElement(true)).toEqual(false);
|
||||
expect(React.isValidElement({})).toEqual(false);
|
||||
expect(React.isValidElement('string')).toEqual(false);
|
||||
expect(React.isValidElement(Component)).toEqual(false);
|
||||
expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);
|
||||
});
|
||||
|
||||
it('is indistinguishable from a plain object', () => {
|
||||
const element = <div className="foo" />;
|
||||
const object = {};
|
||||
expect(element.constructor).toBe(object.constructor);
|
||||
});
|
||||
|
||||
it('should use default prop value when removing a prop', () => {
|
||||
Component.defaultProps = {fruit: 'persimmon'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Component fruit="mango" />, container);
|
||||
expect(instance.props.fruit).toBe('mango');
|
||||
|
||||
ReactDOM.render(<Component />, container);
|
||||
expect(instance.props.fruit).toBe('persimmon');
|
||||
});
|
||||
|
||||
it('should normalize props with default values', () => {
|
||||
class NormalizingComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NormalizingComponent.defaultProps = {prop: 'testKey'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<NormalizingComponent />, container);
|
||||
expect(instance.props.prop).toBe('testKey');
|
||||
|
||||
const inst2 = ReactDOM.render(
|
||||
<NormalizingComponent prop={null} />,
|
||||
container
|
||||
);
|
||||
expect(inst2.props.prop).toBe(null);
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements in children position', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component />, <Component />]}</Component>
|
||||
)
|
||||
).toErrorDev('Each child in a list should have a unique "key" prop.');
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements with owner info', () => {
|
||||
class InnerComponent extends React.Component {
|
||||
render() {
|
||||
return <Component>{this.props.childSet}</Component>;
|
||||
}
|
||||
}
|
||||
|
||||
class ComponentWrapper extends React.Component {
|
||||
render() {
|
||||
return <InnerComponent childSet={[<Component />, <Component />]} />;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<ComponentWrapper />)
|
||||
).toErrorDev(
|
||||
'Each child in a list should have a unique "key" prop.' +
|
||||
'\n\nCheck the render method of `InnerComponent`. ' +
|
||||
'It was passed a child from ComponentWrapper. '
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for arrays of elements with keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component key="#1" />, <Component key="#2" />]}</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for iterable elements with keys', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {
|
||||
value: done ? undefined : <Component key={'#' + i} />,
|
||||
done: done,
|
||||
};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn for numeric keys in entry iterable as a child', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {value: done ? undefined : [i, <Component />], done: done};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
iterable.entries = iterable['@@iterator'];
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn when the element is directly as children', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>
|
||||
<Component />
|
||||
<Component />
|
||||
</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn when the child array contains non-elements', () => {
|
||||
void (<Component>{[{}, {}]}</Component>);
|
||||
});
|
||||
|
||||
it('should give context for PropType errors in nested components.', () => {
|
||||
// In this test, we're making sure that if a proptype error is found in a
|
||||
// component, we give a small hint as to which parent instantiated that
|
||||
// component as per warnings about key usage in ReactElementValidator.
|
||||
function MyComp({color}) {
|
||||
return <div>My color is {color}</div>;
|
||||
}
|
||||
MyComp.propTypes = {
|
||||
color: PropTypes.string,
|
||||
};
|
||||
class ParentComp extends React.Component {
|
||||
render() {
|
||||
return <MyComp color={123} />;
|
||||
}
|
||||
}
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<ParentComp />)).toErrorDev(
|
||||
'Warning: Failed prop type: ' +
|
||||
'Invalid prop `color` of type `number` supplied to `MyComp`, ' +
|
||||
'expected `string`.\n' +
|
||||
' in MyComp (at **)\n' +
|
||||
' in ParentComp (at **)'
|
||||
);
|
||||
});
|
||||
|
||||
it('gives a helpful error when passing null, undefined, or boolean', () => {
|
||||
const Undefined = undefined;
|
||||
const Null = null;
|
||||
const True = true;
|
||||
const Div = 'div';
|
||||
expect(
|
||||
() => void (<Undefined />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: undefined. You likely forgot to export your ' +
|
||||
"component from the file it's defined in, or you might have mixed up " +
|
||||
'default and named imports.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<Null />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: null.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<True />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: boolean.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
// No error expected
|
||||
void (<Div />);
|
||||
});
|
||||
|
||||
it('should check default prop values', () => {
|
||||
RequiredPropComponent.defaultProps = {prop: null};
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<RequiredPropComponent />)
|
||||
).toErrorDev(
|
||||
'Warning: Failed prop type: The prop `prop` is marked as required in ' +
|
||||
'`RequiredPropComponent`, but its value is `null`.\n' +
|
||||
' in RequiredPropComponent (at **)'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn on invalid prop types', () => {
|
||||
// Since there is no prevalidation step for ES6 classes, there is no hook
|
||||
// for us to issue a warning earlier than element creation when the error
|
||||
// actually occurs. Since this step is skipped in production, we should just
|
||||
// warn instead of throwing for this case.
|
||||
class NullPropTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullPropTypeComponent.propTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullPropTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullPropTypeComponent: prop type `prop` is invalid; it must be a ' +
|
||||
'function, usually from the `prop-types` package,'
|
||||
);
|
||||
});
|
||||
|
||||
xit('should warn on invalid context types', () => {
|
||||
class NullContextTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullContextTypeComponent.contextTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullContextTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullContextTypeComponent: type `prop` is invalid; it must ' +
|
||||
'be a function, usually from the `prop-types` package,'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if getDefaultProps is specified on the class', () => {
|
||||
class GetDefaultPropsComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
GetDefaultPropsComponent.getDefaultProps = () => ({
|
||||
prop: 'foo',
|
||||
});
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<GetDefaultPropsComponent />)
|
||||
).toErrorDev(
|
||||
'getDefaultProps is only used on classic React.createClass definitions.' +
|
||||
' Use a static property named `defaultProps` instead.',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if component declares PropTypes instead of propTypes', () => {
|
||||
class MisspelledPropTypesComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
MisspelledPropTypesComponent.PropTypes = {
|
||||
prop: PropTypes.string,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<MisspelledPropTypesComponent prop="hi" />
|
||||
)
|
||||
).toErrorDev(
|
||||
'Warning: Component MisspelledPropTypesComponent declared `PropTypes` ' +
|
||||
'instead of `propTypes`. Did you misspell the property assignment?',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('warns for fragments with illegal attributes', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <React.Fragment a={1}>hello</React.Fragment>;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid prop `a` supplied to `React.Fragment`. React.Fragment ' +
|
||||
'can only have `key` and `children` props.'
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('warns for fragments with refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<React.Fragment
|
||||
ref={bar => {
|
||||
this.foo = bar;
|
||||
}}>
|
||||
hello
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid attribute `ref` supplied to `React.Fragment`.'
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('does not warn for fragments of multiple elements without keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span>1</span>
|
||||
<span>2</span>
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('warns for fragments of multiple elements with same key', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span key="a">1</span>
|
||||
<span key="a">2</span>
|
||||
<span key="b">3</span>
|
||||
</>
|
||||
)
|
||||
).toErrorDev('Encountered two children with the same key, `a`.', {
|
||||
withoutStack: true,
|
||||
});
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('does not call lazy initializers eagerly', () => {
|
||||
let didCall = false;
|
||||
const Lazy = React.lazy(() => {
|
||||
didCall = true;
|
||||
return {then() {}};
|
||||
});
|
||||
<Lazy />;
|
||||
expect(didCall).toBe(false);
|
||||
});
|
||||
|
||||
it('supports classic refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <div className="foo" ref="inner" />;
|
||||
}
|
||||
}
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Foo />, container);
|
||||
expect(instance.refs.inner.className).toBe('foo');
|
||||
});
|
||||
|
||||
it('should support refs on owned components', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref="inner" />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref="outer">
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.refs.inner.getObject()).toEqual(innerObj);
|
||||
expect(this.refs.outer.getObject()).toEqual(outerObj);
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
});
|
||||
|
||||
it('should support callback-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = (
|
||||
<Wrapper object={innerObj} ref={c => (this.innerRef = c)} />
|
||||
);
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={c => (this.outerRef = c)}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
// Not supported.
|
||||
xit('should support object-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.innerRef = React.createRef();
|
||||
this.outerRef = React.createRef();
|
||||
}
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref={this.innerRef} />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={this.outerRef}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.current.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.current.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should support new-style refs with mixed-up owners', () => {
|
||||
class Wrapper extends React.Component {
|
||||
getTitle = () => {
|
||||
return this.props.title;
|
||||
};
|
||||
|
||||
render() {
|
||||
return this.props.getContent();
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
getInner = () => {
|
||||
// (With old-style refs, it's impossible to get a ref to this div
|
||||
// because Wrapper is the current owner when this function is called.)
|
||||
return <div className="inner" ref={c => (this.innerRef = c)} />;
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Wrapper
|
||||
title="wrapper"
|
||||
ref={c => (this.wrapperRef = c)}
|
||||
getContent={this.getInner}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
// Check .props.title to make sure we got the right elements back
|
||||
expect(this.wrapperRef.getTitle()).toBe('wrapper');
|
||||
expect(this.innerRef.className).toBe('inner');
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should warn when `key` is being accessed on composite element', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.key} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child key="0" />
|
||||
<Child key="1" />
|
||||
<Child key="2" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() =>
|
||||
ReactDOM.render(<Parent />, container)
|
||||
).toErrorDev(
|
||||
'Child: `key` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn when `ref` is being accessed', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.ref} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child ref="childElement" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() =>
|
||||
ReactDOM.render(<Parent />, container)
|
||||
).toErrorDev(
|
||||
'Child: `ref` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
// Note: no warning before 16.
|
||||
it('should NOT warn when owner and self are different for string refs', () => {
|
||||
class ClassWithRenderProp extends React.Component {
|
||||
render() {
|
||||
return this.props.children();
|
||||
}
|
||||
}
|
||||
|
||||
class ClassParent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<ClassWithRenderProp>{() => <div ref="myRef" />}</ClassWithRenderProp>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const container = document.createElement('div');
|
||||
ReactDOM.render(<ClassParent />, container);
|
||||
});
|
||||
@@ -0,0 +1,149 @@
|
||||
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||
# yarn lockfile v1
|
||||
|
||||
|
||||
asap@~2.0.3:
|
||||
version "2.0.6"
|
||||
resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
|
||||
integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=
|
||||
|
||||
core-js@^1.0.0:
|
||||
version "1.2.7"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
|
||||
integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
|
||||
|
||||
create-react-class@^15.6.0:
|
||||
version "15.6.3"
|
||||
resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
|
||||
integrity sha512-M+/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt/ZDBemHO1DDZhsalX/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==
|
||||
dependencies:
|
||||
fbjs "^0.8.9"
|
||||
loose-envify "^1.3.1"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
encoding@^0.1.11:
|
||||
version "0.1.13"
|
||||
resolved "https://registry.yarnpkg.com/encoding/-/encoding-0.1.13.tgz#56574afdd791f54a8e9b2785c0582a2d26210fa9"
|
||||
integrity sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==
|
||||
dependencies:
|
||||
iconv-lite "^0.6.2"
|
||||
|
||||
fbjs@^0.8.9:
|
||||
version "0.8.17"
|
||||
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
|
||||
integrity sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=
|
||||
dependencies:
|
||||
core-js "^1.0.0"
|
||||
isomorphic-fetch "^2.1.1"
|
||||
loose-envify "^1.0.0"
|
||||
object-assign "^4.1.0"
|
||||
promise "^7.1.1"
|
||||
setimmediate "^1.0.5"
|
||||
ua-parser-js "^0.7.18"
|
||||
|
||||
iconv-lite@^0.6.2:
|
||||
version "0.6.2"
|
||||
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.2.tgz#ce13d1875b0c3a674bd6a04b7f76b01b1b6ded01"
|
||||
integrity sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ==
|
||||
dependencies:
|
||||
safer-buffer ">= 2.1.2 < 3.0.0"
|
||||
|
||||
is-stream@^1.0.1:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
|
||||
integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ=
|
||||
|
||||
isomorphic-fetch@^2.1.1:
|
||||
version "2.2.1"
|
||||
resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9"
|
||||
integrity sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=
|
||||
dependencies:
|
||||
node-fetch "^1.0.1"
|
||||
whatwg-fetch ">=0.10.0"
|
||||
|
||||
"js-tokens@^3.0.0 || ^4.0.0":
|
||||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
|
||||
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
|
||||
|
||||
loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1, loose-envify@^1.4.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
|
||||
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
|
||||
dependencies:
|
||||
js-tokens "^3.0.0 || ^4.0.0"
|
||||
|
||||
node-fetch@^1.0.1:
|
||||
version "1.7.3"
|
||||
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef"
|
||||
integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==
|
||||
dependencies:
|
||||
encoding "^0.1.11"
|
||||
is-stream "^1.0.1"
|
||||
|
||||
object-assign@^4.1.0, object-assign@^4.1.1:
|
||||
version "4.1.1"
|
||||
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
|
||||
integrity sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=
|
||||
|
||||
promise@^7.1.1:
|
||||
version "7.3.1"
|
||||
resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
|
||||
integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
|
||||
dependencies:
|
||||
asap "~2.0.3"
|
||||
|
||||
prop-types@^15.5.10:
|
||||
version "15.7.2"
|
||||
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
|
||||
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
|
||||
dependencies:
|
||||
loose-envify "^1.4.0"
|
||||
object-assign "^4.1.1"
|
||||
react-is "^16.8.1"
|
||||
|
||||
react-dom@15:
|
||||
version "15.6.2"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.6.2.tgz#41cfadf693b757faf2708443a1d1fd5a02bef730"
|
||||
integrity sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA=
|
||||
dependencies:
|
||||
fbjs "^0.8.9"
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.0"
|
||||
prop-types "^15.5.10"
|
||||
|
||||
react-is@^16.8.1:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
|
||||
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
|
||||
|
||||
react@15:
|
||||
version "15.6.2"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-15.6.2.tgz#dba0434ab439cfe82f108f0f511663908179aa72"
|
||||
integrity sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=
|
||||
dependencies:
|
||||
create-react-class "^15.6.0"
|
||||
fbjs "^0.8.9"
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.0"
|
||||
prop-types "^15.5.10"
|
||||
|
||||
"safer-buffer@>= 2.1.2 < 3.0.0":
|
||||
version "2.1.2"
|
||||
resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
|
||||
integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
|
||||
|
||||
setimmediate@^1.0.5:
|
||||
version "1.0.5"
|
||||
resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285"
|
||||
integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=
|
||||
|
||||
ua-parser-js@^0.7.18:
|
||||
version "0.7.22"
|
||||
resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.22.tgz#960df60a5f911ea8f1c818f3747b99c6e177eae3"
|
||||
integrity sha512-YUxzMjJ5T71w6a8WWVcMGM6YWOTX27rCoIQgLXiWaxqXSx9D7DNjiGWn1aJIRSQ5qr0xuhra77bSIh6voR/46Q==
|
||||
|
||||
whatwg-fetch@>=0.10.0:
|
||||
version "3.4.1"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.4.1.tgz#e5f871572d6879663fa5674c8f833f15a8425ab3"
|
||||
integrity sha512-sofZVzE1wKwO+EYPbWfiwzaKovWiZXf4coEzjGP9b2GBVgQRLQUZ2QcuPpQExGDAW5GItpEm6Tl4OU5mywnAoQ==
|
||||
@@ -0,0 +1,889 @@
|
||||
/** @license React v16.14.0
|
||||
* react-jsx-dev-runtime.development.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var React = require('react');
|
||||
|
||||
// ATTENTION
|
||||
// When adding new symbols to this file,
|
||||
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
||||
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
||||
// nor polyfill, then a plain number is used for performance.
|
||||
var REACT_ELEMENT_TYPE = 0xeac7;
|
||||
var REACT_PORTAL_TYPE = 0xeaca;
|
||||
exports.Fragment = 0xeacb;
|
||||
var REACT_STRICT_MODE_TYPE = 0xeacc;
|
||||
var REACT_PROFILER_TYPE = 0xead2;
|
||||
var REACT_PROVIDER_TYPE = 0xeacd;
|
||||
var REACT_CONTEXT_TYPE = 0xeace;
|
||||
var REACT_FORWARD_REF_TYPE = 0xead0;
|
||||
var REACT_SUSPENSE_TYPE = 0xead1;
|
||||
var REACT_SUSPENSE_LIST_TYPE = 0xead8;
|
||||
var REACT_MEMO_TYPE = 0xead3;
|
||||
var REACT_LAZY_TYPE = 0xead4;
|
||||
var REACT_BLOCK_TYPE = 0xead9;
|
||||
var REACT_SERVER_BLOCK_TYPE = 0xeada;
|
||||
var REACT_FUNDAMENTAL_TYPE = 0xead5;
|
||||
var REACT_SCOPE_TYPE = 0xead7;
|
||||
var REACT_OPAQUE_ID_TYPE = 0xeae0;
|
||||
var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
|
||||
var REACT_OFFSCREEN_TYPE = 0xeae2;
|
||||
var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
|
||||
|
||||
if (typeof Symbol === 'function' && Symbol.for) {
|
||||
var symbolFor = Symbol.for;
|
||||
REACT_ELEMENT_TYPE = symbolFor('react.element');
|
||||
REACT_PORTAL_TYPE = symbolFor('react.portal');
|
||||
exports.Fragment = symbolFor('react.fragment');
|
||||
REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
|
||||
REACT_PROFILER_TYPE = symbolFor('react.profiler');
|
||||
REACT_PROVIDER_TYPE = symbolFor('react.provider');
|
||||
REACT_CONTEXT_TYPE = symbolFor('react.context');
|
||||
REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
|
||||
REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
|
||||
REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
|
||||
REACT_MEMO_TYPE = symbolFor('react.memo');
|
||||
REACT_LAZY_TYPE = symbolFor('react.lazy');
|
||||
REACT_BLOCK_TYPE = symbolFor('react.block');
|
||||
REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
|
||||
REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
|
||||
REACT_SCOPE_TYPE = symbolFor('react.scope');
|
||||
REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
|
||||
REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
|
||||
REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
|
||||
REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
|
||||
}
|
||||
|
||||
var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
|
||||
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
||||
function getIteratorFn(maybeIterable) {
|
||||
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
||||
return null;
|
||||
}
|
||||
|
||||
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
||||
|
||||
if (typeof maybeIterator === 'function') {
|
||||
return maybeIterator;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
||||
|
||||
function error(format) {
|
||||
{
|
||||
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
printWarning('error', format, args);
|
||||
}
|
||||
}
|
||||
|
||||
function printWarning(level, format, args) {
|
||||
// When changing this logic, you might want to also
|
||||
// update consoleWithStackDev.www.js as well.
|
||||
{
|
||||
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
||||
var stack = '';
|
||||
|
||||
if (currentlyValidatingElement) {
|
||||
var name = getComponentName(currentlyValidatingElement.type);
|
||||
var owner = currentlyValidatingElement._owner;
|
||||
stack += describeComponentFrame(name, currentlyValidatingElement._source, owner && getComponentName(owner.type));
|
||||
}
|
||||
|
||||
stack += ReactDebugCurrentFrame.getStackAddendum();
|
||||
|
||||
|
||||
if (stack !== '') {
|
||||
format += '%s';
|
||||
args = args.concat([stack]);
|
||||
}
|
||||
|
||||
var argsWithFormat = args.map(function (item) {
|
||||
return '' + item;
|
||||
}); // Careful: RN currently depends on this prefix
|
||||
|
||||
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
||||
// breaks IE9: https://github.com/facebook/react/issues/13610
|
||||
// eslint-disable-next-line react-internal/no-production-logging
|
||||
|
||||
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
||||
}
|
||||
}
|
||||
|
||||
// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
|
||||
|
||||
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
||||
|
||||
function isValidElementType(type) {
|
||||
if (typeof type === 'string' || typeof type === 'function') {
|
||||
return true;
|
||||
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
||||
|
||||
|
||||
if (type === exports.Fragment || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (typeof type === 'object' && type !== null) {
|
||||
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
|
||||
function describeComponentFrame (name, source, ownerName) {
|
||||
var sourceInfo = '';
|
||||
|
||||
if (source) {
|
||||
var path = source.fileName;
|
||||
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
||||
|
||||
{
|
||||
// In DEV, include code for a common special case:
|
||||
// prefer "folder/index.js" instead of just "index.js".
|
||||
if (/^index\./.test(fileName)) {
|
||||
var match = path.match(BEFORE_SLASH_RE);
|
||||
|
||||
if (match) {
|
||||
var pathBeforeSlash = match[1];
|
||||
|
||||
if (pathBeforeSlash) {
|
||||
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
||||
fileName = folderName + '/' + fileName;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
||||
} else if (ownerName) {
|
||||
sourceInfo = ' (created by ' + ownerName + ')';
|
||||
}
|
||||
|
||||
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
||||
}
|
||||
|
||||
var Resolved = 1;
|
||||
function refineResolvedLazyComponent(lazyComponent) {
|
||||
return lazyComponent._status === Resolved ? lazyComponent._result : null;
|
||||
}
|
||||
|
||||
function getWrappedName(outerType, innerType, wrapperName) {
|
||||
var functionName = innerType.displayName || innerType.name || '';
|
||||
return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
|
||||
}
|
||||
|
||||
function getComponentName(type) {
|
||||
if (type == null) {
|
||||
// Host root, text node or just invalid type.
|
||||
return null;
|
||||
}
|
||||
|
||||
{
|
||||
if (typeof type.tag === 'number') {
|
||||
error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof type === 'function') {
|
||||
return type.displayName || type.name || null;
|
||||
}
|
||||
|
||||
if (typeof type === 'string') {
|
||||
return type;
|
||||
}
|
||||
|
||||
switch (type) {
|
||||
case exports.Fragment:
|
||||
return 'Fragment';
|
||||
|
||||
case REACT_PORTAL_TYPE:
|
||||
return 'Portal';
|
||||
|
||||
case REACT_PROFILER_TYPE:
|
||||
return "Profiler";
|
||||
|
||||
case REACT_STRICT_MODE_TYPE:
|
||||
return 'StrictMode';
|
||||
|
||||
case REACT_SUSPENSE_TYPE:
|
||||
return 'Suspense';
|
||||
|
||||
case REACT_SUSPENSE_LIST_TYPE:
|
||||
return 'SuspenseList';
|
||||
}
|
||||
|
||||
if (typeof type === 'object') {
|
||||
switch (type.$$typeof) {
|
||||
case REACT_CONTEXT_TYPE:
|
||||
return 'Context.Consumer';
|
||||
|
||||
case REACT_PROVIDER_TYPE:
|
||||
return 'Context.Provider';
|
||||
|
||||
case REACT_FORWARD_REF_TYPE:
|
||||
return getWrappedName(type, type.render, 'ForwardRef');
|
||||
|
||||
case REACT_MEMO_TYPE:
|
||||
return getComponentName(type.type);
|
||||
|
||||
case REACT_BLOCK_TYPE:
|
||||
return getComponentName(type.render);
|
||||
|
||||
case REACT_LAZY_TYPE:
|
||||
{
|
||||
var thenable = type;
|
||||
var resolvedThenable = refineResolvedLazyComponent(thenable);
|
||||
|
||||
if (resolvedThenable) {
|
||||
return getComponentName(resolvedThenable);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
var loggedTypeFailures = {};
|
||||
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
||||
var currentlyValidatingElement = null;
|
||||
|
||||
function setCurrentlyValidatingElement(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
||||
{
|
||||
// $FlowFixMe This is okay but Flow doesn't know it.
|
||||
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
||||
|
||||
for (var typeSpecName in typeSpecs) {
|
||||
if (has(typeSpecs, typeSpecName)) {
|
||||
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
||||
// fail the render phase where it didn't fail before. So we log it.
|
||||
// After these have been cleaned up, we'll let them throw.
|
||||
|
||||
try {
|
||||
// This is intentionally an invariant that gets caught. It's the same
|
||||
// behavior as without this statement except with a better message.
|
||||
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
||||
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
||||
err.name = 'Invariant Violation';
|
||||
throw err;
|
||||
}
|
||||
|
||||
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
||||
} catch (ex) {
|
||||
error$1 = ex;
|
||||
}
|
||||
|
||||
if (error$1 && !(error$1 instanceof Error)) {
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
|
||||
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
||||
// Only monitor this failure once because there tends to be a lot of the
|
||||
// same error.
|
||||
loggedTypeFailures[error$1.message] = true;
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('Failed %s type: %s', location, error$1.message);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
|
||||
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
||||
var RESERVED_PROPS = {
|
||||
key: true,
|
||||
ref: true,
|
||||
__self: true,
|
||||
__source: true
|
||||
};
|
||||
var specialPropKeyWarningShown;
|
||||
var specialPropRefWarningShown;
|
||||
var didWarnAboutStringRefs;
|
||||
|
||||
{
|
||||
didWarnAboutStringRefs = {};
|
||||
}
|
||||
|
||||
function hasValidRef(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'ref')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.ref !== undefined;
|
||||
}
|
||||
|
||||
function hasValidKey(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'key')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.key !== undefined;
|
||||
}
|
||||
|
||||
function warnIfStringRefCannotBeAutoConverted(config, self) {
|
||||
{
|
||||
if (typeof config.ref === 'string' && ReactCurrentOwner.current && self && ReactCurrentOwner.current.stateNode !== self) {
|
||||
var componentName = getComponentName(ReactCurrentOwner.current.type);
|
||||
|
||||
if (!didWarnAboutStringRefs[componentName]) {
|
||||
error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', getComponentName(ReactCurrentOwner.current.type), config.ref);
|
||||
|
||||
didWarnAboutStringRefs[componentName] = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function defineKeyPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingKey = function () {
|
||||
if (!specialPropKeyWarningShown) {
|
||||
specialPropKeyWarningShown = true;
|
||||
|
||||
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingKey.isReactWarning = true;
|
||||
Object.defineProperty(props, 'key', {
|
||||
get: warnAboutAccessingKey,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function defineRefPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingRef = function () {
|
||||
if (!specialPropRefWarningShown) {
|
||||
specialPropRefWarningShown = true;
|
||||
|
||||
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingRef.isReactWarning = true;
|
||||
Object.defineProperty(props, 'ref', {
|
||||
get: warnAboutAccessingRef,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Factory method to create a new React element. This no longer adheres to
|
||||
* the class pattern, so do not use new to call it. Also, instanceof check
|
||||
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
||||
* if something is a React Element.
|
||||
*
|
||||
* @param {*} type
|
||||
* @param {*} props
|
||||
* @param {*} key
|
||||
* @param {string|object} ref
|
||||
* @param {*} owner
|
||||
* @param {*} self A *temporary* helper to detect places where `this` is
|
||||
* different from the `owner` when React.createElement is called, so that we
|
||||
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
||||
* functions, and as long as `this` and owner are the same, there will be no
|
||||
* change in behavior.
|
||||
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
||||
* indicating filename, line number, and/or other information.
|
||||
* @internal
|
||||
*/
|
||||
|
||||
|
||||
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
||||
var element = {
|
||||
// This tag allows us to uniquely identify this as a React Element
|
||||
$$typeof: REACT_ELEMENT_TYPE,
|
||||
// Built-in properties that belong on the element
|
||||
type: type,
|
||||
key: key,
|
||||
ref: ref,
|
||||
props: props,
|
||||
// Record the component responsible for creating this element.
|
||||
_owner: owner
|
||||
};
|
||||
|
||||
{
|
||||
// The validation flag is currently mutative. We put it on
|
||||
// an external backing store so that we can freeze the whole object.
|
||||
// This can be replaced with a WeakMap once they are implemented in
|
||||
// commonly used development environments.
|
||||
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
||||
// the validation flag non-enumerable (where possible, which should
|
||||
// include every environment we run tests in), so the test framework
|
||||
// ignores it.
|
||||
|
||||
Object.defineProperty(element._store, 'validated', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
value: false
|
||||
}); // self and source are DEV only properties.
|
||||
|
||||
Object.defineProperty(element, '_self', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: self
|
||||
}); // Two elements created in two different places should be considered
|
||||
// equal for testing purposes and therefore we hide it from enumeration.
|
||||
|
||||
Object.defineProperty(element, '_source', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: source
|
||||
});
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(element.props);
|
||||
Object.freeze(element);
|
||||
}
|
||||
}
|
||||
|
||||
return element;
|
||||
};
|
||||
/**
|
||||
* https://github.com/reactjs/rfcs/pull/107
|
||||
* @param {*} type
|
||||
* @param {object} props
|
||||
* @param {string} key
|
||||
*/
|
||||
|
||||
function jsxDEV(type, config, maybeKey, source, self) {
|
||||
{
|
||||
var propName; // Reserved names are extracted
|
||||
|
||||
var props = {};
|
||||
var key = null;
|
||||
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
||||
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
||||
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
||||
// but as an intermediary step, we will use jsxDEV for everything except
|
||||
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
||||
// key is explicitly declared to be undefined or not.
|
||||
|
||||
if (maybeKey !== undefined) {
|
||||
key = '' + maybeKey;
|
||||
}
|
||||
|
||||
if (hasValidKey(config)) {
|
||||
key = '' + config.key;
|
||||
}
|
||||
|
||||
if (hasValidRef(config)) {
|
||||
ref = config.ref;
|
||||
warnIfStringRefCannotBeAutoConverted(config, self);
|
||||
} // Remaining properties are added to a new props object
|
||||
|
||||
|
||||
for (propName in config) {
|
||||
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
||||
props[propName] = config[propName];
|
||||
}
|
||||
} // Resolve default props
|
||||
|
||||
|
||||
if (type && type.defaultProps) {
|
||||
var defaultProps = type.defaultProps;
|
||||
|
||||
for (propName in defaultProps) {
|
||||
if (props[propName] === undefined) {
|
||||
props[propName] = defaultProps[propName];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (key || ref) {
|
||||
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
||||
|
||||
if (key) {
|
||||
defineKeyPropWarningGetter(props, displayName);
|
||||
}
|
||||
|
||||
if (ref) {
|
||||
defineRefPropWarningGetter(props, displayName);
|
||||
}
|
||||
}
|
||||
|
||||
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
|
||||
var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
|
||||
|
||||
function setCurrentlyValidatingElement$1(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
var propTypesMisspellWarningShown;
|
||||
|
||||
{
|
||||
propTypesMisspellWarningShown = false;
|
||||
}
|
||||
/**
|
||||
* Verifies the object is a ReactElement.
|
||||
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
||||
* @param {?object} object
|
||||
* @return {boolean} True if `object` is a ReactElement.
|
||||
* @final
|
||||
*/
|
||||
|
||||
function isValidElement(object) {
|
||||
{
|
||||
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
||||
}
|
||||
}
|
||||
|
||||
function getDeclarationErrorAddendum() {
|
||||
{
|
||||
if (ReactCurrentOwner$1.current) {
|
||||
var name = getComponentName(ReactCurrentOwner$1.current.type);
|
||||
|
||||
if (name) {
|
||||
return '\n\nCheck the render method of `' + name + '`.';
|
||||
}
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function getSourceInfoErrorAddendum(source) {
|
||||
{
|
||||
if (source !== undefined) {
|
||||
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
||||
var lineNumber = source.lineNumber;
|
||||
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if there's no key explicitly set on dynamic arrays of children or
|
||||
* object keys are not valid. This allows us to keep track of children between
|
||||
* updates.
|
||||
*/
|
||||
|
||||
|
||||
var ownerHasKeyUseWarning = {};
|
||||
|
||||
function getCurrentComponentErrorInfo(parentType) {
|
||||
{
|
||||
var info = getDeclarationErrorAddendum();
|
||||
|
||||
if (!info) {
|
||||
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
||||
|
||||
if (parentName) {
|
||||
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
||||
}
|
||||
}
|
||||
|
||||
return info;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if the element doesn't have an explicit key assigned to it.
|
||||
* This element is in an array. The array could grow and shrink or be
|
||||
* reordered. All children that haven't already been validated are required to
|
||||
* have a "key" property assigned to it. Error statuses are cached so a warning
|
||||
* will only be shown once.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactElement} element Element that requires a key.
|
||||
* @param {*} parentType element's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateExplicitKey(element, parentType) {
|
||||
{
|
||||
if (!element._store || element._store.validated || element.key != null) {
|
||||
return;
|
||||
}
|
||||
|
||||
element._store.validated = true;
|
||||
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
||||
|
||||
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
||||
return;
|
||||
}
|
||||
|
||||
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
||||
// property, it may be the creator of the child that's responsible for
|
||||
// assigning it a key.
|
||||
|
||||
var childOwner = '';
|
||||
|
||||
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
||||
// Give the component that originally created this child.
|
||||
childOwner = " It was passed a child from " + getComponentName(element._owner.type) + ".";
|
||||
}
|
||||
|
||||
setCurrentlyValidatingElement$1(element);
|
||||
|
||||
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Ensure that every element either is passed in a static location, in an
|
||||
* array with an explicit keys property defined, or in an object literal
|
||||
* with valid key property.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactNode} node Statically passed child of any type.
|
||||
* @param {*} parentType node's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateChildKeys(node, parentType) {
|
||||
{
|
||||
if (typeof node !== 'object') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (Array.isArray(node)) {
|
||||
for (var i = 0; i < node.length; i++) {
|
||||
var child = node[i];
|
||||
|
||||
if (isValidElement(child)) {
|
||||
validateExplicitKey(child, parentType);
|
||||
}
|
||||
}
|
||||
} else if (isValidElement(node)) {
|
||||
// This element was passed in a valid location.
|
||||
if (node._store) {
|
||||
node._store.validated = true;
|
||||
}
|
||||
} else if (node) {
|
||||
var iteratorFn = getIteratorFn(node);
|
||||
|
||||
if (typeof iteratorFn === 'function') {
|
||||
// Entry iterators used to provide implicit keys,
|
||||
// but now we print a separate warning for them later.
|
||||
if (iteratorFn !== node.entries) {
|
||||
var iterator = iteratorFn.call(node);
|
||||
var step;
|
||||
|
||||
while (!(step = iterator.next()).done) {
|
||||
if (isValidElement(step.value)) {
|
||||
validateExplicitKey(step.value, parentType);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given an element, validate that its props follow the propTypes definition,
|
||||
* provided by the type.
|
||||
*
|
||||
* @param {ReactElement} element
|
||||
*/
|
||||
|
||||
|
||||
function validatePropTypes(element) {
|
||||
{
|
||||
var type = element.type;
|
||||
|
||||
if (type === null || type === undefined || typeof type === 'string') {
|
||||
return;
|
||||
}
|
||||
|
||||
var propTypes;
|
||||
|
||||
if (typeof type === 'function') {
|
||||
propTypes = type.propTypes;
|
||||
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
||||
// Inner props are checked in the reconciler.
|
||||
type.$$typeof === REACT_MEMO_TYPE)) {
|
||||
propTypes = type.propTypes;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
if (propTypes) {
|
||||
// Intentionally inside to avoid triggering lazy initializers:
|
||||
var name = getComponentName(type);
|
||||
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
||||
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
||||
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
||||
|
||||
var _name = getComponentName(type);
|
||||
|
||||
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
||||
}
|
||||
|
||||
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
||||
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given a fragment, validate that it can only be provided with fragment props
|
||||
* @param {ReactElement} fragment
|
||||
*/
|
||||
|
||||
|
||||
function validateFragmentProps(fragment) {
|
||||
{
|
||||
var keys = Object.keys(fragment.props);
|
||||
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
|
||||
if (key !== 'children' && key !== 'key') {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (fragment.ref !== null) {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
||||
{
|
||||
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
||||
// succeed and there will likely be errors in render.
|
||||
|
||||
if (!validType) {
|
||||
var info = '';
|
||||
|
||||
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
||||
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
||||
}
|
||||
|
||||
var sourceInfo = getSourceInfoErrorAddendum(source);
|
||||
|
||||
if (sourceInfo) {
|
||||
info += sourceInfo;
|
||||
} else {
|
||||
info += getDeclarationErrorAddendum();
|
||||
}
|
||||
|
||||
var typeString;
|
||||
|
||||
if (type === null) {
|
||||
typeString = 'null';
|
||||
} else if (Array.isArray(type)) {
|
||||
typeString = 'array';
|
||||
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
||||
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
||||
info = ' Did you accidentally export a JSX literal instead of a component?';
|
||||
} else {
|
||||
typeString = typeof type;
|
||||
}
|
||||
|
||||
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
||||
}
|
||||
|
||||
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
||||
// TODO: Drop this when these are no longer allowed as the type argument.
|
||||
|
||||
if (element == null) {
|
||||
return element;
|
||||
} // Skip key warning if the type isn't valid since our key validation logic
|
||||
// doesn't expect a non-string/function type and can throw confusing errors.
|
||||
// We don't want exception behavior to differ between dev and prod.
|
||||
// (Rendering will throw with a helpful message and as soon as the type is
|
||||
// fixed, the key warnings will appear.)
|
||||
|
||||
|
||||
if (validType) {
|
||||
var children = props.children;
|
||||
|
||||
if (children !== undefined) {
|
||||
if (isStaticChildren) {
|
||||
if (Array.isArray(children)) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
validateChildKeys(children[i], type);
|
||||
}
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(children);
|
||||
}
|
||||
} else {
|
||||
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
||||
}
|
||||
} else {
|
||||
validateChildKeys(children, type);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (type === exports.Fragment) {
|
||||
validateFragmentProps(element);
|
||||
} else {
|
||||
validatePropTypes(element);
|
||||
}
|
||||
|
||||
return element;
|
||||
}
|
||||
} // These two functions exist to still get child warnings in dev
|
||||
|
||||
var jsxDEV$1 = jsxWithValidation ;
|
||||
|
||||
exports.jsxDEV = jsxDEV$1;
|
||||
})();
|
||||
}
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
/** @license React v16.14.0
|
||||
* react-jsx-dev-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';require("react");exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var a=Symbol.for;exports.Fragment=a("react.fragment")}exports.jsxDEV=void 0;
|
||||
@@ -0,0 +1,911 @@
|
||||
/** @license React v16.14.0
|
||||
* react-jsx-runtime.development.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var React = require('react');
|
||||
|
||||
// ATTENTION
|
||||
// When adding new symbols to this file,
|
||||
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
||||
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
||||
// nor polyfill, then a plain number is used for performance.
|
||||
var REACT_ELEMENT_TYPE = 0xeac7;
|
||||
var REACT_PORTAL_TYPE = 0xeaca;
|
||||
exports.Fragment = 0xeacb;
|
||||
var REACT_STRICT_MODE_TYPE = 0xeacc;
|
||||
var REACT_PROFILER_TYPE = 0xead2;
|
||||
var REACT_PROVIDER_TYPE = 0xeacd;
|
||||
var REACT_CONTEXT_TYPE = 0xeace;
|
||||
var REACT_FORWARD_REF_TYPE = 0xead0;
|
||||
var REACT_SUSPENSE_TYPE = 0xead1;
|
||||
var REACT_SUSPENSE_LIST_TYPE = 0xead8;
|
||||
var REACT_MEMO_TYPE = 0xead3;
|
||||
var REACT_LAZY_TYPE = 0xead4;
|
||||
var REACT_BLOCK_TYPE = 0xead9;
|
||||
var REACT_SERVER_BLOCK_TYPE = 0xeada;
|
||||
var REACT_FUNDAMENTAL_TYPE = 0xead5;
|
||||
var REACT_SCOPE_TYPE = 0xead7;
|
||||
var REACT_OPAQUE_ID_TYPE = 0xeae0;
|
||||
var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
|
||||
var REACT_OFFSCREEN_TYPE = 0xeae2;
|
||||
var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
|
||||
|
||||
if (typeof Symbol === 'function' && Symbol.for) {
|
||||
var symbolFor = Symbol.for;
|
||||
REACT_ELEMENT_TYPE = symbolFor('react.element');
|
||||
REACT_PORTAL_TYPE = symbolFor('react.portal');
|
||||
exports.Fragment = symbolFor('react.fragment');
|
||||
REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
|
||||
REACT_PROFILER_TYPE = symbolFor('react.profiler');
|
||||
REACT_PROVIDER_TYPE = symbolFor('react.provider');
|
||||
REACT_CONTEXT_TYPE = symbolFor('react.context');
|
||||
REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
|
||||
REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
|
||||
REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
|
||||
REACT_MEMO_TYPE = symbolFor('react.memo');
|
||||
REACT_LAZY_TYPE = symbolFor('react.lazy');
|
||||
REACT_BLOCK_TYPE = symbolFor('react.block');
|
||||
REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
|
||||
REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
|
||||
REACT_SCOPE_TYPE = symbolFor('react.scope');
|
||||
REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
|
||||
REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
|
||||
REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
|
||||
REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
|
||||
}
|
||||
|
||||
var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
|
||||
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
||||
function getIteratorFn(maybeIterable) {
|
||||
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
||||
return null;
|
||||
}
|
||||
|
||||
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
||||
|
||||
if (typeof maybeIterator === 'function') {
|
||||
return maybeIterator;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
||||
|
||||
function error(format) {
|
||||
{
|
||||
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
printWarning('error', format, args);
|
||||
}
|
||||
}
|
||||
|
||||
function printWarning(level, format, args) {
|
||||
// When changing this logic, you might want to also
|
||||
// update consoleWithStackDev.www.js as well.
|
||||
{
|
||||
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
||||
var stack = '';
|
||||
|
||||
if (currentlyValidatingElement) {
|
||||
var name = getComponentName(currentlyValidatingElement.type);
|
||||
var owner = currentlyValidatingElement._owner;
|
||||
stack += describeComponentFrame(name, currentlyValidatingElement._source, owner && getComponentName(owner.type));
|
||||
}
|
||||
|
||||
stack += ReactDebugCurrentFrame.getStackAddendum();
|
||||
|
||||
if (stack !== '') {
|
||||
format += '%s';
|
||||
args = args.concat([stack]);
|
||||
}
|
||||
|
||||
var argsWithFormat = args.map(function (item) {
|
||||
return '' + item;
|
||||
}); // Careful: RN currently depends on this prefix
|
||||
|
||||
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
||||
// breaks IE9: https://github.com/facebook/react/issues/13610
|
||||
// eslint-disable-next-line react-internal/no-production-logging
|
||||
|
||||
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
||||
}
|
||||
}
|
||||
|
||||
// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
|
||||
|
||||
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
||||
|
||||
function isValidElementType(type) {
|
||||
if (typeof type === 'string' || typeof type === 'function') {
|
||||
return true;
|
||||
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
||||
|
||||
|
||||
if (type === exports.Fragment || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (typeof type === 'object' && type !== null) {
|
||||
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
|
||||
function describeComponentFrame (name, source, ownerName) {
|
||||
var sourceInfo = '';
|
||||
|
||||
if (source) {
|
||||
var path = source.fileName;
|
||||
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
||||
|
||||
{
|
||||
// In DEV, include code for a common special case:
|
||||
// prefer "folder/index.js" instead of just "index.js".
|
||||
if (/^index\./.test(fileName)) {
|
||||
var match = path.match(BEFORE_SLASH_RE);
|
||||
|
||||
if (match) {
|
||||
var pathBeforeSlash = match[1];
|
||||
|
||||
if (pathBeforeSlash) {
|
||||
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
||||
fileName = folderName + '/' + fileName;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
||||
} else if (ownerName) {
|
||||
sourceInfo = ' (created by ' + ownerName + ')';
|
||||
}
|
||||
|
||||
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
||||
}
|
||||
|
||||
var Resolved = 1;
|
||||
function refineResolvedLazyComponent(lazyComponent) {
|
||||
return lazyComponent._status === Resolved ? lazyComponent._result : null;
|
||||
}
|
||||
|
||||
function getWrappedName(outerType, innerType, wrapperName) {
|
||||
var functionName = innerType.displayName || innerType.name || '';
|
||||
return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
|
||||
}
|
||||
|
||||
function getComponentName(type) {
|
||||
if (type == null) {
|
||||
// Host root, text node or just invalid type.
|
||||
return null;
|
||||
}
|
||||
|
||||
{
|
||||
if (typeof type.tag === 'number') {
|
||||
error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof type === 'function') {
|
||||
return type.displayName || type.name || null;
|
||||
}
|
||||
|
||||
if (typeof type === 'string') {
|
||||
return type;
|
||||
}
|
||||
|
||||
switch (type) {
|
||||
case exports.Fragment:
|
||||
return 'Fragment';
|
||||
|
||||
case REACT_PORTAL_TYPE:
|
||||
return 'Portal';
|
||||
|
||||
case REACT_PROFILER_TYPE:
|
||||
return "Profiler";
|
||||
|
||||
case REACT_STRICT_MODE_TYPE:
|
||||
return 'StrictMode';
|
||||
|
||||
case REACT_SUSPENSE_TYPE:
|
||||
return 'Suspense';
|
||||
|
||||
case REACT_SUSPENSE_LIST_TYPE:
|
||||
return 'SuspenseList';
|
||||
}
|
||||
|
||||
if (typeof type === 'object') {
|
||||
switch (type.$$typeof) {
|
||||
case REACT_CONTEXT_TYPE:
|
||||
return 'Context.Consumer';
|
||||
|
||||
case REACT_PROVIDER_TYPE:
|
||||
return 'Context.Provider';
|
||||
|
||||
case REACT_FORWARD_REF_TYPE:
|
||||
return getWrappedName(type, type.render, 'ForwardRef');
|
||||
|
||||
case REACT_MEMO_TYPE:
|
||||
return getComponentName(type.type);
|
||||
|
||||
case REACT_BLOCK_TYPE:
|
||||
return getComponentName(type.render);
|
||||
|
||||
case REACT_LAZY_TYPE:
|
||||
{
|
||||
var thenable = type;
|
||||
var resolvedThenable = refineResolvedLazyComponent(thenable);
|
||||
|
||||
if (resolvedThenable) {
|
||||
return getComponentName(resolvedThenable);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
var loggedTypeFailures = {};
|
||||
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
||||
var currentlyValidatingElement = null;
|
||||
|
||||
function setCurrentlyValidatingElement(element) {
|
||||
{
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
}
|
||||
|
||||
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
||||
{
|
||||
// $FlowFixMe This is okay but Flow doesn't know it.
|
||||
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
||||
|
||||
for (var typeSpecName in typeSpecs) {
|
||||
if (has(typeSpecs, typeSpecName)) {
|
||||
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
||||
// fail the render phase where it didn't fail before. So we log it.
|
||||
// After these have been cleaned up, we'll let them throw.
|
||||
|
||||
try {
|
||||
// This is intentionally an invariant that gets caught. It's the same
|
||||
// behavior as without this statement except with a better message.
|
||||
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
||||
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
||||
err.name = 'Invariant Violation';
|
||||
throw err;
|
||||
}
|
||||
|
||||
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
||||
} catch (ex) {
|
||||
error$1 = ex;
|
||||
}
|
||||
|
||||
if (error$1 && !(error$1 instanceof Error)) {
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
|
||||
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
||||
// Only monitor this failure once because there tends to be a lot of the
|
||||
// same error.
|
||||
loggedTypeFailures[error$1.message] = true;
|
||||
setCurrentlyValidatingElement(element);
|
||||
|
||||
error('Failed %s type: %s', location, error$1.message);
|
||||
|
||||
setCurrentlyValidatingElement(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
|
||||
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
||||
var RESERVED_PROPS = {
|
||||
key: true,
|
||||
ref: true,
|
||||
__self: true,
|
||||
__source: true
|
||||
};
|
||||
var specialPropKeyWarningShown;
|
||||
var specialPropRefWarningShown;
|
||||
var didWarnAboutStringRefs;
|
||||
|
||||
{
|
||||
didWarnAboutStringRefs = {};
|
||||
}
|
||||
|
||||
function hasValidRef(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'ref')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.ref !== undefined;
|
||||
}
|
||||
|
||||
function hasValidKey(config) {
|
||||
{
|
||||
if (hasOwnProperty.call(config, 'key')) {
|
||||
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
||||
|
||||
if (getter && getter.isReactWarning) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return config.key !== undefined;
|
||||
}
|
||||
|
||||
function warnIfStringRefCannotBeAutoConverted(config, self) {
|
||||
{
|
||||
if (typeof config.ref === 'string' && ReactCurrentOwner.current && self && ReactCurrentOwner.current.stateNode !== self) {
|
||||
var componentName = getComponentName(ReactCurrentOwner.current.type);
|
||||
|
||||
if (!didWarnAboutStringRefs[componentName]) {
|
||||
error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', getComponentName(ReactCurrentOwner.current.type), config.ref);
|
||||
|
||||
didWarnAboutStringRefs[componentName] = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function defineKeyPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingKey = function () {
|
||||
if (!specialPropKeyWarningShown) {
|
||||
specialPropKeyWarningShown = true;
|
||||
|
||||
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingKey.isReactWarning = true;
|
||||
Object.defineProperty(props, 'key', {
|
||||
get: warnAboutAccessingKey,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function defineRefPropWarningGetter(props, displayName) {
|
||||
{
|
||||
var warnAboutAccessingRef = function () {
|
||||
if (!specialPropRefWarningShown) {
|
||||
specialPropRefWarningShown = true;
|
||||
|
||||
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
||||
}
|
||||
};
|
||||
|
||||
warnAboutAccessingRef.isReactWarning = true;
|
||||
Object.defineProperty(props, 'ref', {
|
||||
get: warnAboutAccessingRef,
|
||||
configurable: true
|
||||
});
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Factory method to create a new React element. This no longer adheres to
|
||||
* the class pattern, so do not use new to call it. Also, instanceof check
|
||||
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
||||
* if something is a React Element.
|
||||
*
|
||||
* @param {*} type
|
||||
* @param {*} props
|
||||
* @param {*} key
|
||||
* @param {string|object} ref
|
||||
* @param {*} owner
|
||||
* @param {*} self A *temporary* helper to detect places where `this` is
|
||||
* different from the `owner` when React.createElement is called, so that we
|
||||
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
||||
* functions, and as long as `this` and owner are the same, there will be no
|
||||
* change in behavior.
|
||||
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
||||
* indicating filename, line number, and/or other information.
|
||||
* @internal
|
||||
*/
|
||||
|
||||
|
||||
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
||||
var element = {
|
||||
// This tag allows us to uniquely identify this as a React Element
|
||||
$$typeof: REACT_ELEMENT_TYPE,
|
||||
// Built-in properties that belong on the element
|
||||
type: type,
|
||||
key: key,
|
||||
ref: ref,
|
||||
props: props,
|
||||
// Record the component responsible for creating this element.
|
||||
_owner: owner
|
||||
};
|
||||
|
||||
{
|
||||
// The validation flag is currently mutative. We put it on
|
||||
// an external backing store so that we can freeze the whole object.
|
||||
// This can be replaced with a WeakMap once they are implemented in
|
||||
// commonly used development environments.
|
||||
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
||||
// the validation flag non-enumerable (where possible, which should
|
||||
// include every environment we run tests in), so the test framework
|
||||
// ignores it.
|
||||
|
||||
Object.defineProperty(element._store, 'validated', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
value: false
|
||||
}); // self and source are DEV only properties.
|
||||
|
||||
Object.defineProperty(element, '_self', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: self
|
||||
}); // Two elements created in two different places should be considered
|
||||
// equal for testing purposes and therefore we hide it from enumeration.
|
||||
|
||||
Object.defineProperty(element, '_source', {
|
||||
configurable: false,
|
||||
enumerable: false,
|
||||
writable: false,
|
||||
value: source
|
||||
});
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(element.props);
|
||||
Object.freeze(element);
|
||||
}
|
||||
}
|
||||
|
||||
return element;
|
||||
};
|
||||
/**
|
||||
* https://github.com/reactjs/rfcs/pull/107
|
||||
* @param {*} type
|
||||
* @param {object} props
|
||||
* @param {string} key
|
||||
*/
|
||||
|
||||
function jsxDEV(type, config, maybeKey, source, self) {
|
||||
{
|
||||
var propName; // Reserved names are extracted
|
||||
|
||||
var props = {};
|
||||
var key = null;
|
||||
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
||||
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
||||
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
||||
// but as an intermediary step, we will use jsxDEV for everything except
|
||||
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
||||
// key is explicitly declared to be undefined or not.
|
||||
|
||||
if (maybeKey !== undefined) {
|
||||
key = '' + maybeKey;
|
||||
}
|
||||
|
||||
if (hasValidKey(config)) {
|
||||
key = '' + config.key;
|
||||
}
|
||||
|
||||
if (hasValidRef(config)) {
|
||||
ref = config.ref;
|
||||
warnIfStringRefCannotBeAutoConverted(config, self);
|
||||
} // Remaining properties are added to a new props object
|
||||
|
||||
|
||||
for (propName in config) {
|
||||
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
||||
props[propName] = config[propName];
|
||||
}
|
||||
} // Resolve default props
|
||||
|
||||
|
||||
if (type && type.defaultProps) {
|
||||
var defaultProps = type.defaultProps;
|
||||
|
||||
for (propName in defaultProps) {
|
||||
if (props[propName] === undefined) {
|
||||
props[propName] = defaultProps[propName];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (key || ref) {
|
||||
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
||||
|
||||
if (key) {
|
||||
defineKeyPropWarningGetter(props, displayName);
|
||||
}
|
||||
|
||||
if (ref) {
|
||||
defineRefPropWarningGetter(props, displayName);
|
||||
}
|
||||
}
|
||||
|
||||
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
||||
}
|
||||
}
|
||||
|
||||
var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
|
||||
var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
|
||||
|
||||
function setCurrentlyValidatingElement$1(element) {
|
||||
currentlyValidatingElement = element;
|
||||
}
|
||||
|
||||
var propTypesMisspellWarningShown;
|
||||
|
||||
{
|
||||
propTypesMisspellWarningShown = false;
|
||||
}
|
||||
/**
|
||||
* Verifies the object is a ReactElement.
|
||||
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
||||
* @param {?object} object
|
||||
* @return {boolean} True if `object` is a ReactElement.
|
||||
* @final
|
||||
*/
|
||||
|
||||
function isValidElement(object) {
|
||||
{
|
||||
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
||||
}
|
||||
}
|
||||
|
||||
function getDeclarationErrorAddendum() {
|
||||
{
|
||||
if (ReactCurrentOwner$1.current) {
|
||||
var name = getComponentName(ReactCurrentOwner$1.current.type);
|
||||
|
||||
if (name) {
|
||||
return '\n\nCheck the render method of `' + name + '`.';
|
||||
}
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function getSourceInfoErrorAddendum(source) {
|
||||
{
|
||||
if (source !== undefined) {
|
||||
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
||||
var lineNumber = source.lineNumber;
|
||||
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if there's no key explicitly set on dynamic arrays of children or
|
||||
* object keys are not valid. This allows us to keep track of children between
|
||||
* updates.
|
||||
*/
|
||||
|
||||
|
||||
var ownerHasKeyUseWarning = {};
|
||||
|
||||
function getCurrentComponentErrorInfo(parentType) {
|
||||
{
|
||||
var info = getDeclarationErrorAddendum();
|
||||
|
||||
if (!info) {
|
||||
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
||||
|
||||
if (parentName) {
|
||||
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
||||
}
|
||||
}
|
||||
|
||||
return info;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Warn if the element doesn't have an explicit key assigned to it.
|
||||
* This element is in an array. The array could grow and shrink or be
|
||||
* reordered. All children that haven't already been validated are required to
|
||||
* have a "key" property assigned to it. Error statuses are cached so a warning
|
||||
* will only be shown once.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactElement} element Element that requires a key.
|
||||
* @param {*} parentType element's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateExplicitKey(element, parentType) {
|
||||
{
|
||||
if (!element._store || element._store.validated || element.key != null) {
|
||||
return;
|
||||
}
|
||||
|
||||
element._store.validated = true;
|
||||
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
||||
|
||||
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
||||
return;
|
||||
}
|
||||
|
||||
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
||||
// property, it may be the creator of the child that's responsible for
|
||||
// assigning it a key.
|
||||
|
||||
var childOwner = '';
|
||||
|
||||
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
||||
// Give the component that originally created this child.
|
||||
childOwner = " It was passed a child from " + getComponentName(element._owner.type) + ".";
|
||||
}
|
||||
|
||||
setCurrentlyValidatingElement$1(element);
|
||||
|
||||
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Ensure that every element either is passed in a static location, in an
|
||||
* array with an explicit keys property defined, or in an object literal
|
||||
* with valid key property.
|
||||
*
|
||||
* @internal
|
||||
* @param {ReactNode} node Statically passed child of any type.
|
||||
* @param {*} parentType node's parent's type.
|
||||
*/
|
||||
|
||||
|
||||
function validateChildKeys(node, parentType) {
|
||||
{
|
||||
if (typeof node !== 'object') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (Array.isArray(node)) {
|
||||
for (var i = 0; i < node.length; i++) {
|
||||
var child = node[i];
|
||||
|
||||
if (isValidElement(child)) {
|
||||
validateExplicitKey(child, parentType);
|
||||
}
|
||||
}
|
||||
} else if (isValidElement(node)) {
|
||||
// This element was passed in a valid location.
|
||||
if (node._store) {
|
||||
node._store.validated = true;
|
||||
}
|
||||
} else if (node) {
|
||||
var iteratorFn = getIteratorFn(node);
|
||||
|
||||
if (typeof iteratorFn === 'function') {
|
||||
// Entry iterators used to provide implicit keys,
|
||||
// but now we print a separate warning for them later.
|
||||
if (iteratorFn !== node.entries) {
|
||||
var iterator = iteratorFn.call(node);
|
||||
var step;
|
||||
|
||||
while (!(step = iterator.next()).done) {
|
||||
if (isValidElement(step.value)) {
|
||||
validateExplicitKey(step.value, parentType);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given an element, validate that its props follow the propTypes definition,
|
||||
* provided by the type.
|
||||
*
|
||||
* @param {ReactElement} element
|
||||
*/
|
||||
|
||||
|
||||
function validatePropTypes(element) {
|
||||
{
|
||||
var type = element.type;
|
||||
|
||||
if (type === null || type === undefined || typeof type === 'string') {
|
||||
return;
|
||||
}
|
||||
|
||||
var propTypes;
|
||||
|
||||
if (typeof type === 'function') {
|
||||
propTypes = type.propTypes;
|
||||
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
||||
// Inner props are checked in the reconciler.
|
||||
type.$$typeof === REACT_MEMO_TYPE)) {
|
||||
propTypes = type.propTypes;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
if (propTypes) {
|
||||
// Intentionally inside to avoid triggering lazy initializers:
|
||||
var name = getComponentName(type);
|
||||
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
||||
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
||||
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
||||
|
||||
var _name = getComponentName(type);
|
||||
|
||||
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
||||
}
|
||||
|
||||
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
||||
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Given a fragment, validate that it can only be provided with fragment props
|
||||
* @param {ReactElement} fragment
|
||||
*/
|
||||
|
||||
|
||||
function validateFragmentProps(fragment) {
|
||||
{
|
||||
var keys = Object.keys(fragment.props);
|
||||
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
|
||||
if (key !== 'children' && key !== 'key') {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (fragment.ref !== null) {
|
||||
setCurrentlyValidatingElement$1(fragment);
|
||||
|
||||
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
||||
|
||||
setCurrentlyValidatingElement$1(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
||||
{
|
||||
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
||||
// succeed and there will likely be errors in render.
|
||||
|
||||
if (!validType) {
|
||||
var info = '';
|
||||
|
||||
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
||||
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
||||
}
|
||||
|
||||
var sourceInfo = getSourceInfoErrorAddendum(source);
|
||||
|
||||
if (sourceInfo) {
|
||||
info += sourceInfo;
|
||||
} else {
|
||||
info += getDeclarationErrorAddendum();
|
||||
}
|
||||
|
||||
var typeString;
|
||||
|
||||
if (type === null) {
|
||||
typeString = 'null';
|
||||
} else if (Array.isArray(type)) {
|
||||
typeString = 'array';
|
||||
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
||||
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
||||
info = ' Did you accidentally export a JSX literal instead of a component?';
|
||||
} else {
|
||||
typeString = typeof type;
|
||||
}
|
||||
|
||||
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
||||
}
|
||||
|
||||
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
||||
// TODO: Drop this when these are no longer allowed as the type argument.
|
||||
|
||||
if (element == null) {
|
||||
return element;
|
||||
} // Skip key warning if the type isn't valid since our key validation logic
|
||||
// doesn't expect a non-string/function type and can throw confusing errors.
|
||||
// We don't want exception behavior to differ between dev and prod.
|
||||
// (Rendering will throw with a helpful message and as soon as the type is
|
||||
// fixed, the key warnings will appear.)
|
||||
|
||||
|
||||
if (validType) {
|
||||
var children = props.children;
|
||||
|
||||
if (children !== undefined) {
|
||||
if (isStaticChildren) {
|
||||
if (Array.isArray(children)) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
validateChildKeys(children[i], type);
|
||||
}
|
||||
|
||||
if (Object.freeze) {
|
||||
Object.freeze(children);
|
||||
}
|
||||
} else {
|
||||
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
||||
}
|
||||
} else {
|
||||
validateChildKeys(children, type);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (type === exports.Fragment) {
|
||||
validateFragmentProps(element);
|
||||
} else {
|
||||
validatePropTypes(element);
|
||||
}
|
||||
|
||||
return element;
|
||||
}
|
||||
} // These two functions exist to still get child warnings in dev
|
||||
// even with the prod transform. This means that jsxDEV is purely
|
||||
// opt-in behavior for better messages but that we won't stop
|
||||
// giving you warnings if you use production apis.
|
||||
|
||||
function jsxWithValidationStatic(type, props, key) {
|
||||
{
|
||||
return jsxWithValidation(type, props, key, true);
|
||||
}
|
||||
}
|
||||
function jsxWithValidationDynamic(type, props, key) {
|
||||
{
|
||||
return jsxWithValidation(type, props, key, false);
|
||||
}
|
||||
}
|
||||
|
||||
var jsx = jsxWithValidationDynamic ; // we may want to special case jsxs internally to take advantage of static children.
|
||||
// for now we can ship identical prod functions
|
||||
|
||||
var jsxs = jsxWithValidationStatic ;
|
||||
|
||||
exports.jsx = jsx;
|
||||
exports.jsxs = jsxs;
|
||||
})();
|
||||
}
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
/** @license React v16.14.0
|
||||
* react-jsx-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';var f=require("react"),g=60103;exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var h=Symbol.for;g=h("react.element");exports.Fragment=h("react.fragment")}var m=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,n=Object.prototype.hasOwnProperty,p={key:!0,ref:!0,__self:!0,__source:!0};
|
||||
function q(c,a,k){var b,d={},e=null,l=null;void 0!==k&&(e=""+k);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(l=a.ref);for(b in a)n.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:g,type:c,key:e,ref:l,props:d,_owner:m.current}}exports.jsx=q;exports.jsxs=q;
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"prop-types": "^15.7.2",
|
||||
"react": "16",
|
||||
"react-dom": "16"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,773 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @emails react-core
|
||||
*/
|
||||
|
||||
// These tests are based on ReactJSXElement-test,
|
||||
// ReactJSXElementValidator-test, ReactComponent-test,
|
||||
// and ReactElementJSX-test.
|
||||
|
||||
jest.mock('react/jsx-runtime', () => require('./jsx-runtime'), {virtual: true});
|
||||
jest.mock('react/jsx-dev-runtime', () => require('./jsx-dev-runtime'), {
|
||||
virtual: true,
|
||||
});
|
||||
|
||||
let React = require('react');
|
||||
let ReactDOM = require('react-dom');
|
||||
let ReactTestUtils = {
|
||||
renderIntoDocument(el) {
|
||||
const container = document.createElement('div');
|
||||
return ReactDOM.render(el, container);
|
||||
},
|
||||
};
|
||||
let PropTypes = require('prop-types');
|
||||
let Component = class Component extends React.Component {
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
};
|
||||
let RequiredPropComponent = class extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
};
|
||||
RequiredPropComponent.displayName = 'RequiredPropComponent';
|
||||
RequiredPropComponent.propTypes = {prop: PropTypes.string.isRequired};
|
||||
|
||||
it('works', () => {
|
||||
const container = document.createElement('div');
|
||||
ReactDOM.render(<h1>hello</h1>, container);
|
||||
expect(container.textContent).toBe('hello');
|
||||
});
|
||||
|
||||
it('returns a complete element according to spec', () => {
|
||||
const element = <Component />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a lower-case to be passed as the string type', () => {
|
||||
const element = <div />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a string to be passed as the type', () => {
|
||||
const TagName = 'div';
|
||||
const element = <TagName />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('returns an immutable element', () => {
|
||||
const element = <Component />;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
expect(() => (element.type = 'div')).toThrow();
|
||||
} else {
|
||||
expect(() => (element.type = 'div')).not.toThrow();
|
||||
}
|
||||
});
|
||||
|
||||
it('does not reuse the object that is spread into props', () => {
|
||||
const config = {foo: 1};
|
||||
const element = <Component {...config} />;
|
||||
expect(element.props.foo).toBe(1);
|
||||
config.foo = 2;
|
||||
expect(element.props.foo).toBe(1);
|
||||
});
|
||||
|
||||
it('extracts key and ref from the rest of the props', () => {
|
||||
const element = <Component key="12" ref="34" foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe('34');
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('coerces the key to a string', () => {
|
||||
const element = <Component key={12} foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop', () => {
|
||||
const a = 1;
|
||||
const element = <Component children="text">{a}</Component>;
|
||||
expect(element.props.children).toBe(a);
|
||||
});
|
||||
|
||||
it('does not override children if no JSX children are provided', () => {
|
||||
const element = <Component children="text" />;
|
||||
expect(element.props.children).toBe('text');
|
||||
});
|
||||
|
||||
it('overrides children if null is provided as a JSX child', () => {
|
||||
const element = <Component children="text">{null}</Component>;
|
||||
expect(element.props.children).toBe(null);
|
||||
});
|
||||
|
||||
it('overrides children if undefined is provided as an argument', () => {
|
||||
const element = <Component children="text">{undefined}</Component>;
|
||||
expect(element.props.children).toBe(undefined);
|
||||
|
||||
const element2 = React.cloneElement(
|
||||
<Component children="text" />,
|
||||
{},
|
||||
undefined
|
||||
);
|
||||
expect(element2.props.children).toBe(undefined);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop in an array', () => {
|
||||
const a = 1;
|
||||
const b = 2;
|
||||
const c = 3;
|
||||
const element = (
|
||||
<Component>
|
||||
{a}
|
||||
{b}
|
||||
{c}
|
||||
</Component>
|
||||
);
|
||||
expect(element.props.children).toEqual([1, 2, 3]);
|
||||
});
|
||||
|
||||
it('allows static methods to be called using the type property', () => {
|
||||
class StaticMethodComponent {
|
||||
static someStaticMethod() {
|
||||
return 'someReturnValue';
|
||||
}
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
}
|
||||
|
||||
const element = <StaticMethodComponent />;
|
||||
expect(element.type.someStaticMethod()).toBe('someReturnValue');
|
||||
});
|
||||
|
||||
it('identifies valid elements', () => {
|
||||
expect(React.isValidElement(<div />)).toEqual(true);
|
||||
expect(React.isValidElement(<Component />)).toEqual(true);
|
||||
|
||||
expect(React.isValidElement(null)).toEqual(false);
|
||||
expect(React.isValidElement(true)).toEqual(false);
|
||||
expect(React.isValidElement({})).toEqual(false);
|
||||
expect(React.isValidElement('string')).toEqual(false);
|
||||
expect(React.isValidElement(Component)).toEqual(false);
|
||||
expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);
|
||||
});
|
||||
|
||||
it('is indistinguishable from a plain object', () => {
|
||||
const element = <div className="foo" />;
|
||||
const object = {};
|
||||
expect(element.constructor).toBe(object.constructor);
|
||||
});
|
||||
|
||||
it('should use default prop value when removing a prop', () => {
|
||||
Component.defaultProps = {fruit: 'persimmon'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Component fruit="mango" />, container);
|
||||
expect(instance.props.fruit).toBe('mango');
|
||||
|
||||
ReactDOM.render(<Component />, container);
|
||||
expect(instance.props.fruit).toBe('persimmon');
|
||||
});
|
||||
|
||||
it('should normalize props with default values', () => {
|
||||
class NormalizingComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NormalizingComponent.defaultProps = {prop: 'testKey'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<NormalizingComponent />, container);
|
||||
expect(instance.props.prop).toBe('testKey');
|
||||
|
||||
const inst2 = ReactDOM.render(
|
||||
<NormalizingComponent prop={null} />,
|
||||
container
|
||||
);
|
||||
expect(inst2.props.prop).toBe(null);
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements in children position', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component />, <Component />]}</Component>
|
||||
)
|
||||
).toErrorDev('Each child in a list should have a unique "key" prop.');
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements with owner info', () => {
|
||||
class InnerComponent extends React.Component {
|
||||
render() {
|
||||
return <Component>{this.props.childSet}</Component>;
|
||||
}
|
||||
}
|
||||
|
||||
class ComponentWrapper extends React.Component {
|
||||
render() {
|
||||
return <InnerComponent childSet={[<Component />, <Component />]} />;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<ComponentWrapper />)
|
||||
).toErrorDev(
|
||||
'Each child in a list should have a unique "key" prop.' +
|
||||
'\n\nCheck the render method of `InnerComponent`. ' +
|
||||
'It was passed a child from ComponentWrapper. '
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for arrays of elements with keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component key="#1" />, <Component key="#2" />]}</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for iterable elements with keys', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {
|
||||
value: done ? undefined : <Component key={'#' + i} />,
|
||||
done: done,
|
||||
};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn for numeric keys in entry iterable as a child', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {value: done ? undefined : [i, <Component />], done: done};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
iterable.entries = iterable['@@iterator'];
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn when the element is directly as children', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>
|
||||
<Component />
|
||||
<Component />
|
||||
</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn when the child array contains non-elements', () => {
|
||||
void (<Component>{[{}, {}]}</Component>);
|
||||
});
|
||||
|
||||
it('should give context for PropType errors in nested components.', () => {
|
||||
// In this test, we're making sure that if a proptype error is found in a
|
||||
// component, we give a small hint as to which parent instantiated that
|
||||
// component as per warnings about key usage in ReactElementValidator.
|
||||
function MyComp({color}) {
|
||||
return <div>My color is {color}</div>;
|
||||
}
|
||||
MyComp.propTypes = {
|
||||
color: PropTypes.string,
|
||||
};
|
||||
class ParentComp extends React.Component {
|
||||
render() {
|
||||
return <MyComp color={123} />;
|
||||
}
|
||||
}
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<ParentComp />)).toErrorDev(
|
||||
'Warning: Failed prop type: ' +
|
||||
'Invalid prop `color` of type `number` supplied to `MyComp`, ' +
|
||||
'expected `string`.\n' +
|
||||
' in MyComp (at **)\n' +
|
||||
' in ParentComp (at **)'
|
||||
);
|
||||
});
|
||||
|
||||
it('gives a helpful error when passing null, undefined, or boolean', () => {
|
||||
const Undefined = undefined;
|
||||
const Null = null;
|
||||
const True = true;
|
||||
const Div = 'div';
|
||||
expect(
|
||||
() => void (<Undefined />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: undefined. You likely forgot to export your ' +
|
||||
"component from the file it's defined in, or you might have mixed up " +
|
||||
'default and named imports.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<Null />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: null.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<True />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: boolean.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
// No error expected
|
||||
void (<Div />);
|
||||
});
|
||||
|
||||
it('should check default prop values', () => {
|
||||
RequiredPropComponent.defaultProps = {prop: null};
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<RequiredPropComponent />)
|
||||
).toErrorDev(
|
||||
'Warning: Failed prop type: The prop `prop` is marked as required in ' +
|
||||
'`RequiredPropComponent`, but its value is `null`.\n' +
|
||||
' in RequiredPropComponent (at **)'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn on invalid prop types', () => {
|
||||
// Since there is no prevalidation step for ES6 classes, there is no hook
|
||||
// for us to issue a warning earlier than element creation when the error
|
||||
// actually occurs. Since this step is skipped in production, we should just
|
||||
// warn instead of throwing for this case.
|
||||
class NullPropTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullPropTypeComponent.propTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullPropTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullPropTypeComponent: prop type `prop` is invalid; it must be a ' +
|
||||
'function, usually from the `prop-types` package,'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn on invalid context types', () => {
|
||||
class NullContextTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullContextTypeComponent.contextTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullContextTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullContextTypeComponent: context type `prop` is invalid; it must ' +
|
||||
'be a function, usually from the `prop-types` package,'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if getDefaultProps is specified on the class', () => {
|
||||
class GetDefaultPropsComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
GetDefaultPropsComponent.getDefaultProps = () => ({
|
||||
prop: 'foo',
|
||||
});
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<GetDefaultPropsComponent />)
|
||||
).toErrorDev(
|
||||
'getDefaultProps is only used on classic React.createClass definitions.' +
|
||||
' Use a static property named `defaultProps` instead.',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if component declares PropTypes instead of propTypes', () => {
|
||||
class MisspelledPropTypesComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
MisspelledPropTypesComponent.PropTypes = {
|
||||
prop: PropTypes.string,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<MisspelledPropTypesComponent prop="hi" />
|
||||
)
|
||||
).toErrorDev(
|
||||
'Warning: Component MisspelledPropTypesComponent declared `PropTypes` ' +
|
||||
'instead of `propTypes`. Did you misspell the property assignment?',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('warns for fragments with illegal attributes', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <React.Fragment a={1}>hello</React.Fragment>;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid prop `a` supplied to `React.Fragment`. React.Fragment ' +
|
||||
'can only have `key` and `children` props.'
|
||||
);
|
||||
});
|
||||
|
||||
it('warns for fragments with refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<React.Fragment
|
||||
ref={bar => {
|
||||
this.foo = bar;
|
||||
}}>
|
||||
hello
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid attribute `ref` supplied to `React.Fragment`.'
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for fragments of multiple elements without keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span>1</span>
|
||||
<span>2</span>
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
||||
it('warns for fragments of multiple elements with same key', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span key="a">1</span>
|
||||
<span key="a">2</span>
|
||||
<span key="b">3</span>
|
||||
</>
|
||||
)
|
||||
).toErrorDev('Encountered two children with the same key, `a`.', {
|
||||
withoutStack: true,
|
||||
});
|
||||
});
|
||||
|
||||
it('does not call lazy initializers eagerly', () => {
|
||||
let didCall = false;
|
||||
const Lazy = React.lazy(() => {
|
||||
didCall = true;
|
||||
return {then() {}};
|
||||
});
|
||||
<Lazy />;
|
||||
expect(didCall).toBe(false);
|
||||
});
|
||||
|
||||
it('supports classic refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <div className="foo" ref="inner" />;
|
||||
}
|
||||
}
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Foo />, container);
|
||||
expect(instance.refs.inner.className).toBe('foo');
|
||||
});
|
||||
|
||||
it('should support refs on owned components', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref="inner" />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref="outer">
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.refs.inner.getObject()).toEqual(innerObj);
|
||||
expect(this.refs.outer.getObject()).toEqual(outerObj);
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
});
|
||||
|
||||
it('should support callback-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = (
|
||||
<Wrapper object={innerObj} ref={c => (this.innerRef = c)} />
|
||||
);
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={c => (this.outerRef = c)}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should support object-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.innerRef = React.createRef();
|
||||
this.outerRef = React.createRef();
|
||||
}
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref={this.innerRef} />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={this.outerRef}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.current.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.current.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should support new-style refs with mixed-up owners', () => {
|
||||
class Wrapper extends React.Component {
|
||||
getTitle = () => {
|
||||
return this.props.title;
|
||||
};
|
||||
|
||||
render() {
|
||||
return this.props.getContent();
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
getInner = () => {
|
||||
// (With old-style refs, it's impossible to get a ref to this div
|
||||
// because Wrapper is the current owner when this function is called.)
|
||||
return <div className="inner" ref={c => (this.innerRef = c)} />;
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Wrapper
|
||||
title="wrapper"
|
||||
ref={c => (this.wrapperRef = c)}
|
||||
getContent={this.getInner}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
// Check .props.title to make sure we got the right elements back
|
||||
expect(this.wrapperRef.getTitle()).toBe('wrapper');
|
||||
expect(this.innerRef.className).toBe('inner');
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should warn when `key` is being accessed on composite element', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.key} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child key="0" />
|
||||
<Child key="1" />
|
||||
<Child key="2" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() => ReactDOM.render(<Parent />, container)).toErrorDev(
|
||||
'Child: `key` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn when `ref` is being accessed', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.ref} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child ref="childElement" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() => ReactDOM.render(<Parent />, container)).toErrorDev(
|
||||
'Child: `ref` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn when owner and self are different for string refs', () => {
|
||||
class ClassWithRenderProp extends React.Component {
|
||||
render() {
|
||||
return this.props.children();
|
||||
}
|
||||
}
|
||||
|
||||
class ClassParent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<ClassWithRenderProp>{() => <div ref="myRef" />}</ClassWithRenderProp>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const container = document.createElement('div');
|
||||
if (process.env.BABEL_ENV === 'development') {
|
||||
expect(() => ReactDOM.render(<ClassParent />, container)).toErrorDev([
|
||||
'Warning: Component "ClassWithRenderProp" contains the string ref "myRef". ' +
|
||||
'Support for string refs will be removed in a future major release. ' +
|
||||
'This case cannot be automatically converted to an arrow function. ' +
|
||||
'We ask you to manually fix this case by using useRef() or createRef() instead. ' +
|
||||
'Learn more about using refs safely here: ' +
|
||||
'https://reactjs.org/link/strict-mode-string-ref',
|
||||
]);
|
||||
} else {
|
||||
ReactDOM.render(<ClassParent />, container);
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,61 @@
|
||||
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||
# yarn lockfile v1
|
||||
|
||||
|
||||
"js-tokens@^3.0.0 || ^4.0.0":
|
||||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
|
||||
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
|
||||
|
||||
loose-envify@^1.1.0, loose-envify@^1.4.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
|
||||
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
|
||||
dependencies:
|
||||
js-tokens "^3.0.0 || ^4.0.0"
|
||||
|
||||
object-assign@^4.1.1:
|
||||
version "4.1.1"
|
||||
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
|
||||
integrity sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=
|
||||
|
||||
prop-types@^15.6.2, prop-types@^15.7.2:
|
||||
version "15.7.2"
|
||||
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
|
||||
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
|
||||
dependencies:
|
||||
loose-envify "^1.4.0"
|
||||
object-assign "^4.1.1"
|
||||
react-is "^16.8.1"
|
||||
|
||||
react-dom@16:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.13.1.tgz#c1bd37331a0486c078ee54c4740720993b2e0e7f"
|
||||
integrity sha512-81PIMmVLnCNLO/fFOQxdQkvEq/+Hfpv24XNJfpyZhTRfO0QcmQIF/PgCa1zCOj2w1hrn12MFLyaJ/G0+Mxtfag==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
prop-types "^15.6.2"
|
||||
scheduler "^0.19.1"
|
||||
|
||||
react-is@^16.8.1:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
|
||||
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
|
||||
|
||||
react@16:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"
|
||||
integrity sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
prop-types "^15.6.2"
|
||||
|
||||
scheduler@^0.19.1:
|
||||
version "0.19.1"
|
||||
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.19.1.tgz#4f3e2ed2c1a7d65681f4c854fa8c5a1ccb40f196"
|
||||
integrity sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
File diff suppressed because it is too large
Load Diff
+9
@@ -0,0 +1,9 @@
|
||||
/** @license React v17.0.0-rc.3
|
||||
* react-jsx-dev-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';require("object-assign");require("react");exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var a=Symbol.for;exports.Fragment=a("react.fragment")}exports.jsxDEV=void 0;
|
||||
File diff suppressed because it is too large
Load Diff
+10
@@ -0,0 +1,10 @@
|
||||
/** @license React v17.0.0-rc.3
|
||||
* react-jsx-runtime.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
'use strict';require("object-assign");var f=require("react"),g=60103;exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var h=Symbol.for;g=h("react.element");exports.Fragment=h("react.fragment")}var m=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,n=Object.prototype.hasOwnProperty,p={key:!0,ref:!0,__self:!0,__source:!0};
|
||||
function q(c,a,k){var b,d={},e=null,l=null;void 0!==k&&(e=""+k);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(l=a.ref);for(b in a)n.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:g,type:c,key:e,ref:l,props:d,_owner:m.current}}exports.jsx=q;exports.jsxs=q;
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-dev-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
module.exports = require('./cjs/react-jsx-runtime.production.min.js');
|
||||
} else {
|
||||
module.exports = require('./cjs/react-jsx-runtime.development.js');
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"prop-types": "^15.7.2",
|
||||
"react": "17.0.0-rc.3",
|
||||
"react-dom": "17.0.0-rc.3"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,773 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @emails react-core
|
||||
*/
|
||||
|
||||
// These tests are based on ReactJSXElement-test,
|
||||
// ReactJSXElementValidator-test, ReactComponent-test,
|
||||
// and ReactElementJSX-test.
|
||||
|
||||
jest.mock('react/jsx-runtime', () => require('./jsx-runtime'), {virtual: true});
|
||||
jest.mock('react/jsx-dev-runtime', () => require('./jsx-dev-runtime'), {
|
||||
virtual: true,
|
||||
});
|
||||
|
||||
let React = require('react');
|
||||
let ReactDOM = require('react-dom');
|
||||
let ReactTestUtils = {
|
||||
renderIntoDocument(el) {
|
||||
const container = document.createElement('div');
|
||||
return ReactDOM.render(el, container);
|
||||
},
|
||||
};
|
||||
let PropTypes = require('prop-types');
|
||||
let Component = class Component extends React.Component {
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
};
|
||||
let RequiredPropComponent = class extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
};
|
||||
RequiredPropComponent.displayName = 'RequiredPropComponent';
|
||||
RequiredPropComponent.propTypes = {prop: PropTypes.string.isRequired};
|
||||
|
||||
it('works', () => {
|
||||
const container = document.createElement('div');
|
||||
ReactDOM.render(<h1>hello</h1>, container);
|
||||
expect(container.textContent).toBe('hello');
|
||||
});
|
||||
|
||||
it('returns a complete element according to spec', () => {
|
||||
const element = <Component />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a lower-case to be passed as the string type', () => {
|
||||
const element = <div />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('allows a string to be passed as the type', () => {
|
||||
const TagName = 'div';
|
||||
const element = <TagName />;
|
||||
expect(element.type).toBe('div');
|
||||
expect(element.key).toBe(null);
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('returns an immutable element', () => {
|
||||
const element = <Component />;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
expect(() => (element.type = 'div')).toThrow();
|
||||
} else {
|
||||
expect(() => (element.type = 'div')).not.toThrow();
|
||||
}
|
||||
});
|
||||
|
||||
it('does not reuse the object that is spread into props', () => {
|
||||
const config = {foo: 1};
|
||||
const element = <Component {...config} />;
|
||||
expect(element.props.foo).toBe(1);
|
||||
config.foo = 2;
|
||||
expect(element.props.foo).toBe(1);
|
||||
});
|
||||
|
||||
it('extracts key and ref from the rest of the props', () => {
|
||||
const element = <Component key="12" ref="34" foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe('34');
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('coerces the key to a string', () => {
|
||||
const element = <Component key={12} foo="56" />;
|
||||
expect(element.type).toBe(Component);
|
||||
expect(element.key).toBe('12');
|
||||
expect(element.ref).toBe(null);
|
||||
const expectation = {foo: '56'};
|
||||
Object.freeze(expectation);
|
||||
expect(element.props).toEqual(expectation);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop', () => {
|
||||
const a = 1;
|
||||
const element = <Component children="text">{a}</Component>;
|
||||
expect(element.props.children).toBe(a);
|
||||
});
|
||||
|
||||
it('does not override children if no JSX children are provided', () => {
|
||||
const element = <Component children="text" />;
|
||||
expect(element.props.children).toBe('text');
|
||||
});
|
||||
|
||||
it('overrides children if null is provided as a JSX child', () => {
|
||||
const element = <Component children="text">{null}</Component>;
|
||||
expect(element.props.children).toBe(null);
|
||||
});
|
||||
|
||||
it('overrides children if undefined is provided as an argument', () => {
|
||||
const element = <Component children="text">{undefined}</Component>;
|
||||
expect(element.props.children).toBe(undefined);
|
||||
|
||||
const element2 = React.cloneElement(
|
||||
<Component children="text" />,
|
||||
{},
|
||||
undefined
|
||||
);
|
||||
expect(element2.props.children).toBe(undefined);
|
||||
});
|
||||
|
||||
it('merges JSX children onto the children prop in an array', () => {
|
||||
const a = 1;
|
||||
const b = 2;
|
||||
const c = 3;
|
||||
const element = (
|
||||
<Component>
|
||||
{a}
|
||||
{b}
|
||||
{c}
|
||||
</Component>
|
||||
);
|
||||
expect(element.props.children).toEqual([1, 2, 3]);
|
||||
});
|
||||
|
||||
it('allows static methods to be called using the type property', () => {
|
||||
class StaticMethodComponent {
|
||||
static someStaticMethod() {
|
||||
return 'someReturnValue';
|
||||
}
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
}
|
||||
|
||||
const element = <StaticMethodComponent />;
|
||||
expect(element.type.someStaticMethod()).toBe('someReturnValue');
|
||||
});
|
||||
|
||||
it('identifies valid elements', () => {
|
||||
expect(React.isValidElement(<div />)).toEqual(true);
|
||||
expect(React.isValidElement(<Component />)).toEqual(true);
|
||||
|
||||
expect(React.isValidElement(null)).toEqual(false);
|
||||
expect(React.isValidElement(true)).toEqual(false);
|
||||
expect(React.isValidElement({})).toEqual(false);
|
||||
expect(React.isValidElement('string')).toEqual(false);
|
||||
expect(React.isValidElement(Component)).toEqual(false);
|
||||
expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);
|
||||
});
|
||||
|
||||
it('is indistinguishable from a plain object', () => {
|
||||
const element = <div className="foo" />;
|
||||
const object = {};
|
||||
expect(element.constructor).toBe(object.constructor);
|
||||
});
|
||||
|
||||
it('should use default prop value when removing a prop', () => {
|
||||
Component.defaultProps = {fruit: 'persimmon'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Component fruit="mango" />, container);
|
||||
expect(instance.props.fruit).toBe('mango');
|
||||
|
||||
ReactDOM.render(<Component />, container);
|
||||
expect(instance.props.fruit).toBe('persimmon');
|
||||
});
|
||||
|
||||
it('should normalize props with default values', () => {
|
||||
class NormalizingComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NormalizingComponent.defaultProps = {prop: 'testKey'};
|
||||
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<NormalizingComponent />, container);
|
||||
expect(instance.props.prop).toBe('testKey');
|
||||
|
||||
const inst2 = ReactDOM.render(
|
||||
<NormalizingComponent prop={null} />,
|
||||
container
|
||||
);
|
||||
expect(inst2.props.prop).toBe(null);
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements in children position', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component />, <Component />]}</Component>
|
||||
)
|
||||
).toErrorDev('Each child in a list should have a unique "key" prop.');
|
||||
});
|
||||
|
||||
it('warns for keys for arrays of elements with owner info', () => {
|
||||
class InnerComponent extends React.Component {
|
||||
render() {
|
||||
return <Component>{this.props.childSet}</Component>;
|
||||
}
|
||||
}
|
||||
|
||||
class ComponentWrapper extends React.Component {
|
||||
render() {
|
||||
return <InnerComponent childSet={[<Component />, <Component />]} />;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<ComponentWrapper />)
|
||||
).toErrorDev(
|
||||
'Each child in a list should have a unique "key" prop.' +
|
||||
'\n\nCheck the render method of `InnerComponent`. ' +
|
||||
'It was passed a child from ComponentWrapper. '
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for arrays of elements with keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>{[<Component key="#1" />, <Component key="#2" />]}</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for iterable elements with keys', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {
|
||||
value: done ? undefined : <Component key={'#' + i} />,
|
||||
done: done,
|
||||
};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn for numeric keys in entry iterable as a child', () => {
|
||||
const iterable = {
|
||||
'@@iterator': function() {
|
||||
let i = 0;
|
||||
return {
|
||||
next: function() {
|
||||
const done = ++i > 2;
|
||||
return {value: done ? undefined : [i, <Component />], done: done};
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
iterable.entries = iterable['@@iterator'];
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>);
|
||||
});
|
||||
|
||||
it('does not warn when the element is directly as children', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<Component>
|
||||
<Component />
|
||||
<Component />
|
||||
</Component>
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn when the child array contains non-elements', () => {
|
||||
void (<Component>{[{}, {}]}</Component>);
|
||||
});
|
||||
|
||||
it('should give context for PropType errors in nested components.', () => {
|
||||
// In this test, we're making sure that if a proptype error is found in a
|
||||
// component, we give a small hint as to which parent instantiated that
|
||||
// component as per warnings about key usage in ReactElementValidator.
|
||||
function MyComp({color}) {
|
||||
return <div>My color is {color}</div>;
|
||||
}
|
||||
MyComp.propTypes = {
|
||||
color: PropTypes.string,
|
||||
};
|
||||
class ParentComp extends React.Component {
|
||||
render() {
|
||||
return <MyComp color={123} />;
|
||||
}
|
||||
}
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<ParentComp />)).toErrorDev(
|
||||
'Warning: Failed prop type: ' +
|
||||
'Invalid prop `color` of type `number` supplied to `MyComp`, ' +
|
||||
'expected `string`.\n' +
|
||||
' in fn (at **)\n' + // Jest/Node issue
|
||||
' in ParentComp (at **)'
|
||||
);
|
||||
});
|
||||
|
||||
it('gives a helpful error when passing null, undefined, or boolean', () => {
|
||||
const Undefined = undefined;
|
||||
const Null = null;
|
||||
const True = true;
|
||||
const Div = 'div';
|
||||
expect(
|
||||
() => void (<Undefined />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: undefined. You likely forgot to export your ' +
|
||||
"component from the file it's defined in, or you might have mixed up " +
|
||||
'default and named imports.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<Null />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: null.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
expect(
|
||||
() => void (<True />)
|
||||
).toErrorDev(
|
||||
'Warning: React.jsx: type is invalid -- expected a string ' +
|
||||
'(for built-in components) or a class/function (for composite ' +
|
||||
'components) but got: boolean.' +
|
||||
(process.env.BABEL_ENV === 'development'
|
||||
? '\n\nCheck your code at **.'
|
||||
: ''),
|
||||
{withoutStack: true}
|
||||
);
|
||||
// No error expected
|
||||
void (<Div />);
|
||||
});
|
||||
|
||||
it('should check default prop values', () => {
|
||||
RequiredPropComponent.defaultProps = {prop: null};
|
||||
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<RequiredPropComponent />)
|
||||
).toErrorDev(
|
||||
'Warning: Failed prop type: The prop `prop` is marked as required in ' +
|
||||
'`RequiredPropComponent`, but its value is `null`.\n' +
|
||||
' in construct (at **)' // Jest/Node issue
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn on invalid prop types', () => {
|
||||
// Since there is no prevalidation step for ES6 classes, there is no hook
|
||||
// for us to issue a warning earlier than element creation when the error
|
||||
// actually occurs. Since this step is skipped in production, we should just
|
||||
// warn instead of throwing for this case.
|
||||
class NullPropTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullPropTypeComponent.propTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullPropTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullPropTypeComponent: prop type `prop` is invalid; it must be a ' +
|
||||
'function, usually from the `prop-types` package,'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn on invalid context types', () => {
|
||||
class NullContextTypeComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
NullContextTypeComponent.contextTypes = {
|
||||
prop: null,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<NullContextTypeComponent />)
|
||||
).toErrorDev(
|
||||
'NullContextTypeComponent: context type `prop` is invalid; it must ' +
|
||||
'be a function, usually from the `prop-types` package,'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if getDefaultProps is specified on the class', () => {
|
||||
class GetDefaultPropsComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
GetDefaultPropsComponent.getDefaultProps = () => ({
|
||||
prop: 'foo',
|
||||
});
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(<GetDefaultPropsComponent />)
|
||||
).toErrorDev(
|
||||
'getDefaultProps is only used on classic React.createClass definitions.' +
|
||||
' Use a static property named `defaultProps` instead.',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn if component declares PropTypes instead of propTypes', () => {
|
||||
class MisspelledPropTypesComponent extends React.Component {
|
||||
render() {
|
||||
return <span>{this.props.prop}</span>;
|
||||
}
|
||||
}
|
||||
MisspelledPropTypesComponent.PropTypes = {
|
||||
prop: PropTypes.string,
|
||||
};
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<MisspelledPropTypesComponent prop="hi" />
|
||||
)
|
||||
).toErrorDev(
|
||||
'Warning: Component MisspelledPropTypesComponent declared `PropTypes` ' +
|
||||
'instead of `propTypes`. Did you misspell the property assignment?',
|
||||
{withoutStack: true}
|
||||
);
|
||||
});
|
||||
|
||||
it('warns for fragments with illegal attributes', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <React.Fragment a={1}>hello</React.Fragment>;
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid prop `a` supplied to `React.Fragment`. React.Fragment ' +
|
||||
'can only have `key` and `children` props.'
|
||||
);
|
||||
});
|
||||
|
||||
it('warns for fragments with refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<React.Fragment
|
||||
ref={bar => {
|
||||
this.foo = bar;
|
||||
}}>
|
||||
hello
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
expect(() => ReactTestUtils.renderIntoDocument(<Foo />)).toErrorDev(
|
||||
'Invalid attribute `ref` supplied to `React.Fragment`.'
|
||||
);
|
||||
});
|
||||
|
||||
it('does not warn for fragments of multiple elements without keys', () => {
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span>1</span>
|
||||
<span>2</span>
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
||||
it('warns for fragments of multiple elements with same key', () => {
|
||||
expect(() =>
|
||||
ReactTestUtils.renderIntoDocument(
|
||||
<>
|
||||
<span key="a">1</span>
|
||||
<span key="a">2</span>
|
||||
<span key="b">3</span>
|
||||
</>
|
||||
)
|
||||
).toErrorDev('Encountered two children with the same key, `a`.', {
|
||||
withoutStack: true,
|
||||
});
|
||||
});
|
||||
|
||||
it('does not call lazy initializers eagerly', () => {
|
||||
let didCall = false;
|
||||
const Lazy = React.lazy(() => {
|
||||
didCall = true;
|
||||
return {then() {}};
|
||||
});
|
||||
<Lazy />;
|
||||
expect(didCall).toBe(false);
|
||||
});
|
||||
|
||||
it('supports classic refs', () => {
|
||||
class Foo extends React.Component {
|
||||
render() {
|
||||
return <div className="foo" ref="inner" />;
|
||||
}
|
||||
}
|
||||
const container = document.createElement('div');
|
||||
const instance = ReactDOM.render(<Foo />, container);
|
||||
expect(instance.refs.inner.className).toBe('foo');
|
||||
});
|
||||
|
||||
it('should support refs on owned components', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref="inner" />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref="outer">
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.refs.inner.getObject()).toEqual(innerObj);
|
||||
expect(this.refs.outer.getObject()).toEqual(outerObj);
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
});
|
||||
|
||||
it('should support callback-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
render() {
|
||||
const inner = (
|
||||
<Wrapper object={innerObj} ref={c => (this.innerRef = c)} />
|
||||
);
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={c => (this.outerRef = c)}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should support object-style refs', () => {
|
||||
const innerObj = {};
|
||||
const outerObj = {};
|
||||
|
||||
class Wrapper extends React.Component {
|
||||
getObject = () => {
|
||||
return this.props.object;
|
||||
};
|
||||
|
||||
render() {
|
||||
return <div>{this.props.children}</div>;
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.innerRef = React.createRef();
|
||||
this.outerRef = React.createRef();
|
||||
}
|
||||
render() {
|
||||
const inner = <Wrapper object={innerObj} ref={this.innerRef} />;
|
||||
const outer = (
|
||||
<Wrapper object={outerObj} ref={this.outerRef}>
|
||||
{inner}
|
||||
</Wrapper>
|
||||
);
|
||||
return outer;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
expect(this.innerRef.current.getObject()).toEqual(innerObj);
|
||||
expect(this.outerRef.current.getObject()).toEqual(outerObj);
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should support new-style refs with mixed-up owners', () => {
|
||||
class Wrapper extends React.Component {
|
||||
getTitle = () => {
|
||||
return this.props.title;
|
||||
};
|
||||
|
||||
render() {
|
||||
return this.props.getContent();
|
||||
}
|
||||
}
|
||||
|
||||
let mounted = false;
|
||||
|
||||
class Component extends React.Component {
|
||||
getInner = () => {
|
||||
// (With old-style refs, it's impossible to get a ref to this div
|
||||
// because Wrapper is the current owner when this function is called.)
|
||||
return <div className="inner" ref={c => (this.innerRef = c)} />;
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Wrapper
|
||||
title="wrapper"
|
||||
ref={c => (this.wrapperRef = c)}
|
||||
getContent={this.getInner}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
// Check .props.title to make sure we got the right elements back
|
||||
expect(this.wrapperRef.getTitle()).toBe('wrapper');
|
||||
expect(this.innerRef.className).toBe('inner');
|
||||
mounted = true;
|
||||
}
|
||||
}
|
||||
|
||||
ReactTestUtils.renderIntoDocument(<Component />);
|
||||
expect(mounted).toBe(true);
|
||||
});
|
||||
|
||||
it('should warn when `key` is being accessed on composite element', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.key} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child key="0" />
|
||||
<Child key="1" />
|
||||
<Child key="2" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() => ReactDOM.render(<Parent />, container)).toErrorDev(
|
||||
'Child: `key` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn when `ref` is being accessed', () => {
|
||||
const container = document.createElement('div');
|
||||
class Child extends React.Component {
|
||||
render() {
|
||||
return <div> {this.props.ref} </div>;
|
||||
}
|
||||
}
|
||||
class Parent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Child ref="childElement" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
expect(() => ReactDOM.render(<Parent />, container)).toErrorDev(
|
||||
'Child: `ref` is not a prop. Trying to access it will result ' +
|
||||
'in `undefined` being returned. If you need to access the same ' +
|
||||
'value within the child component, you should pass it as a different ' +
|
||||
'prop. (https://reactjs.org/link/special-props)'
|
||||
);
|
||||
});
|
||||
|
||||
it('should warn when owner and self are different for string refs', () => {
|
||||
class ClassWithRenderProp extends React.Component {
|
||||
render() {
|
||||
return this.props.children();
|
||||
}
|
||||
}
|
||||
|
||||
class ClassParent extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<ClassWithRenderProp>{() => <div ref="myRef" />}</ClassWithRenderProp>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const container = document.createElement('div');
|
||||
if (process.env.BABEL_ENV === 'development') {
|
||||
expect(() => ReactDOM.render(<ClassParent />, container)).toErrorDev([
|
||||
'Warning: Component "ClassWithRenderProp" contains the string ref "myRef". ' +
|
||||
'Support for string refs will be removed in a future major release. ' +
|
||||
'This case cannot be automatically converted to an arrow function. ' +
|
||||
'We ask you to manually fix this case by using useRef() or createRef() instead. ' +
|
||||
'Learn more about using refs safely here: ' +
|
||||
'https://reactjs.org/link/strict-mode-string-ref',
|
||||
]);
|
||||
} else {
|
||||
ReactDOM.render(<ClassParent />, container);
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,59 @@
|
||||
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||
# yarn lockfile v1
|
||||
|
||||
|
||||
"js-tokens@^3.0.0 || ^4.0.0":
|
||||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
|
||||
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
|
||||
|
||||
loose-envify@^1.1.0, loose-envify@^1.4.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
|
||||
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
|
||||
dependencies:
|
||||
js-tokens "^3.0.0 || ^4.0.0"
|
||||
|
||||
object-assign@^4.1.1:
|
||||
version "4.1.1"
|
||||
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
|
||||
integrity sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=
|
||||
|
||||
prop-types@^15.7.2:
|
||||
version "15.7.2"
|
||||
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
|
||||
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
|
||||
dependencies:
|
||||
loose-envify "^1.4.0"
|
||||
object-assign "^4.1.1"
|
||||
react-is "^16.8.1"
|
||||
|
||||
react-dom@17.0.0-rc.3:
|
||||
version "17.0.0-rc.3"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.0-rc.3.tgz#6254f82c62ed569a2a90dcf1c7b71d4d8d951744"
|
||||
integrity sha512-rrmZ91kdXBaCVomiNUQ1WvEClb5GcmxewGurd3FnsXKJBOhFdlkGbT5MY5ZQkMXH5xnIvs5ZEEB2iBr2ZqKiqg==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
scheduler "0.20.0-rc.3"
|
||||
|
||||
react-is@^16.8.1:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
|
||||
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
|
||||
|
||||
react@17.0.0-rc.3:
|
||||
version "17.0.0-rc.3"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-17.0.0-rc.3.tgz#ccb426b0146a8c10ee92c2a72d9d813a16a55806"
|
||||
integrity sha512-b1vEcXBmlN2Bu+k57jq2ytEo5p28g5fdRfc02JRdnvGZKKphvlUnAfsrUHiOmUtL/6wvFIusi2zxp8t60fihfw==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
scheduler@0.20.0-rc.3:
|
||||
version "0.20.0-rc.3"
|
||||
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.0-rc.3.tgz#ce616ebdd4073f5026718960d7e2d0928788c626"
|
||||
integrity sha512-rPwhSgPKhRqximLHdl+oJ/8HVcMS2vyZlH74OQHqKbH04ONgKNkJ13DZLPdFSYFos8FUj6+PduO9+OoRaG6QWQ==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
@@ -0,0 +1,318 @@
|
||||
'use strict';
|
||||
|
||||
// This is mostly copypasta from toWarnDev.js matchers
|
||||
// that we use in the main repo Jest configuration.
|
||||
|
||||
const expect = global.expect;
|
||||
|
||||
const jestDiff = require('jest-diff').default;
|
||||
const util = require('util');
|
||||
|
||||
function shouldIgnoreConsoleError(format, args) {
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
if (typeof format === 'string') {
|
||||
if (format.indexOf('Error: Uncaught [') === 0) {
|
||||
// This looks like an uncaught error from invokeGuardedCallback() wrapper
|
||||
// in development that is reported by jsdom. Ignore because it's noisy.
|
||||
return true;
|
||||
}
|
||||
if (format.indexOf('The above error occurred') === 0) {
|
||||
// This looks like an error addendum from ReactFiberErrorLogger.
|
||||
// Ignore it too.
|
||||
return true;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (
|
||||
format != null &&
|
||||
typeof format.message === 'string' &&
|
||||
typeof format.stack === 'string' &&
|
||||
args.length === 0
|
||||
) {
|
||||
// In production, ReactFiberErrorLogger logs error objects directly.
|
||||
// They are noisy too so we'll try to ignore them.
|
||||
return true;
|
||||
}
|
||||
if (
|
||||
format.indexOf(
|
||||
'act(...) is not supported in production builds of React'
|
||||
) === 0
|
||||
) {
|
||||
// We don't yet support act() for prod builds, and warn for it.
|
||||
// But we'd like to use act() ourselves for prod builds.
|
||||
// Let's ignore the warning and #yolo.
|
||||
return true;
|
||||
}
|
||||
}
|
||||
// Looks legit
|
||||
return false;
|
||||
}
|
||||
|
||||
function normalizeCodeLocInfo(str) {
|
||||
if (typeof str !== 'string') {
|
||||
return str;
|
||||
}
|
||||
// This special case exists only for the special source location in
|
||||
// ReactElementValidator. That will go away if we remove source locations.
|
||||
str = str.replace(/Check your code at .+?:\d+/g, 'Check your code at **');
|
||||
// V8 format:
|
||||
// at Component (/path/filename.js:123:45)
|
||||
// React format:
|
||||
// in Component (at filename.js:123)
|
||||
return str.replace(/\n +(?:at|in) ([\S]+)[^\n]*/g, function(m, name) {
|
||||
return '\n in ' + name + ' (at **)';
|
||||
});
|
||||
}
|
||||
|
||||
const createMatcherFor = (consoleMethod, matcherName) =>
|
||||
function matcher(callback, expectedMessages, options = {}) {
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
// Warn about incorrect usage of matcher.
|
||||
if (typeof expectedMessages === 'string') {
|
||||
expectedMessages = [expectedMessages];
|
||||
} else if (!Array.isArray(expectedMessages)) {
|
||||
throw Error(
|
||||
`${matcherName}() requires a parameter of type string or an array of strings ` +
|
||||
`but was given ${typeof expectedMessages}.`
|
||||
);
|
||||
}
|
||||
if (
|
||||
options != null &&
|
||||
(typeof options !== 'object' || Array.isArray(options))
|
||||
) {
|
||||
throw new Error(
|
||||
`${matcherName}() second argument, when present, should be an object. ` +
|
||||
'Did you forget to wrap the messages into an array?'
|
||||
);
|
||||
}
|
||||
if (arguments.length > 3) {
|
||||
// `matcher` comes from Jest, so it's more than 2 in practice
|
||||
throw new Error(
|
||||
`${matcherName}() received more than two arguments. ` +
|
||||
'Did you forget to wrap the messages into an array?'
|
||||
);
|
||||
}
|
||||
|
||||
const withoutStack = options.withoutStack;
|
||||
const logAllErrors = options.logAllErrors;
|
||||
const warningsWithoutComponentStack = [];
|
||||
const warningsWithComponentStack = [];
|
||||
const unexpectedWarnings = [];
|
||||
|
||||
let lastWarningWithMismatchingFormat = null;
|
||||
let lastWarningWithExtraComponentStack = null;
|
||||
|
||||
// Catch errors thrown by the callback,
|
||||
// But only rethrow them if all test expectations have been satisfied.
|
||||
// Otherwise an Error in the callback can mask a failed expectation,
|
||||
// and result in a test that passes when it shouldn't.
|
||||
let caughtError;
|
||||
|
||||
const isLikelyAComponentStack = message =>
|
||||
typeof message === 'string' &&
|
||||
(message.includes('\n in ') || message.includes('\n at '));
|
||||
|
||||
const consoleSpy = (format, ...args) => {
|
||||
// Ignore uncaught errors reported by jsdom
|
||||
// and React addendums because they're too noisy.
|
||||
if (
|
||||
!logAllErrors &&
|
||||
consoleMethod === 'error' &&
|
||||
shouldIgnoreConsoleError(format, args)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
const message = util.format(format, ...args);
|
||||
const normalizedMessage = normalizeCodeLocInfo(message);
|
||||
|
||||
// Remember if the number of %s interpolations
|
||||
// doesn't match the number of arguments.
|
||||
// We'll fail the test if it happens.
|
||||
let argIndex = 0;
|
||||
format.replace(/%s/g, () => argIndex++);
|
||||
if (argIndex !== args.length) {
|
||||
lastWarningWithMismatchingFormat = {
|
||||
format,
|
||||
args,
|
||||
expectedArgCount: argIndex,
|
||||
};
|
||||
}
|
||||
|
||||
// Protect against accidentally passing a component stack
|
||||
// to warning() which already injects the component stack.
|
||||
if (
|
||||
args.length >= 2 &&
|
||||
isLikelyAComponentStack(args[args.length - 1]) &&
|
||||
isLikelyAComponentStack(args[args.length - 2])
|
||||
) {
|
||||
lastWarningWithExtraComponentStack = {
|
||||
format,
|
||||
};
|
||||
}
|
||||
|
||||
for (let index = 0; index < expectedMessages.length; index++) {
|
||||
const expectedMessage = expectedMessages[index];
|
||||
if (
|
||||
normalizedMessage === expectedMessage ||
|
||||
normalizedMessage.includes(expectedMessage)
|
||||
) {
|
||||
if (isLikelyAComponentStack(normalizedMessage)) {
|
||||
warningsWithComponentStack.push(normalizedMessage);
|
||||
} else {
|
||||
warningsWithoutComponentStack.push(normalizedMessage);
|
||||
}
|
||||
expectedMessages.splice(index, 1);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
let errorMessage;
|
||||
if (expectedMessages.length === 0) {
|
||||
errorMessage =
|
||||
'Unexpected warning recorded: ' +
|
||||
this.utils.printReceived(normalizedMessage);
|
||||
} else if (expectedMessages.length === 1) {
|
||||
errorMessage =
|
||||
'Unexpected warning recorded: ' +
|
||||
jestDiff(expectedMessages[0], normalizedMessage);
|
||||
} else {
|
||||
errorMessage =
|
||||
'Unexpected warning recorded: ' +
|
||||
jestDiff(expectedMessages, [normalizedMessage]);
|
||||
}
|
||||
|
||||
// Record the call stack for unexpected warnings.
|
||||
// We don't throw an Error here though,
|
||||
// Because it might be suppressed by ReactFiberScheduler.
|
||||
unexpectedWarnings.push(new Error(errorMessage));
|
||||
};
|
||||
|
||||
// TODO Decide whether we need to support nested toWarn* expectations.
|
||||
// If we don't need it, add a check here to see if this is already our spy,
|
||||
// And throw an error.
|
||||
const originalMethod = console[consoleMethod];
|
||||
|
||||
// Avoid using Jest's built-in spy since it can't be removed.
|
||||
console[consoleMethod] = consoleSpy;
|
||||
|
||||
try {
|
||||
callback();
|
||||
} catch (error) {
|
||||
caughtError = error;
|
||||
} finally {
|
||||
// Restore the unspied method so that unexpected errors fail tests.
|
||||
console[consoleMethod] = originalMethod;
|
||||
|
||||
// Any unexpected Errors thrown by the callback should fail the test.
|
||||
// This should take precedence since unexpected errors could block warnings.
|
||||
if (caughtError) {
|
||||
throw caughtError;
|
||||
}
|
||||
|
||||
// Any unexpected warnings should be treated as a failure.
|
||||
if (unexpectedWarnings.length > 0) {
|
||||
return {
|
||||
message: () => unexpectedWarnings[0].stack,
|
||||
pass: false,
|
||||
};
|
||||
}
|
||||
|
||||
// Any remaining messages indicate a failed expectations.
|
||||
if (expectedMessages.length > 0) {
|
||||
return {
|
||||
message: () =>
|
||||
`Expected warning was not recorded:\n ${this.utils.printReceived(
|
||||
expectedMessages[0]
|
||||
)}`,
|
||||
pass: false,
|
||||
};
|
||||
}
|
||||
|
||||
if (typeof withoutStack === 'number') {
|
||||
// We're expecting a particular number of warnings without stacks.
|
||||
if (withoutStack !== warningsWithoutComponentStack.length) {
|
||||
return {
|
||||
message: () =>
|
||||
`Expected ${withoutStack} warnings without a component stack but received ${warningsWithoutComponentStack.length}:\n` +
|
||||
warningsWithoutComponentStack.map(warning =>
|
||||
this.utils.printReceived(warning)
|
||||
),
|
||||
pass: false,
|
||||
};
|
||||
}
|
||||
} else if (withoutStack === true) {
|
||||
// We're expecting that all warnings won't have the stack.
|
||||
// If some warnings have it, it's an error.
|
||||
if (warningsWithComponentStack.length > 0) {
|
||||
return {
|
||||
message: () =>
|
||||
`Received warning unexpectedly includes a component stack:\n ${this.utils.printReceived(
|
||||
warningsWithComponentStack[0]
|
||||
)}\nIf this warning intentionally includes the component stack, remove ` +
|
||||
`{withoutStack: true} from the ${matcherName}() call. If you have a mix of ` +
|
||||
`warnings with and without stack in one ${matcherName}() call, pass ` +
|
||||
`{withoutStack: N} where N is the number of warnings without stacks.`,
|
||||
pass: false,
|
||||
};
|
||||
}
|
||||
} else if (withoutStack === false || withoutStack === undefined) {
|
||||
// We're expecting that all warnings *do* have the stack (default).
|
||||
// If some warnings don't have it, it's an error.
|
||||
if (warningsWithoutComponentStack.length > 0) {
|
||||
return {
|
||||
message: () =>
|
||||
`Received warning unexpectedly does not include a component stack:\n ${this.utils.printReceived(
|
||||
warningsWithoutComponentStack[0]
|
||||
)}\nIf this warning intentionally omits the component stack, add ` +
|
||||
`{withoutStack: true} to the ${matcherName} call.`,
|
||||
pass: false,
|
||||
};
|
||||
}
|
||||
} else {
|
||||
throw Error(
|
||||
`The second argument for ${matcherName}(), when specified, must be an object. It may have a ` +
|
||||
`property called "withoutStack" whose value may be undefined, boolean, or a number. ` +
|
||||
`Instead received ${typeof withoutStack}.`
|
||||
);
|
||||
}
|
||||
|
||||
if (lastWarningWithMismatchingFormat !== null) {
|
||||
return {
|
||||
message: () =>
|
||||
`Received ${
|
||||
lastWarningWithMismatchingFormat.args.length
|
||||
} arguments for a message with ${
|
||||
lastWarningWithMismatchingFormat.expectedArgCount
|
||||
} placeholders:\n ${this.utils.printReceived(
|
||||
lastWarningWithMismatchingFormat.format
|
||||
)}`,
|
||||
pass: false,
|
||||
};
|
||||
}
|
||||
|
||||
if (lastWarningWithExtraComponentStack !== null) {
|
||||
return {
|
||||
message: () =>
|
||||
`Received more than one component stack for a warning:\n ${this.utils.printReceived(
|
||||
lastWarningWithExtraComponentStack.format
|
||||
)}\nDid you accidentally pass a stack to warning() as the last argument? ` +
|
||||
`Don't forget warning() already injects the component stack automatically.`,
|
||||
pass: false,
|
||||
};
|
||||
}
|
||||
|
||||
return {pass: true};
|
||||
}
|
||||
} else {
|
||||
// Any uncaught errors or warnings should fail tests in production mode.
|
||||
callback();
|
||||
|
||||
return {pass: true};
|
||||
}
|
||||
};
|
||||
|
||||
expect.extend({
|
||||
toWarnDev: createMatcherFor('warn', 'toWarnDev'),
|
||||
toErrorDev: createMatcherFor('error', 'toErrorDev'),
|
||||
});
|
||||
File diff suppressed because it is too large
Load Diff
@@ -25,7 +25,7 @@ let didWarn = false;
|
||||
let didError = false;
|
||||
|
||||
const files = glob
|
||||
.sync('**/*.js', {ignore: '**/node_modules/**'})
|
||||
.sync('**/*.js', {ignore: ['**/node_modules/**', '**/cjs/**']})
|
||||
.filter(f => !onlyChanged || changedFiles.has(f));
|
||||
|
||||
if (!files.length) {
|
||||
|
||||
Reference in New Issue
Block a user