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?
Click on NavItem Link 1. Observe that no alert appears on the page, despite the onClick function firing an alert.
Click on Normal Link. Observe that the alert appears on the page.
Additional information
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:
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.
Detailed description
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 listonClick
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-panelBug
InteriorLeftNavItem
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: theonClick
function should be called when I click on the nav itemChrome 72
open toolchains, no release dates
Steps to reproduce the issue
https://codesandbox.io/s/llp45xko09
NavItem Link 1
. Observe that no alert appears on the page, despite theonClick
function firing an alert.Normal Link
. Observe that the alert appears on the page.Additional information
I believe this is happening because the
_ref.onClick
item in the image above isn't actually theonClick
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:
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.