Add default label test for sidebar

This commit is contained in:
mmv 2019-09-23 16:57:44 +04:00
parent 6e80d09d17
commit 0fd579f6b7
3 changed files with 40 additions and 2 deletions

View File

@ -13,6 +13,8 @@ import {
import { safesCountSelector } from '~/routes/safe/store/selectors' import { safesCountSelector } from '~/routes/safe/store/selectors'
import { SidebarContext } from '~/components/Sidebar' import { SidebarContext } from '~/components/Sidebar'
export const TOGGLE_SIDEBAR_BTN_TESTID = 'TOGGLE_SIDEBAR_BTN'
const useStyles = makeStyles({ const useStyles = makeStyles({
container: { container: {
flexGrow: 0, flexGrow: 0,
@ -47,7 +49,12 @@ const SafeListHeader = ({ safesCount }: Props) => {
<Paragraph size="xs" className={classes.counter}> <Paragraph size="xs" className={classes.counter}>
{safesCount} {safesCount}
</Paragraph> </Paragraph>
<IconButton onClick={toggleSidebar} className={classes.icon} aria-label="Expand Safe List"> <IconButton
onClick={toggleSidebar}
className={classes.icon}
aria-label="Expand Safe List"
data-testid={TOGGLE_SIDEBAR_BTN_TESTID}
>
{isOpen ? <ExpandLessIcon /> : <ExpandMoreIcon color="secondary" />} {isOpen ? <ExpandLessIcon /> : <ExpandMoreIcon color="secondary" />}
</IconButton> </IconButton>
</Col> </Col>

View File

@ -19,6 +19,8 @@ import { type Safe } from '~/routes/safe/store/models/safe'
import { SAFELIST_ADDRESS } from '~/routes/routes' import { SAFELIST_ADDRESS } from '~/routes/routes'
import DefaultBadge from './DefaultBadge' import DefaultBadge from './DefaultBadge'
export const SIDEBAR_SAFELIST_ROW_TESTID = 'SIDEBAR_SAFELIST_ROW_TESTID'
type SafeListProps = { type SafeListProps = {
safes: List<Safe>, safes: List<Safe>,
onSafeClick: Function, onSafeClick: Function,
@ -69,7 +71,7 @@ const SafeList = ({
<MuiList className={classes.list}> <MuiList className={classes.list}>
{safes.map((safe) => ( {safes.map((safe) => (
<React.Fragment key={safe.address}> <React.Fragment key={safe.address}>
<Link to={`${SAFELIST_ADDRESS}/${safe.address}`} onClick={onSafeClick}> <Link to={`${SAFELIST_ADDRESS}/${safe.address}`} onClick={onSafeClick} data-testid={SIDEBAR_SAFELIST_ROW_TESTID}>
<ListItem classes={{ root: classes.listItemRoot }}> <ListItem classes={{ root: classes.listItemRoot }}>
<ListItemIcon> <ListItemIcon>
<Identicon address={safe.address} diameter={32} className={classes.icon} /> <Identicon address={safe.address} diameter={32} className={classes.icon} />

View File

@ -1 +1,30 @@
// @flow // @flow
import { act, fireEvent } from '@testing-library/react'
import { aNewStore } from '~/store'
import { aMinedSafe } from '~/test/builder/safe.redux.builder'
import { renderSafeView } from '~/test/builder/safe.dom.utils'
import '@testing-library/jest-dom/extend-expect'
import { TOGGLE_SIDEBAR_BTN_TESTID } from '~/components/Header/component/SafeListHeader'
import { SIDEBAR_SAFELIST_ROW_TESTID } from '~/components/Sidebar/SafeList'
describe('DOM > Feature > Sidebar', () => {
let store
let safeAddress: string
beforeEach(async () => {
store = aNewStore()
safeAddress = await aMinedSafe(store)
})
it('Shows "default" label for a single safe', async () => {
const SafeDom = await renderSafeView(store, safeAddress)
act(() => {
fireEvent.click(SafeDom.getByTestId(TOGGLE_SIDEBAR_BTN_TESTID))
})
const safes = SafeDom.getAllByTestId(SIDEBAR_SAFELIST_ROW_TESTID)
expect(safes.length).toBe(1)
expect(safes[0]).toContainElement(SafeDom.getByText('default'))
})
})