0

从文档中,findBy查询返回一个 Promise。但是,Promise.prototype.catch()在将它们与 async/await + try...catch 一起使用的情况下,使用这些查询似乎不起作用。

例如,“未找到”按预期记录在这里:

const { screen } = require('@testing-library/dom');

beforeAll(() => {
  document.body.innerHTML = `
    <header></header>
  `;
});

test('DOM', async () => {
  try {
    await screen.findByRole('aaaaa');
    console.log('found');
  } catch {
    console.log('not found');
  }
});

但是,这里没有记录任何内容:

test('DOM', () => {
  screen.findByRole('aaaaa')
    .then(() => {
      console.log('found');
    })
    .catch(() => {
      console.log('not found');
    });
});

是否有一个原因?

4

2 回答 2

1

您只需要返回,Promise以便您的测试框架(可能是 Jest)知道等待测试完成。否则 Jest 无法知道这个测试是异步的,使用async关键字隐式返回 a Promise

const { screen } = require('@testing-library/dom');

test('DOM', () => {
  return screen.findByRole('aaaaa')
    .then(() => {
      console.log('found');
    })
    .catch(() => {
      console.log('not found');
    });
});
于 2021-01-28T21:15:13.883 回答
0

你的两个例子是不等价的。该声明screen.findByRole('aaaaa')不在 Promise 中。将函数设置为异步会将函数包装在 Promise 中。然后,应该编写与 async await 等效的代码,如下所示。

除了处理“在 Promise 中抛出错误...”的要求之外,我还调整了代码以处理函数返回错误类型的情况。

    /// I added fake up implementations just for ilustration
    let screen={
      findByRole:
        ()=>new Promise((resolve, reject) => setTimeout(
          ()=>{reject(new Error('The error'))}
          ,2000
        ))
    }

    // You can comment above and uncomment to test different scenarios
    //let screen={findByRole:()=>new Error('The error')}
    //let screen={findByRole:()=>5}

    function test(desc, func)
    {
      func()
    }
    /////

    test('DOM', () => {
      new Promise(
        (resolve, reject) => {
          let result = screen.findByRole('aaaaa')
          result instanceof Error? reject(result):resolve(result)
        })
        .then(() => {
          console.log('found');
        })
        .catch((e) => {
          console.log('not found and capture error: ' + e.message);
        });
    });

于 2021-01-28T19:39:14.443 回答