我的组件有两个相似的表单（两个表单都有用户名/密码字段），以及两个带有文本“Submit”的Submit按钮。为了测试提交处理程序，我模拟了表单字段的type事件，然后单击提交按钮，如下所示：

it('test submit handler', async () => {
    const myProvider = ({children}) => <Provider store={store}>{children}</Provider>;
    render(<MyComponent />, {wrapper: myProvider});
    expect(await screen.findByText('username')).toBeTruthy();
    expect(await screen.findByText('password')).toBeTruthy();
    await userEvent.type(screen.getByLabelText('username'), 'someusername');
    await userEvent.type(screen.getByLabelText('password'), 'somepassword');
    fireEvent.click(screen.getByText('Submit'));
    await waitFor(() => expect(onSubmit).toBeCalledTimes(1));
  });
});

这样做会导致错误TestingLibraryElementError: Found multiple elements with the text: Submit。我查找了getBy*方法的文档，看起来它们要么解释了找到的第一个元素，要么在有多个元素的情况下，它们会抛出错误，这两个表单有不同的处理函数，我想测试一下提交时调用这两个函数的情况。访问第一次出现的Submit按钮的好方法是什么？
我尝试将getByText替换为findByText，但结果返回Promise { <pending> }，等待会导致上面提到的相同的TestingLibraryElementError错误。