是否可以禁用Jest中的特定React警告(使用Create React App)

fhity93d  于 2022-12-28  发布在  Jest
关注(0)|答案(5)|浏览(267)

最近,React开始对componentWillReceiveProps生命周期方法给出折旧警告,我使用的库使用了这个函数,维护者还没有更新他们的代码库。
目前,每当我运行测试时,无论是在开发阶段还是在CI阶段,我都会收到维护人员提供的每个组件的大约30行折旧警告。
是否有办法抑制这些警告(至少在开发过程中)?
编辑:
如果有机会,我愿意在我的文件中添加某些注解,以禁用来自特定软件包的警告:

// some line to disable warnings for this package
import { DateRangePicker } from 'react-dates';
jtoj6r0c

jtoj6r0c1#

如果要为所有测试禁用满足某些条件的所有警告,保留所有其他警告:

const originalWarn = console.warn.bind(console.warn)
beforeAll(() => {
  console.warn = (msg) => 
    !msg.toString().includes('componentWillReceiveProps') && originalWarn(msg)
})
afterAll(() => {
  console.warn = originalWarn
})

React代码库还包含expect(render(...)).toWarnDev(...),但Jest documentation中不包含,如果您想使用该特性,可能需要进行更多研究。

ca1c2owp

ca1c2owp2#

在概念上类似于前面的答案,但更简单一些:

jest.spyOn(global.console, 'warn').mockImplementationOnce((message) => {
  if (!message.includes('componentWillReceiveProps')) {
    global.console.warn(message);
  }
});

如果您想跨测试执行此操作,可以执行以下操作:

let consoleSpy;

beforeAll(() => {
  consoleSpy = jest.spyOn(global.console, 'warn').mockImplementation((message) => {
    // same implementation as above
});

afterAll(() => consoleSpy.mockRestore());
vsdwdz23

vsdwdz233#

@Aprillion答案的变体......
我想在所有测试中(在create-react-app应用程序中)抑制某些error消息。
我将以下内容添加到了我的setupTests.js

// This error is a bug fixed in React 18: https://github.com/facebook/react/pull/22114.
// Suppress it for all tests.
const BOGUS_UNMOUNTED_ERROR = (
  "Can't perform a React state update on an unmounted component."
);
const originalError = console.error.bind(console.error);
console.error = (...args) => !args.toString().includes(BOGUS_UNMOUNTED_ERROR)
  && originalError(...args);

我想最重要的区别是我在两个地方用(...args)替换了(msg),这样就传递了console.error()的所有参数。如果没有这个,我会在控制台错误消息中得到%s,这些消息应该用其他参数填充。

yyyllmsg

yyyllmsg4#

所以我找到了一种方法来修复任何使用react-codemod的库的这些警告。因为这个库不能在node_modules中工作,所以必须做一点小改动。
运行:

yarn add -D react-codemod
 open ./node_modules/react-codemod/bin/cli.js
  • 删除/注解行(72)〉
+ // args.push('--ignore-pattern=**/node_modules/**');

运行:

./node_modules/.bin/react-codemod rename-unsafe-lifecycles

对于这个问题的答案与库的路径,你要修复...
"应在哪些文件或目录上应用codemod?"

./node_modules/react-dates/lib/** // or any library with issue

在react-codemod支持node_modules库之前,这可能是一个临时修复。您也可以分叉库并删除该行,然后在CI管道中像这样使用它,这样就不会再收到类似的警告。

v1uwarro

v1uwarro5#

你可以把这一行加到任何显示警告的地方。我已经在VScode中试过了,所以我不确定它是否适用于其他地方。这会禁用下一行显示的任何警告。
//eslint禁用下一行

相关问题