diff --git a/components/molecule/tabs/src/components/MoleculeTabs.js b/components/molecule/tabs/src/components/MoleculeTabs.js index 395dccbff..2f2b4f500 100644 --- a/components/molecule/tabs/src/components/MoleculeTabs.js +++ b/components/molecule/tabs/src/components/MoleculeTabs.js @@ -46,7 +46,8 @@ const MoleculeTabs = ({ type = TYPES.HORIZONTAL, variant = VARIANTS.CLASSIC, tabsJustifyContent = TABS_JUSTIFY_CONTENT.FLEX_START, - keepTabsContentMounted = false + keepTabsContentMounted = false, + ...props }) => { const className = cx(BASE_CLASS, { [`${BASE_CLASS}--${variant}`]: variant, @@ -136,15 +137,22 @@ const MoleculeTabs = ({ numTab, id, onChange, - ref: el => (tabRefs.current[index] = el) // Assign ref to each MoleculeTab + ref: el => (tabRefs.current[index] = el), // Assign ref to each MoleculeTab + key: index }) }) - const tabContent = childrenArray.reduce((activeContent, child) => { + const tabContent = childrenArray.reduce((activeContent, child, currentIndex) => { if (child) { const {children: childrenChild, active, numTab} = child.props activeContent.push( - + {childrenChild} ) @@ -153,7 +161,7 @@ const MoleculeTabs = ({ }, []) return ( -
+
    { expect(container.innerHTML).to.not.have.lengthOf(0) }) - it('should NOT extend classNames', () => { + it('should extend classNames', () => { // Given const props = { className: 'extended-classNames' @@ -90,7 +90,7 @@ describe(json.name, () => { const findClassName = findSentence(props.className) // Then - expect(findClassName(container.innerHTML)).to.be.null + expect(findClassName(container.innerHTML)).to.not.be.null }) it('should display the active content', () => {