Skip to content

[chip] clickable={false} option still executes onClick method #24611

Description

@asjustis

Hi,

  • 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 😯

I am trying to conditionally render my Chip component to be clickable or read-only. When I set clickable={false}, it still executes onClick when pressed.

Expected Behavior 🤔

I would naturally expect that both UI and the method execution would be disabled by the clickable={false} option.

Steps to Reproduce 🕹

I added a quick sandbox example here to reproduce: https://codesandbox.io/s/vigilant-water-2yygy?file=/src/App.js

Steps:

  1. add onClick method
  2. add clickable={false} line
  3. click on the tag in the UI
  4. it still executes the onClick() method

Your Environment 🌎

Using latest 4.11.3 core version:

    OS: macOS Mojave 10.14.5
  Binaries:
    Node: 10.21.0 - /usr/local/bin/node
    Yarn: Not Found
    npm: 6.14.4 - /usr/local/bin/npm
  Browsers:
    Chrome: 88.0.4324.96
    Edge: Not Found
    Firefox: 83.0
    Safari: 12.1.1
  npmPackages:
    @material-ui/core: ^4.11.3 => 4.11.3 
    @material-ui/icons: ^4.5.1 => 4.5.1 
    @material-ui/lab: ^4.0.0-alpha.38 => 4.0.0-alpha.38 
    @material-ui/styles:  4.11.3 
    @material-ui/system:  4.11.3 
    @material-ui/types:  5.1.0 
    @material-ui/utils:  4.7.1 
    @types/react:  16.9.11 
    react: ^16.9.0 => 16.9.0 
    react-dom: ^16.9.0 => 16.9.0 

Metadata

Metadata

Assignees

No one assigned

    Labels

    docsImprovements or additions to the documentation.good first issueGreat for first contributions. Enable to learn the contribution process.scope: chipChanges related to the chip.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions