Correctly fill window.matrixChat even when a Wrapper module is active

[dhenneke]

When a module with the WrapperLifecycle is active, some features don't work anymore. This affects for example the navigateTo feature of the Widget API. This is caused because the hashchange event listener is depending on the window.matrixChat variable, but that is not pointing to the MatrixChat component when a Wrapper component is added.

We now worked-around the issue by making the Wrapper a class and forwarding the relevant calls to the chat component in our module, but that is more a hack than a real solution.

From what I read, it is not recommended to use the return value of ReactDOM.render(...). It will only work for class components and will also not be available in the new React 18 APIs. Instead, I propose to just use Ref's which are the recommended way to receive a reference to a component instance.

I test this in the wrapper-test.tsx but am not sure if we need more tests. For now the window.matrixChat variable is not tested, though we probably could create a Cypress test for that if we want to(?)

Checklist

• Tests written for new code (and old code if feasible)
• Linter and other CI checks pass
• Sign-off given on the changes (see CONTRIBUTING.md)

---

Here's what your changelog entry will look like:

✨ Features

• Correctly fill window.matrixChat even when a Wrapper module is active (#26395). Contributed by @dhenneke.

Type: enhancement

[robintown]

Seems reasonable to me

[Johennes]

I've updated the time sheeting label on this pull request. Reviewers, please take this into account when filling your sheets.