@primer/components 32.0.0-rc.7200a6a6 → 32.0.0

package/src/__tests__/Position.test.tsx

@@ -1,117 +0,0 @@
-import React from 'react'
-import {Box, Position, Absolute, Fixed, Relative, Sticky} from '..'
-import {render, behavesAsComponent, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-expect.extend(toHaveNoViolations)
-
-describe('position components', () => {
-  describe('Absolute', () => {
-    behavesAsComponent({Component: Absolute})
-
-    checkExports('Position', {
-      default: Position,
-      Absolute,
-      Fixed,
-      Relative,
-      Sticky
-    })
-
-    it('should have no axe violations', async () => {
-      const {container} = HTMLRender(<Absolute />)
-      const results = await axe(container)
-      expect(results).toHaveNoViolations()
-      cleanup()
-    })
-
-    it('sets position: absolute', () => {
-      expect(render(<Absolute />)).toHaveStyleRule('position', 'absolute')
-    })
-
-    it('can render other components with the as prop', () => {
-      const result = render(
-        <Absolute as={Box} borderWidth="1px" borderStyle="solid" borderColor="border.default" borderRadius={2} />
-      )
-      expect(result).toHaveStyleRule('position', 'absolute')
-      expect(result).toHaveStyleRule('border-width', '1px')
-      expect(result).toHaveStyleRule('border-style', 'solid')
-    })
-  })
-
-  describe('Fixed', () => {
-    behavesAsComponent({Component: Fixed})
-
-    it('respects the "as" prop', () => {
-      expect(render(<Fixed as="span" />).type).toEqual('span')
-    })
-
-    it('should have no axe violations', async () => {
-      const {container} = HTMLRender(<Fixed />)
-      const results = await axe(container)
-      expect(results).toHaveNoViolations()
-      cleanup()
-    })
-
-    it('sets position: fixed', () => {
-      expect(render(<Fixed />)).toHaveStyleRule('position', 'fixed')
-    })
-
-    it('can render other components with the as prop', () => {
-      const result = render(
-        <Fixed as={Box} borderWidth="1px" borderStyle="solid" borderColor="border.default" borderRadius={2} />
-      )
-      expect(result).toHaveStyleRule('position', 'fixed')
-      expect(result).toHaveStyleRule('border-width', '1px')
-      expect(result).toHaveStyleRule('border-style', 'solid')
-    })
-  })
-
-  describe('Relative', () => {
-    behavesAsComponent({Component: Relative})
-
-    it('should have no axe violations', async () => {
-      const {container} = HTMLRender(<Relative />)
-      const results = await axe(container)
-      expect(results).toHaveNoViolations()
-      cleanup()
-    })
-
-    it('sets position: relative', () => {
-      expect(render(<Relative />)).toHaveStyleRule('position', 'relative')
-    })
-
-    it('can render other components with the as prop', () => {
-      const result = render(
-        <Relative as={Box} borderWidth="1px" borderStyle="solid" borderColor="border.default" borderRadius={2} />
-      )
-      expect(result).toHaveStyleRule('position', 'relative')
-      expect(result).toHaveStyleRule('border-width', '1px')
-      expect(result).toHaveStyleRule('border-style', 'solid')
-    })
-  })
-
-  describe('Sticky', () => {
-    behavesAsComponent({Component: Sticky})
-
-    it('should have no axe violations', async () => {
-      const {container} = HTMLRender(<Sticky />)
-      const results = await axe(container)
-      expect(results).toHaveNoViolations()
-      cleanup()
-    })
-
-    it('sets position: sticky', () => {
-      expect(render(<Sticky />)).toHaveStyleRule('position', 'sticky')
-    })
-
-    it('can render other components with the as prop', () => {
-      const result = render(
-        <Sticky as={Box} borderWidth="1px" borderStyle="solid" borderColor="border.default" borderRadius={2} />
-      )
-      expect(result).toHaveStyleRule('position', 'sticky')
-      expect(result).toHaveStyleRule('border-width', '1px')
-      expect(result).toHaveStyleRule('border-style', 'solid')
-    })
-  })
-})

package/src/__tests__/ProgressBar.test.tsx

@@ -1,40 +0,0 @@
-import React from 'react'
-import {ProgressBar} from '..'
-import {render, behavesAsComponent, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-expect.extend(toHaveNoViolations)
-
-describe('ProgressBar', () => {
-  behavesAsComponent({Component: ProgressBar})
-
-  checkExports('ProgressBar', {
-    default: ProgressBar
-  })
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(<ProgressBar progress={80} barSize="small" />)
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-    cleanup()
-  })
-
-  it('respects the "barSize" prop', () => {
-    expect(render(<ProgressBar progress={80} barSize="small" />)).toHaveStyleRule('height', '5px')
-    expect(render(<ProgressBar progress={80} barSize="default" />)).toHaveStyleRule('height', '8px')
-    expect(render(<ProgressBar progress={80} barSize="large" />)).toHaveStyleRule('height', '10px')
-  })
-
-  it('respects the "inline" prop', () => {
-    expect(render(<ProgressBar progress={80} inline />)).toHaveStyleRule('display', 'inline-flex')
-  })
-
-  it('respects the "width" prop', () => {
-    expect(render(<ProgressBar progress={80} inline width="100px" />)).toHaveStyleRule('width', '100px')
-  })
-
-  it('respects the "progress" prop', () => {
-    expect(render(<ProgressBar progress={80} />)).toMatchSnapshot()
-  })
-})

