停止来自测试库的大量错误输出

编程问答 2022-06-12

问题描述

我爱testing-library，已经在React项目中使用了很多，现在我正试图在Angular项目中使用它-但是我一直在努力处理巨大的错误输出，包括HTML渲染的文本。这不仅通常不起作用（我找不到元素，这里是没有的HTML）；但是如果在调试模式下运行，它通常会在有趣的行之前被截断。

我只是将它作为标准Angular Karma + Jasmine设置的库添加了。

我敢肯定，如果HTML输出导致控制台窗口假脱机使用了很长时间，那么您可以说正在测试的组件太大，但是我在Protractor中进行了很多集成测试，它们都是 SO慢：（。

解决方法

我想说最好的解决方案是使用configure方法并为getElementError传递自定义函数，该函数可以完成您想要的操作。

您可以在此处阅读有关配置的信息：https://testing-library.com/docs/dom-testing-library/api-configuration

一个例子可能像这样：

configure({
  getElementError: (message: string,container) => {
    const error = new Error(message);
    error.name = 'TestingLibraryElementError';
    error.stack = null;
    return error;
  },});

然后，您可以将其放在任何单个测试文件中，或使用Jest的setupFiles或setupFilesAfterEnv配置选项使其在全局运行。

,

我假设您在项目中使用rtl开玩笑。

我个人不会关闭它，因为它在那里可以为我们提供帮助，但是每个人都有办法，如果您有自己的理由，那么就足够公平了。

1。如果您要为特定测试禁用错误，则可以模拟console.error。 

    it('disable error example',() => {

  const errorObject = console.error; //store the state of the object
  console.error = jest.fn(); // mock the object

  // code

  //assertion (expect)

  console.error = errorObject; // assign it back so you can use it in the next test
});

2。如果要在所有测试中都将其静音，则可以使用jest --silent CLI选项。检查docs

以上内容甚至可能会禁用由rtl完成的DOM打印，我不确定，因为我还没有尝试过，但是如果您查看我链接的文档，它会说

“防止通过控制台打印消息来进行测试。”

现在，几乎可以肯定的是，如果以上操作无效，则除了DOM建议外，所有其他功能都应禁用。在这种情况下，您可以查看react-testing-library's源代码，并找出用于这些打印语句的内容。是console.log吗？是console.warn吗？当您了解到这一点后，就可以像上面的选项1一样对其进行模拟。

更新

经过一番挖掘，我发现所有testing-library DOM打印都基于prettyDOM()；

虽然无法禁用prettyDOM()，但您可以将行数限制为0，这只会给您错误消息和消息下方的三个点...。

这是示例打印输出，我搞砸了：

    TestingLibraryElementError: Unable to find an element with the text: Hello ther. This could be because the text is broken up by multiple elements. In this case,you can provide a function for your text matcher to make your matcher more flexible.

...

您需要做的就是在执行测试套件之前传入一个环境变量，例如，使用npm脚本，它看起来像：

DEBUG_PRINT_LIMIT=0 npm run test

Here is the doc

更新2 ：

根据OP的FR on github，这也可以在不注入全局变量来限制PrettyDOM行输出的情况下实现（如果在其他地方使用的话）。 getElementError配置选项需要更改：

dom-testing-library / src / config.js 

     // called when getBy* queries fail. (message,container) => Error 
 getElementError(message,container) { 
   const error = new Error( 
     [message,prettyDOM(container)].filter(Boolean).join('\n\n'),) 
   error.name = 'TestingLibraryElementError' 
   return error 
 },

The callstack can also be removed

,

您可以通过使用config设置DOM测试库消息构建功能来更改消息的构建方式。在我的Angular项目中，我将此添加到了test.js：

configure({
  getElementError: (message: string,});

在这里回答：https://github.com/testing-library/dom-testing-library/issues/773由https://github.com/wyze。

angular-testing-libraryreact-testing-library