self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2024-12-21 13:38:56 +02:00
Code Issues Releases Activity

add unit tests

Browse Source
This commit is contained in:
Pablo Velez Vidal 2023-01-11 17:08:42 +01:00
parent 4ac26697e6
commit 61ba412c27
2 changed files with 68 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
mattermost-plugin/webapp/src/components/__snapshots__/createBoardFromTemplate.test.tsx.snap
View File

@ -17,9 +17,35 @@ exports[`components/createBoardFromTemplate renders the Create Boards from templ
<span>
Create a board for this channel
</span>
<div>
icon
</div>
<i
class="icon-information-outline"
/>
</label>
</div>
</div>
</div>
`;
exports[`components/createBoardFromTemplate renders the Create Boards from template component and match snapshot 1`] = `
<div>
<div
class="CreateBoardFromTemplate"
>
<div
class="add-board-to-channel"
>
<label>
<input
data-testid="add-board-to-channel-check"
id="add-board-to-channel"
type="checkbox"
/>
<span>
Create a board for this channel
</span>
<i
class="icon-information-outline"
/>
</label>
</div>
</div>

225
mattermost-plugin/webapp/src/components/createBoardFromTemplate.test.tsx
View File

@ -1,204 +1,31 @@
// // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// // See LICENSE.txt for license information.
// import React from 'react'
// import {act} from 'react-dom/test-utils'
// import {ReactWrapper} from 'enzyme'
// import {Provider} from 'react-redux'
// describe('components/new_channel_modal', () => {
// const actImmediate = (wrapper: ReactWrapper) =>
// act(
// () =>
// new Promise<void>((resolve) => {
// setImmediate(() => {
// wrapper.update()
// resolve()
// })
// }),
// )
// test('should show the boards template when the user clicks the create template checkbox', async () => {
// const store = await mockStore(mockState)
// const wrapper = mountWithIntl(
// <Provider store={store}>
// <NewChannelModal/>
// </Provider>,
// )
// const showTemplatesCheck = wrapper.find('.add-board-to-channel input')
// showTemplatesCheck.simulate('change')
// await actImmediate(wrapper)
// const inputTemplatesSelector = wrapper.find('#input_select-board-template')
// expect(inputTemplatesSelector).toHaveLength(1)
// })
// test('should show the list of templates when the templates selector is clicked', async () => {
// const store = await mockStore(mockState)
// const wrapper = mountWithIntl(
// <Provider store={store}>
// <NewChannelModal/>
// </Provider>,
// )
// const showTemplatesCheck = wrapper.find('.add-board-to-channel input')
// showTemplatesCheck.simulate('change')
// await actImmediate(wrapper)
// const templatesSelector = wrapper.find('#input_select-board-template')
// templatesSelector.simulate('click')
// await actImmediate(wrapper)
// const menuItems = wrapper.find('li.MenuItem')
// const createEmptyBoardItem = wrapper.find('li#Empty_board')
// expect(createEmptyBoardItem).toHaveLength(1)
// // contains 3 items because of the create empty board menu item
// expect(menuItems).toHaveLength(3)
// })
// test('when a board template is selected must call the switch to channel butoon', async () => {
// const switchToChannelFn = jest.fn()
// jest.spyOn(ChannelViewsActions, 'switchToChannel').mockImplementation(switchToChannelFn)
// const name = 'New channel with board'
// const mockChangeEvent = {
// preventDefault: jest.fn(),
// target: {
// value: name,
// },
// } as unknown as React.ChangeEvent<HTMLInputElement>
// const wrapper = mountWithIntl(
// <Provider store={store}>
// <NewChannelModal/>
// </Provider>,
// )
// const genericModal = wrapper.find('GenericModal')
// const displayName = genericModal.find('.new-channel-modal-name-input')
// const confirmButton = genericModal.find('button[type=\'submit\']')
// displayName.simulate('change', mockChangeEvent)
// // Display name should be updated
// expect((displayName.instance() as unknown as HTMLInputElement).value).toEqual(name)
// // Confirm button should be enabled
// expect((confirmButton.instance() as unknown as HTMLButtonElement).disabled).toEqual(false)
// const showTemplatesCheck = wrapper.find('.add-board-to-channel input')
// showTemplatesCheck.simulate('change')
// await actImmediate(wrapper)
// const templatesSelector = wrapper.find('#input_select-board-template')
// templatesSelector.simulate('click')
// await actImmediate(wrapper)
// const firstTemplate = wrapper.find('li.MenuItem').at(0).find('button')
// expect(firstTemplate).toHaveLength(1)
// firstTemplate.simulate('click')
// await actImmediate(wrapper)
// // Submit
// await act(async () => {
// confirmButton.simulate('click')
// })
// expect(switchToChannelFn).toHaveBeenCalled()
// })
// test('if focalboard plugin is not enabled, the option to create a board should be hidden', async () => {
// // eslint-disable-next-line @typescript-eslint/ban-ts-comment
// // @ts-ignore
// mockState.plugins.plugins = {} as ClientPluginManifest
// const storeNoPlugins = await mockStore(mockState)
// const wrapper = mountWithIntl(
// <Provider store={storeNoPlugins}>
// <NewChannelModal/>
// </Provider>,
// )
// const showTemplatesCheck = wrapper.find('.add-board-to-channel input')
// expect(showTemplatesCheck).toHaveLength(0)
// })
// })
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react'
import {Provider as ReduxProvider} from 'react-redux'
import {render, screen, act, fireEvent} from '@testing-library/react'
import {mocked} from 'jest-mock'
import {render, screen, act} from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import octoClient from '../../../../webapp/src/octoClient'
import {mockStateStore} from '../../../../webapp/src/testUtils'
import {createBoard} from '../../../../webapp/src/blocks/board'
import {wrapIntl} from '../../../../webapp/src/testUtils'
import CreateBoardFromTemplate from './createBoardFromTemplate'
jest.mock('../../../../webapp/src/octoClient')
const mockedOctoClient = mocked(octoClient, true)
jest.mock('../../../../webapp/src/hooks/useGetAllTemplates', () => ({
useGetAllTemplates: () => [{id: 'id', title: 'title', description: 'description', icon: 'icon'}]
useGetAllTemplates: () => [{id: 'id', title: 'title', description: 'description', icon: '🍔'}]
}))
const wait = (ms: number) => {
return new Promise<void>((resolve) => {
setTimeout(resolve, ms)
})
}
describe('components/createBoardFromTemplate', () => {
const team = {
id: 'team-id',
name: 'team',
display_name: 'Team name',
}
const state = {
teams: {
allTeams: [team],
current: team,
currentId: team.id,
},
language: {
value: 'en',
},
boards: {
linkToChannel: 'channel-id',
},
}
it('renders the Create Boards from template component', async () => {
it('renders the Create Boards from template component and match snapshot', async () => {
const store = mockStateStore([], state)
let container: Element | DocumentFragment | null = null
const setSelectedTemplate = jest.fn
const toggleAddBoardCheckbox = jest.fn
const newBoardInfoIcon = (<div>{'icon'}</div>)
const newBoardInfoIcon = (<i className="icon-information-outline" />)
await act(async () => {
const result = render(wrapIntl(
@ -216,13 +43,39 @@ describe('components/createBoardFromTemplate', () => {
expect(container).toMatchSnapshot()
})
// it('renders without start searching', async () => {
// const store = mockStateStore([], state)
// const {container} = render(wrapIntl(
// <ReduxProvider store={store}>
// <CreateBoardFromTemplate/>
// </ReduxProvider>
// ))
// expect(container).toMatchSnapshot()
// })
it('clicking checkbox toggles the templates selector', async () => {
const store = mockStateStore([], state)
const setSelectedTemplate = jest.fn
const toggleAddBoardCheckbox = jest.fn
const newBoardInfoIcon = (<i className="icon-information-outline" />)
await act(async () => {
render(wrapIntl(
<ReduxProvider store={store}>
<CreateBoardFromTemplate
setSelectedTemplate={setSelectedTemplate}
toggleAddBoardCheck={toggleAddBoardCheckbox}
newBoardInfoIcon={newBoardInfoIcon}
/>
</ReduxProvider>
))
})
// click to show the template selector
let checkbox = screen.getByRole('checkbox', {checked: false})
await act(async () => {
await userEvent.click(checkbox)
const templatesSelector = screen.queryByText('Select a template')
expect(templatesSelector).toBeTruthy()
})
// click to hide the template selector
checkbox = screen.getByRole('checkbox', {checked: true})
await act(async () => {
await userEvent.click(checkbox)
const templatesSelector = screen.queryByText('Select a template')
expect(templatesSelector).not.toBeInTheDocument()
})
})
})