我正在使用Karma和mocha来测试我的React组件。当 PropTypes 不匹配时,我会显示一些警告。然而,让这些警告导致实际错误真的很有趣,以便跟踪测试并修复它。
你知道这是怎么做到的吗?
您可以用console.warn
自己的方法替换该方法,并在提供的消息与特定模式匹配时抛出。
let warn = console.warn;
console.warn = function(warning) {
if (/(Invalid prop|Failed propType)/.test(warning)) {
throw new Error(warning);
}
warn.apply(console, arguments);
};
Small improvements to accepted answer: console.error
instead of console.warn
as spain-train mentioned, added 'Failed prop type' to regex, as only then it works with React 15.3.1, and made the code more strict eslint friendly.
const error = console.error;
console.error = function(warning, ...args) {
if (/(Invalid prop|Failed prop type)/.test(warning)) {
throw new Error(warning);
}
error.apply(console, [warning, ...args]);
};
2021 年更新:
const consoleError = console.error;
console.error = function (...args) {
if (/(Invalid prop|Failed propType|Failed .+ type)/.test(args[0])) {
const errorMessage = args.reduce((p, c) => p.replace(/%s/, c));
throw new Error(errorMessage);
}
consoleError.apply(console, args);
};
Failed prop type
现在是Failed %s type: %s%s
。它使用字符串替换来写入控制台。这是 React 中的代码。