[Slider] Styled slider does not fire onChangeCommitted

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

When holding down the mouse on the slider thumb and moving mouse back and forth on the slider, nothing happens. The slider thumb doesn’t follow the mouse and onChangeCommitted isn’t fired after mouse is released from thumb.

Expected Behavior 🤔

When holding down the mouse on the slider thumb and moving mouse back and forth on the slider, onChangeCommitted should fire after mouse is let go.

Steps to Reproduce 🕹

https://codesandbox.io/s/material-demo-forked-2jm1n?file=/demo.js

Steps:

The top slider is styled and will not allow the user to drag the slider thumb. The bottom slider is a non-styled slider and the thumb moves with the mouse as expected. The exact same thing happens when using typescript.

Context 🔦

I’m trying to style/theme the mark labels on the slider, but when I used a styled component, onChangeCommitted fails to fire.

Your Environment 🌎

`npx @mui/envinfo`

  Building and deploying in electron
  System:
    OS: Windows 10 10.0.19043
  Binaries:
    Node: 14.15.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.14.8 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: Not Found
    Edge: Spartan (44.19041.1266.0), Chromium (95.0.1020.30)
  npmPackages:
    @emotion/react: ^11.4.1 => 11.4.1
    @emotion/styled: ^11.3.0 => 11.3.0
    @mui/icons-material: ^5.0.0 => 5.0.0
    @mui/lab: ^5.0.0-alpha.50 => 5.0.0-alpha.50
    @mui/material: ^5.1.0 => 5.1.0
    @mui/types:  7.1.0
    @types/react: ^17.0.0 => 17.0.21
    react: ^17.0.0 => 17.0.2
    react-dom: ^17.0.0 => 17.0.2
    typescript: ^4.3.2 => 4.4.3

[FalsePsyche]

I really appreciate the clarification. When I build a new sandbox with the newest versions of MUI, I don’t have the problem described in the OP, the slider component works as expected. Here is a link https://codesandbox.io/s/floral-butterfly-l2ucs?file=/src/App.tsx

The issue is I’m still seeing the problem in my local electron project. Currently the only work around is to remove the styled component and just use the default Slider from MUI. Which removes the theme, but allows the user to drag the slider around. Any advice?

[abhinav-22-tech]

Your system material UI working on version 5. But your provided code working on version 4. If you are using version 5. Please take a reference from this: https://codesandbox.io/s/material-demo-forked-lgho0