Context

• we have test helpers that create an instance of user-event using setup
• the test helper is in place to render components with certain decorations, while allowing overrides of options
• we also do the setup call because we see it's recommended Is there some guidance on when to use `setup()` vs `userEvent.whatever`? user-event#1036

const { user } = renderWithTheme(<FooComponent/>, {
 userEventOptions: {
 delay: 1,
 },
 });

• we have flaky tests because await-async-events does not enforce missing awaits for user.click() (where user is created like shown above, only for the case of using exported APIs

import userEvent from "@testing-library/user-event";
userEvent.click // eslint complains

Problem

• we get flaky tests because of forgotten awaits
• we cannot enforce using await on click, type etc using TS and eslint without enabling require-await, which would be painful to enable

TS test helpers:

// import type { Asyncify } from "type-fest";
type UserSetupResult = Omit<
 ReturnType<typeof userEvent.setup>,
 "click" | "type"
> & {
 click: Asyncify<typeof userEvent.click>;
 type: Asyncify<typeof userEvent.type>;
 // ...
};

eslint config:

 // use base rule (instead of `@typescript-eslint/require-await` to speed up runs
 "require-await": "error",

• we can also not just return the raw userEvent object in our test helper in case of no override for options, because the setup call is recommended, as mentioned above

Question

Has anyone solved this?