package/src/__tests__/SelectMenu.test.tsx

@@ -1,142 +0,0 @@
-import React from 'react'
-import {SelectMenu, Button} from '..'
-import {mount, render, renderRoot, COMPONENT_DISPLAY_NAME_REGEX, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-import {SelectMenuModalProps, SelectMenuItemProps, SelectMenuTabProps} from '../SelectMenu'
-expect.extend(toHaveNoViolations)
-
-const BasicSelectMenu = ({
-  onClick,
-  as,
-  align = 'left'
-}: {
-  onClick?: SelectMenuItemProps['onClick']
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  as?: any
-  align?: SelectMenuModalProps['align']
-}) => {
-  return (
-    <SelectMenu as={as}>
-      <Button as="summary">Projects</Button>
-      <SelectMenu.Modal title="Projects" align={align}>
-        <SelectMenu.List>
-          <SelectMenu.Item selected href="#">
-            Primer Components bugs
-          </SelectMenu.Item>
-          <SelectMenu.Item onClick={onClick} as={as} data-test="menu-item" href="#">
-            Primer Components roadmap
-          </SelectMenu.Item>
-          <SelectMenu.Divider>stuff</SelectMenu.Divider>
-          <SelectMenu.Item href="#"> Project 3</SelectMenu.Item>
-          <SelectMenu.Item href="#">Project 4</SelectMenu.Item>
-          <SelectMenu.Footer>footer</SelectMenu.Footer>
-        </SelectMenu.List>
-      </SelectMenu.Modal>
-    </SelectMenu>
-  )
-}
-
-const MenuWithTabs = ({onClick}: {onClick?: SelectMenuTabProps['onClick']}) => {
-  return (
-    <SelectMenu initialTab="Organization">
-      <Button as="summary">Projects</Button>
-      <SelectMenu.Modal title="Projects">
-        <SelectMenu.Tabs>
-          <SelectMenu.Tab index={0} onClick={onClick} data-test="repo-tab" tabName="Repository" />
-          <SelectMenu.Tab index={1} tabName="Organization" />
-        </SelectMenu.Tabs>
-        <SelectMenu.TabPanel tabName="Repository">
-          <SelectMenu.Item href="#">Primer Components bugs</SelectMenu.Item>
-          <SelectMenu.Item href="#">Primer Components roadmap</SelectMenu.Item>
-          <SelectMenu.Item href="#"> Project 3</SelectMenu.Item>
-          <SelectMenu.Item href="#">Project 4</SelectMenu.Item>
-        </SelectMenu.TabPanel>
-        <SelectMenu.TabPanel tabName="Organization">
-          <SelectMenu.Item href="#"> Project 2</SelectMenu.Item>
-        </SelectMenu.TabPanel>
-        <SelectMenu.Footer>Showing 3 of 3</SelectMenu.Footer>
-      </SelectMenu.Modal>
-    </SelectMenu>
-  )
-}
-
-describe('SelectMenu', () => {
-  checkExports('SelectMenu', {
-    default: SelectMenu
-  })
-
-  for (const Comp of [
-    SelectMenu.List,
-    SelectMenu.Divider,
-    SelectMenu.Filter,
-    SelectMenu.Item,
-    SelectMenu.List,
-    SelectMenu.Modal,
-    SelectMenu.Tabs,
-    SelectMenu.Tab,
-    SelectMenu.TabPanel,
-    SelectMenu.Header
-  ]) {
-    it('sets a valid displayName', () => {
-      expect(Comp.displayName).toMatch(COMPONENT_DISPLAY_NAME_REGEX)
-    })
-  }
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(<BasicSelectMenu />)
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-    cleanup()
-  })
-
-  it('does not allow the "as" prop on SelectMenu', () => {
-    const component = mount(<BasicSelectMenu as="span" />)
-    expect(component.find('details').length).toEqual(1)
-  })
-
-  it('shows correct initial tab', () => {
-    const testInstance = renderRoot(<MenuWithTabs />)
-    expect(testInstance.findByProps({'aria-selected': true}).props.children).toBe('Organization')
-  })
-
-  it('clicking on a tab opens the tab', () => {
-    const component = mount(<MenuWithTabs />)
-    const tab = component.find("[data-test='repo-tab']").first()
-    tab.simulate('click')
-    expect(tab.getDOMNode().attributes.getNamedItem('aria-selected')).toBeTruthy()
-  })
-
-  it('selected items have aria-checked', () => {
-    const testInstance = renderRoot(<BasicSelectMenu />)
-    expect(testInstance.findByProps({'aria-checked': true}).props.children[1]).toBe('Primer Components bugs')
-  })
-
-  it('clicking on a list item calls user provided onClick handler', () => {
-    const mockClick = jest.fn()
-    const component = mount(<BasicSelectMenu onClick={mockClick} />)
-    const item = component.find("[data-test='menu-item']").first()
-    item.simulate('click')
-    expect(mockClick.mock.calls.length).toEqual(1)
-  })
-
-  it('clicking on a tab calls user provided onClick handler', () => {
-    const mockClick = jest.fn()
-    const component = mount(<MenuWithTabs onClick={mockClick} />)
-    const item = component.find("[data-test='repo-tab']").first()
-    item.simulate('click')
-    expect(mockClick.mock.calls.length).toEqual(1)
-  })
-
-  it('clicking on an item closes the modal', () => {
-    const component = mount(<BasicSelectMenu />)
-    const item = component.find("[data-test='menu-item']").first()
-    item.simulate('click')
-    expect(component.getDOMNode().attributes.getNamedItem('open')).toBeFalsy()
-  })
-
-  it('right-aligned modal has right: 0px', () => {
-    expect(render(<BasicSelectMenu align="right" />)).toMatchSnapshot()
-  })
-})

