[GH-865] Add more tests unit to viewHeaderActionMenu (#1412)
* chore[#865]: add other test unit to viewHeaderActionMenu * fix: add clearMocks Co-authored-by: Mattermod <mattermod@users.noreply.github.com>
This commit is contained in:
Julien Fabre
GitHub
parent
0ac2fc0f62
commit
c2f688e980
2 changed files with 286 additions and 8 deletions
|
|
@ -1,5 +1,225 @@
|
||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`components/viewHeader/viewHeaderActionsMenu return menu and verify call to board archive 1`] = `
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
class="ModalWrapper"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label="menuwrapper"
|
||||||
|
class="MenuWrapper"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="Button IconButton"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<i
|
||||||
|
class="CompassIcon icon-dots-horizontal OptionsIcon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Menu noselect bottom"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="menu-contents"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="menu-options"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label="Export to CSV"
|
||||||
|
class="MenuOption TextOption menu-option"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Export to CSV
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
aria-label="Export board archive"
|
||||||
|
class="MenuOption TextOption menu-option"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Export board archive
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
aria-label="Share board"
|
||||||
|
class="MenuOption TextOption menu-option"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Share board
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="menu-spacer hideOnWidescreen"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-options hideOnWidescreen"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label="Cancel"
|
||||||
|
class="MenuOption TextOption menu-option menu-cancel"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Cancel
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`components/viewHeader/viewHeaderActionsMenu return menu and verify call to csv exporter 1`] = `
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
class="ModalWrapper"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label="menuwrapper"
|
||||||
|
class="MenuWrapper"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="Button IconButton"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<i
|
||||||
|
class="CompassIcon icon-dots-horizontal OptionsIcon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Menu noselect bottom"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="menu-contents"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="menu-options"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label="Export to CSV"
|
||||||
|
class="MenuOption TextOption menu-option"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Export to CSV
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
aria-label="Export board archive"
|
||||||
|
class="MenuOption TextOption menu-option"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Export board archive
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
aria-label="Share board"
|
||||||
|
class="MenuOption TextOption menu-option"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Share board
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="menu-spacer hideOnWidescreen"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-options hideOnWidescreen"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label="Cancel"
|
||||||
|
class="MenuOption TextOption menu-option menu-cancel"
|
||||||
|
role="button"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="menu-name"
|
||||||
|
>
|
||||||
|
Cancel
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="noicon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
exports[`components/viewHeader/viewHeaderActionsMenu return menu with Share Boards 1`] = `
|
exports[`components/viewHeader/viewHeaderActionsMenu return menu with Share Boards 1`] = `
|
||||||
<div>
|
<div>
|
||||||
<div
|
<div
|
||||||
|
|
|
||||||
|
|
@ -4,17 +4,27 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import {render, screen} from '@testing-library/react'
|
import {render, screen} from '@testing-library/react'
|
||||||
import {Provider as ReduxProvider} from 'react-redux'
|
import {Provider as ReduxProvider} from 'react-redux'
|
||||||
import configureStore from 'redux-mock-store'
|
|
||||||
|
|
||||||
import '@testing-library/jest-dom'
|
import '@testing-library/jest-dom'
|
||||||
import userEvent from '@testing-library/user-event'
|
import userEvent from '@testing-library/user-event'
|
||||||
|
|
||||||
import {wrapIntl} from '../../testUtils'
|
import {mocked} from 'ts-jest/utils'
|
||||||
|
|
||||||
import {TestBlockFactory} from '../../test/testBlockFactory'
|
import {TestBlockFactory} from '../../test/testBlockFactory'
|
||||||
|
|
||||||
|
import {wrapIntl, mockStateStore} from '../../testUtils'
|
||||||
|
|
||||||
|
import {Archiver} from '../../archiver'
|
||||||
|
|
||||||
|
import {CsvExporter} from '../../csvExporter'
|
||||||
|
|
||||||
import ViewHeaderActionsMenu from './viewHeaderActionsMenu'
|
import ViewHeaderActionsMenu from './viewHeaderActionsMenu'
|
||||||
|
|
||||||
|
jest.mock('../../archiver')
|
||||||
|
jest.mock('../../csvExporter')
|
||||||
|
const mockedArchiver = mocked(Archiver, true)
|
||||||
|
const mockedCsvExporter = mocked(CsvExporter, true)
|
||||||
|
|
||||||
const board = TestBlockFactory.createBoard()
|
const board = TestBlockFactory.createBoard()
|
||||||
const activeView = TestBlockFactory.createBoardView(board)
|
const activeView = TestBlockFactory.createBoardView(board)
|
||||||
const card = TestBlockFactory.createCard(board)
|
const card = TestBlockFactory.createCard(board)
|
||||||
|
|
@ -24,12 +34,14 @@ describe('components/viewHeader/viewHeaderActionsMenu', () => {
|
||||||
users: {
|
users: {
|
||||||
me: {
|
me: {
|
||||||
id: 'user-id-1',
|
id: 'user-id-1',
|
||||||
username: 'username_1'},
|
username: 'username_1',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
const mockStore = configureStore([])
|
const store = mockStateStore([], state)
|
||||||
const store = mockStore(state)
|
beforeEach(() => {
|
||||||
|
jest.clearAllMocks()
|
||||||
|
})
|
||||||
test('return menu with Share Boards', () => {
|
test('return menu with Share Boards', () => {
|
||||||
const {container} = render(
|
const {container} = render(
|
||||||
wrapIntl(
|
wrapIntl(
|
||||||
|
|
@ -43,7 +55,9 @@ describe('components/viewHeader/viewHeaderActionsMenu', () => {
|
||||||
</ReduxProvider>,
|
</ReduxProvider>,
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
const buttonElement = screen.getByRole('button', {name: 'menuwrapper'})
|
const buttonElement = screen.getByRole('button', {
|
||||||
|
name: 'menuwrapper',
|
||||||
|
})
|
||||||
userEvent.click(buttonElement)
|
userEvent.click(buttonElement)
|
||||||
expect(container).toMatchSnapshot()
|
expect(container).toMatchSnapshot()
|
||||||
})
|
})
|
||||||
|
|
@ -61,8 +75,52 @@ describe('components/viewHeader/viewHeaderActionsMenu', () => {
|
||||||
</ReduxProvider>,
|
</ReduxProvider>,
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
const buttonElement = screen.getByRole('button', {name: 'menuwrapper'})
|
const buttonElement = screen.getByRole('button', {
|
||||||
|
name: 'menuwrapper',
|
||||||
|
})
|
||||||
userEvent.click(buttonElement)
|
userEvent.click(buttonElement)
|
||||||
expect(container).toMatchSnapshot()
|
expect(container).toMatchSnapshot()
|
||||||
})
|
})
|
||||||
|
test('return menu and verify call to csv exporter', () => {
|
||||||
|
const {container} = render(
|
||||||
|
wrapIntl(
|
||||||
|
<ReduxProvider store={store}>
|
||||||
|
<ViewHeaderActionsMenu
|
||||||
|
board={board}
|
||||||
|
activeView={activeView}
|
||||||
|
cards={[card]}
|
||||||
|
showShared={true}
|
||||||
|
/>
|
||||||
|
</ReduxProvider>,
|
||||||
|
),
|
||||||
|
)
|
||||||
|
const buttonElement = screen.getByRole('button', {name: 'menuwrapper'})
|
||||||
|
userEvent.click(buttonElement)
|
||||||
|
expect(container).toMatchSnapshot()
|
||||||
|
const buttonExportCSV = screen.getByRole('button', {name: 'Export to CSV'})
|
||||||
|
userEvent.click(buttonExportCSV)
|
||||||
|
expect(mockedCsvExporter.exportTableCsv).toBeCalledTimes(1)
|
||||||
|
})
|
||||||
|
|
||||||
|
test('return menu and verify call to board archive', () => {
|
||||||
|
const {container} = render(
|
||||||
|
wrapIntl(
|
||||||
|
<ReduxProvider store={store}>
|
||||||
|
<ViewHeaderActionsMenu
|
||||||
|
board={board}
|
||||||
|
activeView={activeView}
|
||||||
|
cards={[card]}
|
||||||
|
showShared={true}
|
||||||
|
/>
|
||||||
|
</ReduxProvider>,
|
||||||
|
),
|
||||||
|
)
|
||||||
|
const buttonElement = screen.getByRole('button', {name: 'menuwrapper'})
|
||||||
|
userEvent.click(buttonElement)
|
||||||
|
expect(container).toMatchSnapshot()
|
||||||
|
const buttonExportBoardArchive = screen.getByRole('button', {name: 'Export board archive'})
|
||||||
|
userEvent.click(buttonExportBoardArchive)
|
||||||
|
expect(mockedArchiver.exportBoardArchive).toBeCalledTimes(1)
|
||||||
|
expect(mockedArchiver.exportBoardArchive).toBeCalledWith(board)
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue