question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[SwitchBase] Ignores FormControl disabled state

See original GitHub issue
  • 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 the [FormControl] component is rendered with the disabled={true} prop, the children [Checkbox], [Radio], and [Switch] components remains enabled

Expected Behavior 🤔

All the children components of [FormControl] that use [FormControlContext] should be disabled if the [FormControl] components is disabled

Steps to Reproduce 🕹

This sandbox demonstrates the issue that appeared from v4.6.1 due to this pull request.

This sandbox clearly shows that everything was working correctly in v4.6.0

Context 🔦

The [SwitchBase] component checks whether it has own disabled prop. If it doesn’t have it, the disabled from [FormControlContext] is used (please see source code)

The issue is that the [Checkbox], [Radio], and [Switch] components were configured to use the disabled prop set to false by default (please see checkbox, radio, and switch changes).

Therefore, the [SwitchBase] component never receives the disabled={undefined} prop, which leads to non-usage of the disabled value from [FormControlContext]

Your Environment 🌎

Tech Version
Material-UI v4.8.3
React v16.12.0

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
mbrookescommented, Jan 19, 2020

IIRC, it should be possible to add it to each component’s propValues in framerConfig.js. Adding it to the component directly was intended to fix the problem “at source”, while also allowing the default to be documented in the prop docs; but clearly it backfired in this instance!

1reaction
rostislavbobocommented, Jan 19, 2020

If you don’t mind, I’ll take it over

Read more comments on GitHub >

github_iconTop Results From Across the Web

[SwitchBase] Ignores FormControl disabled state · Issue #19288
The issue is present in the latest release. I have searched the issues of this repository and believe that this is not a...
Read more >
Certain angular reactive form elements won't react to ...
The visible fields all get updated with their proper new value. However, this is not the case with the disabled state. Every field...
Read more >
Disabling Form Controls When Working With Reactive Forms ...
You can enable/disable a form control by using the following ways: Instantiate a new FormControl with the disabled property set to true. FormControl({value:...
Read more >
Switch API - Material UI - MUI
The default checked state. Use when the component is not controlled. disabled, bool, false. If true , the component is disabled. disableRipple, bool,...
Read more >
reactive_forms | Flutter Package - Pub.dev
When a control is disabled it is exempt from validation checks and excluded from the aggregate value of any parent. Its status is...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found