diff --git a/ui/test/shared/components/SubSections.test.tsx b/ui/test/shared/components/SubSections.test.tsx new file mode 100644 index 0000000000..229d4938c6 --- /dev/null +++ b/ui/test/shared/components/SubSections.test.tsx @@ -0,0 +1,86 @@ +import {shallow} from 'enzyme' +import React from 'react' +import SubSections from 'src/shared/components/SubSections' +import SubSectionsTab from 'src/shared/components/SubSectionsTab' + +const Guava = () => { + return
+} + +const Mango = () => { + return
+} + +const Pineapple = () => { + return
+} + +const guavaURL = 'guava' +const mangoURL = 'mango' +const pineappleURL = 'pineapple' + +const defaultProps = { + router: { + push: () => {}, + replace: () => {}, + go: () => {}, + goBack: () => {}, + goForward: () => {}, + setRouteLeaveHook: () => {}, + isActive: () => {}, + }, + sourceID: 'fruitstand', + parentUrl: 'fred-the-fruit-guy', + activeSection: guavaURL, + sections: [ + { + url: guavaURL, + name: 'Guava', + component: , + enabled: true, + }, + { + url: mangoURL, + name: 'Mango', + component: , + enabled: true, + }, + { + url: pineappleURL, + name: 'Pineapple', + component: , + enabled: false, + }, + ], +} + +const setup = (override?: {}) => { + const props = { + ...defaultProps, + ...override, + } + + return shallow() +} + +describe('SubSections', () => { + describe('render', () => { + it('renders the currently active tab', () => { + const wrapper = setup() + const content = wrapper.dive().find({'data-test': 'subsectionContent'}) + + expect(content.find(Guava).exists()).toBe(true) + }) + + it('only renders enabled tabs', () => { + const wrapper = setup() + const nav = wrapper.dive().find({'data-test': 'subsectionNav'}) + + const tabs = nav.find(SubSectionsTab) + + tabs.forEach(tab => { + expect(tab.exists()).toBe(tab.props().section.enabled) + }) + }) + }) +})