Material UI Errors in React Toolbar Components

[JanReichelt]

Summary

The React Toolbar Component (e.g. the CommandButton) throws Errors, because a disabled Button is wrapped with a Tooltip (see screenshot), which directly disables it (because pointer events are prohibited this way).
I experienced it with the prebuilt react undo and redo buttons, but it should apply to all other Toolbar buttons as well.

Versions

(used in the example repo)

    "remirror": "^2.0.10"
    "@remirror/pm": "^2.0.0",
    "@remirror/react": "^2.0.10",

Steps to reproduce

Just use the 5 Minute Tutorial boilerplate and add a MarkdownToolbar from @remirror/react. Or:
Example Git-Repo: https://github.com/JanReichelt/remirror-mui-error

Inspect the browser console to see the mentioned errors.

Possible Solution

It is proposed here that the Button could be wrapped in an intermediary html tag to re-enable pointer events as a quick fix.

Screenshot(s)

[NotNikita]

Interesting, i also have MUI error in remirror, but in node_modules:

[peter-popluhar]

Hello. Any progress on this issue?
Im having same problem, and it throws a lot of warnings in jest test runner as well.
codesanndbox: https://codesandbox.io/p/sandbox/silly-mayer-70ehsh?selection=%5B%7B%22endColumn%22%3A10%2C%22endLineNumber%22%3A5%2C%22startColumn%22%3A10%2C%22startLineNumber%22%3A5%7D%5D&file=%2Fcomponents%2FRemirror.tsx

page: https://70ehsh-3000.preview.csb.app/ (open console in browser, and reload page. warnings should be present)

[kr1stjans]

Same issue here

[ajspetner]

I just submitted the above PR which implements the proposal referenced by @JanReichelt . This fix also makes tooltips work for inactive buttons (which is the typical behavior seen in most apps).