package/src/__tests__/SelectMenu.types.test.tsx

@@ -1,37 +0,0 @@
-import React from 'react'
-import SelectMenu from '../SelectMenu'
-
-export function shouldAcceptCallWithNoProps() {
-  return <SelectMenu />
-}
-
-export function shouldNotAcceptSystemProps() {
-  return (
-    <>
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu backgroundColor="lightgray" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.List backgroundColor="lightgreen" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.Divider backgroundColor="lightgrey" />
-      {/* This will not error for now, but once TextInputProps is fixed, a ts-expect-error can be added */}
-      <SelectMenu.Filter backgroundColor="lightpink" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.Footer backgroundColor="lightsalmon" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.Item backgroundColor="lightseagreen" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.Modal backgroundColor="lightskyblue" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.Tabs backgroundColor="lightslategray" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.Tab backgroundColor="lightslategrey" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.TabPanel backgroundColor="lightsteelblue" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.Header backgroundColor="lightyellow" />
-      {/* @ts-expect-error system props should not be accepted */}
-      <SelectMenu.LoadingAnimation backgroundColor="lightcyan" />
-    </>
-  )
-}

package/src/__tests__/SelectPanel.test.tsx

@@ -1,63 +0,0 @@
-import {cleanup, render as HTMLRender} from '@testing-library/react'
-import 'babel-polyfill'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import React from 'react'
-import theme from '../theme'
-import {SelectPanel} from '../SelectPanel'
-import {behavesAsComponent, checkExports} from '../utils/testing'
-import {BaseStyles, SSRProvider, ThemeProvider} from '..'
-import {ItemInput} from '../ActionList/List'
-
-expect.extend(toHaveNoViolations)
-
-const items = [{text: 'Foo'}, {text: 'Bar'}, {text: 'Baz'}, {text: 'Bon'}] as ItemInput[]
-
-function SimpleSelectPanel(): JSX.Element {
-  const [selected, setSelected] = React.useState<ItemInput[]>([])
-  const [, setFilter] = React.useState('')
-  const [open, setOpen] = React.useState(false)
-
-  return (
-    <ThemeProvider theme={theme}>
-      <SSRProvider>
-        <BaseStyles>
-          <SelectPanel
-            items={items}
-            placeholder="Select Items"
-            placeholderText="Filter Items"
-            selected={selected}
-            onSelectedChange={setSelected}
-            onFilterChange={setFilter}
-            open={open}
-            onOpenChange={setOpen}
-          />
-          <div id="portal-root"></div>
-        </BaseStyles>
-      </SSRProvider>
-    </ThemeProvider>
-  )
-}
-
-describe('SelectPanel', () => {
-  afterEach(() => {
-    jest.clearAllMocks()
-  })
-
-  behavesAsComponent({
-    Component: SelectPanel,
-    options: {skipAs: true, skipSx: true},
-    toRender: () => <SimpleSelectPanel />
-  })
-
-  checkExports('SelectPanel', {
-    default: undefined,
-    SelectPanel
-  })
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(<SimpleSelectPanel />)
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-    cleanup()
-  })
-})

