2018-01-17 09:49:38 +08:00
|
|
|
/**
|
2018-09-08 06:11:23 +08:00
|
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
2018-01-17 09:49:38 +08:00
|
|
|
*
|
|
|
|
* This source code is licensed under the MIT license found in the
|
|
|
|
* LICENSE file in the root directory of this source tree.
|
|
|
|
*/
|
|
|
|
|
|
|
|
'use strict';
|
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
/* eslint-disable no-for-of-loops/no-for-of-loops */
|
|
|
|
|
2018-02-12 03:43:29 +08:00
|
|
|
// Hi, if this is your first time editing/reading a Dangerfile, here's a summary:
|
|
|
|
// It's a JS runtime which helps you provide continuous feedback inside GitHub.
|
|
|
|
//
|
|
|
|
// You can see the docs here: http://danger.systems/js/
|
|
|
|
//
|
|
|
|
// If you want to test changes Danger, I'd recommend checking out an existing PR
|
|
|
|
// and then running the `danger pr` command.
|
|
|
|
//
|
|
|
|
// You'll need a GitHub token, you can re-use this one:
|
|
|
|
//
|
2018-12-08 01:06:47 +08:00
|
|
|
// 0a7d5c3cad9a6dbec2d9 9a5222cf49062a4c1ef7
|
2018-02-12 03:43:29 +08:00
|
|
|
//
|
|
|
|
// (Just remove the space)
|
|
|
|
//
|
|
|
|
// So, for example:
|
|
|
|
//
|
|
|
|
// `DANGER_GITHUB_API_TOKEN=[ENV_ABOVE] yarn danger pr https://github.com/facebook/react/pull/11865
|
|
|
|
|
2019-04-12 07:43:33 +08:00
|
|
|
const {markdown, danger, warn} = require('danger');
|
2021-02-07 04:57:11 +08:00
|
|
|
const {promisify} = require('util');
|
|
|
|
const glob = promisify(require('glob'));
|
|
|
|
const gzipSize = require('gzip-size');
|
|
|
|
|
|
|
|
const {readFileSync, statSync} = require('fs');
|
|
|
|
|
|
|
|
const BASE_DIR = 'base-build';
|
2021-09-22 00:06:15 +08:00
|
|
|
const HEAD_DIR = 'build';
|
2021-02-07 04:57:11 +08:00
|
|
|
|
|
|
|
const CRITICAL_THRESHOLD = 0.02;
|
|
|
|
const SIGNIFICANCE_THRESHOLD = 0.002;
|
|
|
|
const CRITICAL_ARTIFACT_PATHS = new Set([
|
|
|
|
// We always report changes to these bundles, even if the change is
|
|
|
|
// insiginificant or non-existent.
|
|
|
|
'oss-stable/react-dom/cjs/react-dom.production.min.js',
|
|
|
|
'oss-experimental/react-dom/cjs/react-dom.production.min.js',
|
|
|
|
'facebook-www/ReactDOM-prod.classic.js',
|
|
|
|
'facebook-www/ReactDOM-prod.modern.js',
|
|
|
|
'facebook-www/ReactDOMForked-prod.classic.js',
|
|
|
|
]);
|
|
|
|
|
|
|
|
const kilobyteFormatter = new Intl.NumberFormat('en', {
|
|
|
|
style: 'unit',
|
|
|
|
unit: 'kilobyte',
|
|
|
|
minimumFractionDigits: 2,
|
|
|
|
maximumFractionDigits: 2,
|
|
|
|
});
|
|
|
|
|
|
|
|
function kbs(bytes) {
|
|
|
|
return kilobyteFormatter.format(bytes / 1000);
|
2018-01-17 09:49:38 +08:00
|
|
|
}
|
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
const percentFormatter = new Intl.NumberFormat('en', {
|
|
|
|
style: 'percent',
|
|
|
|
signDisplay: 'exceptZero',
|
|
|
|
minimumFractionDigits: 2,
|
|
|
|
maximumFractionDigits: 2,
|
|
|
|
});
|
2018-01-17 09:49:38 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
function change(decimal) {
|
|
|
|
if (Number === Infinity) {
|
|
|
|
return 'New file';
|
2018-01-20 02:07:26 +08:00
|
|
|
}
|
2021-02-07 04:57:11 +08:00
|
|
|
if (decimal === -1) {
|
|
|
|
return 'Deleted';
|
|
|
|
}
|
|
|
|
if (decimal < 0.0001) {
|
|
|
|
return '=';
|
2019-04-12 07:43:33 +08:00
|
|
|
}
|
2021-02-07 04:57:11 +08:00
|
|
|
return percentFormatter.format(decimal);
|
2021-02-04 00:29:51 +08:00
|
|
|
}
|
2018-02-12 03:43:29 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
const header = `
|
|
|
|
| Name | +/- | Base | Current | +/- gzip | Base gzip | Current gzip |
|
|
|
|
| ---- | --- | ---- | ------- | -------- | --------- | ------------ |`;
|
2018-01-17 09:49:38 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
function row(result) {
|
|
|
|
// prettier-ignore
|
|
|
|
return `| ${result.path} | **${change(result.change)}** | ${kbs(result.baseSize)} | ${kbs(result.headSize)} | ${change(result.changeGzip)} | ${kbs(result.baseSizeGzip)} | ${kbs(result.headSizeGzip)}`;
|
2021-02-04 00:29:51 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
(async function() {
|
|
|
|
// Use git locally to grab the commit which represents the place
|
|
|
|
// where the branches differ
|
|
|
|
|
|
|
|
const upstreamRepo = danger.github.pr.base.repo.full_name;
|
|
|
|
if (upstreamRepo !== 'facebook/react') {
|
|
|
|
// Exit unless we're running in the main repo
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
let headSha;
|
|
|
|
let baseSha;
|
|
|
|
try {
|
Improve DEV errors if string coercion throws (Temporal.*, Symbol, etc.) (#22064)
* Revise ESLint rules for string coercion
Currently, react uses `'' + value` to coerce mixed values to strings.
This code will throw for Temporal objects or symbols.
To make string-coercion safer and to improve user-facing error messages,
This commit adds a new ESLint rule called `safe-string-coercion`.
This rule has two modes: a production mode and a non-production mode.
* If the `isProductionUserAppCode` option is true, then `'' + value`
coercions are allowed (because they're faster, although they may
throw) and `String(value)` coercions are disallowed. Exception:
when building error messages or running DEV-only code in prod
files, `String()` should be used because it won't throw.
* If the `isProductionUserAppCode` option is false, then `'' + value`
coercions are disallowed (because they may throw, and in non-prod
code it's not worth the risk) and `String(value)` are allowed.
Production mode is used for all files which will be bundled with
developers' userland apps. Non-prod mode is used for all other React
code: tests, DEV blocks, devtools extension, etc.
In production mode, in addiiton to flagging `String(value)` calls,
the rule will also flag `'' + value` or `value + ''` coercions that may
throw. The rule is smart enough to silence itself in the following
"will never throw" cases:
* When the coercion is wrapped in a `typeof` test that restricts to safe
(non-symbol, non-object) types. Example:
if (typeof value === 'string' || typeof value === 'number') {
thisWontReport('' + value);
}
* When what's being coerced is a unary function result, because unary
functions never return an object or a symbol.
* When the coerced value is a commonly-used numeric identifier:
`i`, `idx`, or `lineNumber`.
* When the statement immeidately before the coercion is a DEV-only
call to a function from shared/CheckStringCoercion.js. This call is a
no-op in production, but in DEV it will show a console error
explaining the problem, then will throw right after a long explanatory
code comment so that debugger users will have an idea what's going on.
The check function call must be in the following format:
if (__DEV__) {
checkXxxxxStringCoercion(value);
};
Manually disabling the rule is usually not necessary because almost all
prod use of the `'' + value` pattern falls into one of the categories
above. But in the rare cases where the rule isn't smart enough to detect
safe usage (e.g. when a coercion is inside a nested ternary operator),
manually disabling the rule will be needed.
The rule should also be manually disabled in prod error handling code
where `String(value)` should be used for coercions, because it'd be
bad to throw while building an error message or stack trace!
The prod and non-prod modes have differentiated error messages to
explain how to do a proper coercion in that mode.
If a production check call is needed but is missing or incorrect
(e.g. not in a DEV block or not immediately before the coercion), then
a context-sensitive error message will be reported so that developers
can figure out what's wrong and how to fix the problem.
Because string coercions are now handled by the `safe-string-coercion`
rule, the `no-primitive-constructor` rule no longer flags `String()`
usage. It still flags `new String(value)` because that usage is almost
always a bug.
* Add DEV-only string coercion check functions
This commit adds DEV-only functions to check whether coercing
values to strings using the `'' + value` pattern will throw. If it will
throw, these functions will:
1. Display a console error with a friendly error message describing
the problem and the developer can fix it.
2. Perform the coercion, which will throw. Right before the line where
the throwing happens, there's a long code comment that will help
debugger users (or others looking at the exception call stack) figure
out what happened and how to fix the problem.
One of these check functions should be called before all string coercion
of user-provided values, except when the the coercion is guaranteed not
to throw, e.g.
* if inside a typeof check like `if (typeof value === 'string')`
* if coercing the result of a unary function like `+value` or `value++`
* if coercing a variable named in a whitelist of numeric identifiers:
`i`, `idx`, or `lineNumber`.
The new `safe-string-coercion` internal ESLint rule enforces that
these check functions are called when they are required.
Only use these check functions in production code that will be bundled
with user apps. For non-prod code (and for production error-handling
code), use `String(value)` instead which may be a little slower but will
never throw.
* Add failing tests for string coercion
Added failing tests to verify:
* That input, select, and textarea elements with value and defaultValue
set to Temporal-like objects which will throw when coerced to string
using the `'' + value` pattern.
* That text elements will throw for Temporal-like objects
* That dangerouslySetInnerHTML will *not* throw for Temporal-like
objects because this value is not cast to a string before passing to
the DOM.
* That keys that are Temporal-like objects will throw
All tests above validate the friendly error messages thrown.
* Use `String(value)` for coercion in non-prod files
This commit switches non-production code from `'' + value` (which
throws for Temporal objects and symbols) to instead use `String(value)`
which won't throw for these or other future plus-phobic types.
"Non-produciton code" includes anything not bundled into user apps:
* Tests and test utilities. Note that I didn't change legacy React
test fixtures because I assumed it was good for those files to
act just like old React, including coercion behavior.
* Build scripts
* Dev tools package - In addition to switching to `String`, I also
removed special-case code for coercing symbols which is now
unnecessary.
* Add DEV-only string coercion checks to prod files
This commit adds DEV-only function calls to to check if string coercion
using `'' + value` will throw, which it will if the value is a Temporal
object or a symbol because those types can't be added with `+`.
If it will throw, then in DEV these checks will show a console error
to help the user undertsand what went wrong and how to fix the
problem. After emitting the console error, the check functions will
retry the coercion which will throw with a call stack that's easy (or
at least easier!) to troubleshoot because the exception happens right
after a long comment explaining the issue. So whether the user is in
a debugger, looking at the browser console, or viewing the in-browser
DEV call stack, it should be easy to understand and fix the problem.
In most cases, the safe-string-coercion ESLint rule is smart enough to
detect when a coercion is safe. But in rare cases (e.g. when a coercion
is inside a ternary) this rule will have to be manually disabled.
This commit also switches error-handling code to use `String(value)`
for coercion, because it's bad to crash when you're trying to build
an error message or a call stack! Because `String()` is usually
disallowed by the `safe-string-coercion` ESLint rule in production
code, the rule must be disabled when `String()` is used.
2021-09-28 01:05:07 +08:00
|
|
|
headSha = String(readFileSync(HEAD_DIR + '/COMMIT_SHA')).trim();
|
|
|
|
baseSha = String(readFileSync(BASE_DIR + '/COMMIT_SHA')).trim();
|
2021-02-04 00:29:51 +08:00
|
|
|
} catch {
|
|
|
|
warn(
|
|
|
|
"Failed to read build artifacts. It's possible a build configuration " +
|
|
|
|
'has changed upstream. Try pulling the latest changes from the ' +
|
|
|
|
'main branch.'
|
|
|
|
);
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2021-08-02 21:51:53 +08:00
|
|
|
// Disable sizeBot in a Devtools Pull Request. Because that doesn't affect production bundle size.
|
|
|
|
const commitFiles = [
|
|
|
|
...danger.git.created_files,
|
|
|
|
...danger.git.deleted_files,
|
|
|
|
...danger.git.modified_files,
|
|
|
|
];
|
|
|
|
if (
|
|
|
|
commitFiles.every(filename => filename.includes('packages/react-devtools'))
|
|
|
|
)
|
|
|
|
return;
|
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
const resultsMap = new Map();
|
|
|
|
|
|
|
|
// Find all the head (current) artifacts paths.
|
2021-09-22 00:06:15 +08:00
|
|
|
const headArtifactPaths = await glob('**/*.js', {cwd: 'build'});
|
2021-02-07 04:57:11 +08:00
|
|
|
for (const artifactPath of headArtifactPaths) {
|
|
|
|
try {
|
|
|
|
// This will throw if there's no matching base artifact
|
|
|
|
const baseSize = statSync(BASE_DIR + '/' + artifactPath).size;
|
|
|
|
const baseSizeGzip = gzipSize.fileSync(BASE_DIR + '/' + artifactPath);
|
|
|
|
|
|
|
|
const headSize = statSync(HEAD_DIR + '/' + artifactPath).size;
|
|
|
|
const headSizeGzip = gzipSize.fileSync(HEAD_DIR + '/' + artifactPath);
|
|
|
|
resultsMap.set(artifactPath, {
|
|
|
|
path: artifactPath,
|
|
|
|
headSize,
|
|
|
|
headSizeGzip,
|
|
|
|
baseSize,
|
|
|
|
baseSizeGzip,
|
|
|
|
change: (headSize - baseSize) / baseSize,
|
|
|
|
changeGzip: (headSizeGzip - baseSizeGzip) / baseSizeGzip,
|
|
|
|
});
|
|
|
|
} catch {
|
|
|
|
// There's no matching base artifact. This is a new file.
|
|
|
|
const baseSize = 0;
|
|
|
|
const baseSizeGzip = 0;
|
|
|
|
const headSize = statSync(HEAD_DIR + '/' + artifactPath).size;
|
|
|
|
const headSizeGzip = gzipSize.fileSync(HEAD_DIR + '/' + artifactPath);
|
|
|
|
resultsMap.set(artifactPath, {
|
|
|
|
path: artifactPath,
|
|
|
|
headSize,
|
|
|
|
headSizeGzip,
|
|
|
|
baseSize,
|
|
|
|
baseSizeGzip,
|
|
|
|
change: Infinity,
|
|
|
|
changeGzip: Infinity,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Check for base artifacts that were deleted in the head.
|
|
|
|
const baseArtifactPaths = await glob('**/*.js', {cwd: 'base-build'});
|
|
|
|
for (const artifactPath of baseArtifactPaths) {
|
|
|
|
if (!resultsMap.has(artifactPath)) {
|
|
|
|
const baseSize = statSync(BASE_DIR + '/' + artifactPath).size;
|
|
|
|
const baseSizeGzip = gzipSize.fileSync(BASE_DIR + '/' + artifactPath);
|
|
|
|
const headSize = 0;
|
|
|
|
const headSizeGzip = 0;
|
|
|
|
resultsMap.set(artifactPath, {
|
|
|
|
path: artifactPath,
|
|
|
|
headSize,
|
|
|
|
headSizeGzip,
|
|
|
|
baseSize,
|
|
|
|
baseSizeGzip,
|
|
|
|
change: -1,
|
|
|
|
changeGzip: -1,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
const results = Array.from(resultsMap.values());
|
|
|
|
results.sort((a, b) => b.change - a.change);
|
|
|
|
|
|
|
|
let criticalResults = [];
|
|
|
|
for (const artifactPath of CRITICAL_ARTIFACT_PATHS) {
|
|
|
|
const result = resultsMap.get(artifactPath);
|
|
|
|
if (result === undefined) {
|
|
|
|
throw new Error(
|
|
|
|
'Missing expected bundle. If this was an intentional change to the ' +
|
|
|
|
'build configuration, update Dangerfile.js accordingly: ' +
|
|
|
|
artifactPath
|
|
|
|
);
|
|
|
|
}
|
|
|
|
criticalResults.push(row(result));
|
|
|
|
}
|
|
|
|
|
|
|
|
let significantResults = [];
|
|
|
|
for (const result of results) {
|
|
|
|
// If result exceeds critical threshold, add to top section.
|
|
|
|
if (
|
|
|
|
(result.change > CRITICAL_THRESHOLD ||
|
|
|
|
0 - result.change > CRITICAL_THRESHOLD ||
|
|
|
|
// New file
|
|
|
|
result.change === Infinity ||
|
|
|
|
// Deleted file
|
|
|
|
result.change === -1) &&
|
|
|
|
// Skip critical artifacts. We added those earlier, in a fixed order.
|
|
|
|
!CRITICAL_ARTIFACT_PATHS.has(result.path)
|
|
|
|
) {
|
|
|
|
criticalResults.push(row(result));
|
|
|
|
}
|
|
|
|
|
|
|
|
// Do the same for results that exceed the significant threshold. These
|
|
|
|
// will go into the bottom, collapsed section. Intentionally including
|
|
|
|
// critical artifacts in this section, too.
|
|
|
|
if (
|
|
|
|
result.change > SIGNIFICANCE_THRESHOLD ||
|
|
|
|
0 - result.change > SIGNIFICANCE_THRESHOLD ||
|
|
|
|
result.change === Infinity ||
|
|
|
|
result.change === -1
|
|
|
|
) {
|
|
|
|
significantResults.push(row(result));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-02-04 00:29:51 +08:00
|
|
|
markdown(`
|
2021-02-07 04:57:11 +08:00
|
|
|
Comparing: ${baseSha}...${headSha}
|
|
|
|
|
|
|
|
## Critical size changes
|
2021-02-04 00:29:51 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
Includes critical production bundles, as well as any change greater than ${CRITICAL_THRESHOLD *
|
|
|
|
100}%:
|
2021-02-04 00:29:51 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
${header}
|
|
|
|
${criticalResults.join('\n')}
|
2021-02-04 00:29:51 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
## Significant size changes
|
2021-02-04 00:29:51 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
Includes any change greater than ${SIGNIFICANCE_THRESHOLD * 100}%:
|
2021-02-04 00:29:51 +08:00
|
|
|
|
2021-02-07 04:57:11 +08:00
|
|
|
${
|
|
|
|
significantResults.length > 0
|
|
|
|
? `
|
|
|
|
<details>
|
|
|
|
<summary>Expand to show</summary>
|
|
|
|
${header}
|
|
|
|
${significantResults.join('\n')}
|
|
|
|
</details>
|
|
|
|
`
|
|
|
|
: '(No significant changes)'
|
|
|
|
}
|
2021-02-04 00:29:51 +08:00
|
|
|
`);
|
2018-02-12 03:43:29 +08:00
|
|
|
})();
|