[Feature]: allow beforeMount/afterMount hooks to be defined without async

[mihkeleidast]

🚀 Feature Request

Currently, the beforeMount/afterMount hooks can only be defined as async functions, even though they don't necessarily do any async logic: https://github.com/microsoft/playwright/blob/main/packages/playwright-ct-react/hooks.d.ts#L19-L24

Even the example usage in the docs does not await anything in the hook body, so the async is not needed:

beforeMount<HooksConfig>(async ({ App, hooksConfig }) => {
  if (hooksConfig?.enableRouting)
    return <BrowserRouter><App /></BrowserRouter>;
});

The solution should be very easy to implement, only have to allow the callback functions to return non-promises, e.g. Promise<void | React.JSX.Element> | void | React.JSX.Element.

Runtime-wise it makes no difference, as awaiting a non-promise function works just as well.

Example

If there is no async logic in the hook, it should not need to be defined as an async function:

beforeMount<HooksConfig>(({ App, hooksConfig }) => {
  if (hooksConfig?.enableRouting)
    return <BrowserRouter><App /></BrowserRouter>;
});

Motivation

The current mandatory async function makes developer experience worse, as:

• if I define the hook without async, TypeScript will complain that it does not match the expected return type
• if I define the hook with async, but without an await inside, it trips up ESLint's require-await rule.

Happy to send a PR with my suggested change if this is accepted.