package/src/__tests__/SideNav.test.tsx

@@ -1,62 +0,0 @@
-import React from 'react'
-import {SideNav} from '..'
-import {render, behavesAsComponent, mount, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-expect.extend(toHaveNoViolations)
-
-describe('SideNav', () => {
-  behavesAsComponent({Component: SideNav})
-
-  checkExports('SideNav', {
-    default: SideNav
-  })
-
-  describe('SideNav.Link', () => {
-    behavesAsComponent({Component: SideNav.Link})
-  })
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(
-      <SideNav>
-        <SideNav.Link href="#">One</SideNav.Link>
-        <SideNav.Link href="#" selected>
-          Two
-        </SideNav.Link>
-      </SideNav>
-    )
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-    cleanup()
-  })
-
-  it('renders a <nav> and <a>', () => {
-    expect(render(<SideNav />).type).toEqual('nav')
-    expect(render(<SideNav.Link />).type).toEqual('a')
-  })
-
-  it('sets aria-label appropriately', () => {
-    expect(render(<SideNav aria-label="foo" />).props['aria-label']).toEqual('foo')
-  })
-
-  it('sets aria-current on a selected link', () => {
-    const elem = (
-      <SideNav>
-        <SideNav.Link href="#one">One</SideNav.Link>
-        <SideNav.Link href="#two" selected>
-          Two
-        </SideNav.Link>
-      </SideNav>
-    )
-    const wrapper = mount(elem)
-    expect(wrapper.find('[aria-current="page"]').text()).toEqual('Two')
-  })
-
-  it('sets different styles for SideNavs with the lightweight variant', () => {
-    const regular = render(<SideNav />)
-    const lightweight = render(<SideNav variant="lightweight" />)
-    expect(regular.props.className).toEqual(expect.stringContaining('variant-normal'))
-    expect(lightweight.props.className).toEqual(expect.stringContaining('variant-lightweight'))
-  })
-})

package/src/__tests__/SideNav.types.test.tsx

@@ -1,11 +0,0 @@
-import React from 'react'
-import SideNav from '../SideNav'
-
-export function shouldAcceptCallWithNoProps() {
-  return <SideNav />
-}
-
-export function shouldNotAcceptSystemProps() {
-  // @ts-expect-error system props should not be accepted
-  return <SideNav backgroundColor="aliceblue" />
-}

package/src/__tests__/Spinner.test.tsx

@@ -1,42 +0,0 @@
-import React from 'react'
-import {Spinner, SpinnerProps} from '..'
-import {behavesAsComponent, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-expect.extend(toHaveNoViolations)
-
-describe('Spinner', () => {
-  afterEach(() => {
-    cleanup()
-  })
-
-  behavesAsComponent({
-    Component: Spinner
-  })
-
-  checkExports('Spinner', {
-    default: Spinner
-  })
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(<Spinner />)
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-  })
-
-  it('should respect size arguments', () => {
-    const expectSize = (input: SpinnerProps['size'] | undefined, expectedSize: string) => {
-      const {container} = HTMLRender(<Spinner size={input} />)
-      const svg = container.querySelector('svg')!
-      expect(svg.getAttribute('height')).toEqual(expectedSize)
-      expect(svg.getAttribute('width')).toEqual(expectedSize)
-    }
-
-    // default: medium
-    expectSize(undefined, '32px')
-    expectSize('small', '16px')
-    expectSize('medium', '32px')
-    expectSize('large', '64px')
-  })
-})

package/src/__tests__/StateLabel.test.tsx

