carbon-design-system / carbon-addons-cloud-react

[DEPRECATED] React components for the Cloud Add-on
http://cloud.carbondesignsystem.com/
Apache License 2.0
13 stars 23 forks source link

InteriorLeftNavItem doesn't execute onClick prop #70

Open austichen opened 5 years ago

austichen commented 5 years ago

Detailed description

Describe in detail the issue you're having.

If I pass an onClick function as a prop to the InteriorLeftNavItem component, it doesn't actually get called when I click the nav item. The docs for this component list onClick as a supported prop, so I believe it should be working. Docs: http://cloud.carbondesignsystem.com/?selectedKind=InteriorLeftNav&selectedStory=Default&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybook%2Factions%2Factions-panel

Is this a feature request (new component, new icon), a bug, or a general issue?

Bug

Is this issue related to a specific component?

InteriorLeftNavItem

What did you expect to happen? What happened instead? What would you like to see changed?

Expected: the function passed as an onClick prop should be run when I click the nav item Actual: the function does not run when I click the nav item See changed: the onClick function should be called when I click on the nav item

What browser are you working in?

Chrome 72

What version of the Carbon Design System are you using?

"carbon-addons-cloud": "^3.1.2",
"carbon-addons-cloud-react": "^1.8.0",
"carbon-addons-cloud-vanilla": "^1.0.0",
"carbon-components": "^9.68.10",
"carbon-components-react": "^6.86.0"

What offering/product do you work on? Any pressing ship or release dates we should be aware of?

open toolchains, no release dates

Steps to reproduce the issue

https://codesandbox.io/s/llp45xko09

  1. Click on NavItem Link 1. Observe that no alert appears on the page, despite the onClick function firing an alert.
  2. Click on Normal Link. Observe that the alert appears on the page.

Additional information

image I believe this is happening because the _ref.onClick item in the image above isn't actually the onClick prop that is passed to the component.

Rather, it's a different onClick function that is passed to this component from its parent component, InteriorLeftNav: image

As a result, when you click the nav item, the onClick function that you passed as a prop doesn't end up running. The function that actually ends up running is this function, from the InteriorLeftNav component. image