[material-ui][Timeline] Not working with server-side in an App Router Next.js project

[OmkarOza]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

No response

Current behavior 😯

When using the Timeline component in NEXT.JS(App Router) , I have observed that it functions correctly on the client side but does not seem to work as expected on the server side. In contrast, other Material-UI (MUI) components exhibit consistent behavior, functioning seamlessly on both the client and server sides.

Expected behavior 🤔

It is expected that the Timeline component should operate smoothly on the server side, just like other MUI components, without encountering any issues.

Context 🔦

No response

Your environment 🌎

npx @mui/envinfo

  System:
    OS: Windows 10 10.0.19045
  Binaries:
    Node: 20.9.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 10.1.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: Not Found
    Edge: Chromium (120.0.2210.77)
  npmPackages:
    @emotion/react: ^11.11.1 => 11.11.1
    @emotion/styled: ^11.11.0 => 11.11.0
    @mui/base:  5.0.0-beta.24
    @mui/core-downloads-tracker:  5.14.18
    @mui/lab: 5.0.0-alpha.153 => 5.0.0-alpha.153
    @mui/material: ^5.14.18 => 5.14.18
    @mui/private-theming:  5.14.18
    @mui/styled-engine:  5.14.18
    @mui/system:  5.14.18
    @mui/types:  7.2.9
    @mui/utils:  5.14.18
    @types/react:  18.2.39
    react: ^18.2.0 => 18.2.0
    react-dom: ^18.2.0 => 18.2.0
    typescript: ~5.3.2 => 5.3.2

[DiegoAndai]

Hey @OmkarOza, thanks for the report! Please provide a minimal reproduction test case with the latest version. This would help a lot. A live example would be perfect. Thank you!

[OmkarOza]

Hey @DiegoAndai, I am using the same code, which can be found at https://codesandbox.io/p/sandbox/interesting-antonelli-y554j2?file=%2Fsrc%2FDemo.tsx, but when I try to use it with NEXT.JS (App Router) on the server side, it doesn't work as expected.

[DiegoAndai]

I opened #40358 to see if that fixes it. May I ask you to try it out? You can do so by pointing to that PR's build in package.json:

 "dependencies": {
-  "@mui/lab": "latest", // or whatever version you had
+  "@mui/lab": "https://pkg.csb.dev/mui/material-ui/commit/6df98ce0/@mui/material",
 },