@@ -1,48 +0,0 @@
-import React from 'react'
-import {StateLabel} from '..'
-import {render, behavesAsComponent, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-
-expect.extend(toHaveNoViolations)
-
-describe('StateLabel', () => {
-  behavesAsComponent({
-    Component: StateLabel,
-    toRender: () => <StateLabel status="issueOpened">Open</StateLabel>,
-    options: {
-      // Rendering a StyledOcticon seems to break getComputedStyles, which
-      // the sx prop implementation test uses to make sure the prop is working correctly.
-      // Despite my best efforts, I cannot figure out why this is happening. So,
-      // unfortunately, we will simply skip this test.
-      skipSx: true
-    }
-  })
-
-  checkExports('StateLabel', {
-    default: StateLabel
-  })
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(<StateLabel status="issueOpened" />)
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-    cleanup()
-  })
-
-  it('respects the status prop', () => {
-    expect(render(<StateLabel status="issueOpened" />)).toMatchSnapshot()
-    expect(render(<StateLabel status="issueClosed" />)).toMatchSnapshot()
-    expect(render(<StateLabel status="pullMerged" />)).toMatchSnapshot()
-  })
-
-  it('respects the variant prop', () => {
-    expect(render(<StateLabel variant="small" status="issueOpened" />)).toMatchSnapshot()
-    expect(render(<StateLabel variant="normal" status="issueOpened" />)).toMatchSnapshot()
-  })
-
-  it('renders children', () => {
-    expect(render(<StateLabel status="issueOpened">hi</StateLabel>)).toMatchSnapshot()
-  })
-})

package/src/__tests__/StateLabel.types.test.tsx

@@ -1,11 +0,0 @@
-import React from 'react'
-import StateLabel from '../StateLabel'
-
-export function shouldAcceptCallWithNoProps() {
-  return <StateLabel />
-}
-
-export function shouldNotAcceptSystemProps() {
-  // @ts-expect-error system props should not be accepted
-  return <StateLabel backgroundColor="bisque" />
-}

package/src/__tests__/StyledOcticon.test.tsx

@@ -1,26 +0,0 @@
-import React from 'react'
-import {XIcon} from '@primer/octicons-react'
-import {StyledOcticon} from '..'
-import {behavesAsComponent, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-expect.extend(toHaveNoViolations)
-
-describe('StyledOcticon', () => {
-  behavesAsComponent({
-    Component: StyledOcticon,
-    toRender: () => <StyledOcticon icon={XIcon} />
-  })
-
-  checkExports('StyledOcticon', {
-    default: StyledOcticon
-  })
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(<StyledOcticon icon={XIcon} />)
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-    cleanup()
-  })
-})

package/src/__tests__/StyledOcticon.types.test.tsx

@@ -1,12 +0,0 @@
-import {MoonIcon} from '@primer/octicons-react'
-import React from 'react'
-import StyledOcticon from '../StyledOcticon'
-
-export function shouldAcceptCallWithNoProps() {
-  return <StyledOcticon icon={MoonIcon} />
-}
-
-export function shouldNotAcceptSystemProps() {
-  // @ts-expect-error system props should not be accepted
-  return <StyledOcticon backgroundColor="wheat" />
-}

package/src/__tests__/SubNav.test.tsx

@@ -1,50 +0,0 @@
-import React from 'react'
-import {SubNav} from '..'
-import {mount, render, rendersClass, behavesAsComponent, checkExports} from '../utils/testing'
-import {render as HTMLRender, cleanup} from '@testing-library/react'
-import {axe, toHaveNoViolations} from 'jest-axe'
-import 'babel-polyfill'
-expect.extend(toHaveNoViolations)
-
-describe('SubNav', () => {
-  behavesAsComponent({Component: SubNav})
-
-  checkExports('SubNav', {
-    default: SubNav
-  })
-
-  it('should have no axe violations', async () => {
-    const {container} = HTMLRender(<SubNav />)
-    const results = await axe(container)
-    expect(results).toHaveNoViolations()
-    cleanup()
-  })
-
-  it('renders a <nav>', () => {
-    expect(render(<SubNav />).type).toEqual('nav')
-  })
-
-  it('adds the SubNav class', () => {
-    expect(rendersClass(<SubNav />, 'SubNav')).toEqual(true)
-  })
-
-  it('sets aria-label to the "label" prop', () => {
-    expect(render(<SubNav label="foo" />).props['aria-label']).toEqual('foo')
-  })
-
-  it('wraps its children in an "SubNav-body" div', () => {
-    const children = <b>yo</b>
-    const wrapper = mount(<SubNav>{children}</SubNav>)
-    const body = wrapper.find('.SubNav-body')
-    expect(body.exists()).toEqual(true)
-    expect(body.childAt(0).type()).toEqual('b')
-  })
-
-  it('respects the "actions" prop', () => {
-    const content = <h1>hi!</h1>
-    const wrapper = mount(<SubNav actions={content} />)
-    const actions = wrapper.find('.SubNav-actions')
-    expect(actions.exists()).toEqual(true)
-    expect(actions.text()).toEqual('hi!')
-  })
-})