mirror of
https://github.com/mattermost/focalboard.git
synced 2025-02-04 19:15:49 +02:00
chore[GH-#831]: Add unit tests for emptyCenterPanel (#1652)
This commit is contained in:
Julien Fabre
GitHub
parent
ae552e260c
commit
eac489231a
@ -0,0 +1,148 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`components/emptyCenterPanel a focalboard Plugin should match snapshot 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="EmptyCenterPanel"
|
||||
>
|
||||
<div
|
||||
class="content"
|
||||
>
|
||||
<span
|
||||
class="title"
|
||||
>
|
||||
Create a Board in Workspace 1
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
>
|
||||
Add a board to the sidebar using any of the templates defined below or start from scratch.
|
||||
<br />
|
||||
Members of "
|
||||
<b>
|
||||
Workspace 1
|
||||
</b>
|
||||
" will have access to boards created here.
|
||||
</span>
|
||||
<span
|
||||
class="choose-template-text"
|
||||
>
|
||||
Choose a template
|
||||
</span>
|
||||
<div
|
||||
class="button-container"
|
||||
>
|
||||
<div
|
||||
class="button "
|
||||
>
|
||||
<span>
|
||||
🚴🏻♂️
|
||||
</span>
|
||||
<span
|
||||
class="button-title"
|
||||
>
|
||||
Template 1
|
||||
</span>
|
||||
<div
|
||||
aria-label="menuwrapper"
|
||||
class="MenuWrapper"
|
||||
role="button"
|
||||
>
|
||||
<button
|
||||
class="Button IconButton"
|
||||
type="button"
|
||||
>
|
||||
<i
|
||||
class="CompassIcon icon-dots-horizontal OptionsIcon"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="button "
|
||||
>
|
||||
<span>
|
||||
🚴🏻♂️
|
||||
</span>
|
||||
<span
|
||||
class="button-title"
|
||||
>
|
||||
Template Global
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="button new-template"
|
||||
>
|
||||
<span>
|
||||
<i
|
||||
class="CompassIcon icon-plus AddIcon"
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
class="button-title"
|
||||
>
|
||||
New template
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<span
|
||||
class="choose-template-text"
|
||||
>
|
||||
or
|
||||
</span>
|
||||
<div
|
||||
class="button "
|
||||
>
|
||||
<span>
|
||||
<svg
|
||||
class="BoardIcon Icon"
|
||||
viewBox="0 0 100 100"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect
|
||||
height="80"
|
||||
rx="5"
|
||||
ry="5"
|
||||
width="80"
|
||||
x="10"
|
||||
y="10"
|
||||
/>
|
||||
<polyline
|
||||
points="28,25 28,55"
|
||||
style="stroke-width: 15px;"
|
||||
/>
|
||||
<polyline
|
||||
points="50,25 50,70"
|
||||
style="stroke-width: 15px;"
|
||||
/>
|
||||
<polyline
|
||||
points="72,25 72,45"
|
||||
style="stroke-width: 15px;"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
class="button-title"
|
||||
>
|
||||
Start with an Empty Board
|
||||
</span>
|
||||
</div>
|
||||
You can change the channel using the switcher in the sidebar.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`components/emptyCenterPanel not a focalboard Plugin should match snapshot 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="EmptyCenterPanel"
|
||||
>
|
||||
<div
|
||||
class="Hint"
|
||||
>
|
||||
Add or select a board from the sidebar to get started.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
147
webapp/src/components/emptyCenterPanel.test.tsx
Normal file
147
webapp/src/components/emptyCenterPanel.test.tsx
Normal file
@ -0,0 +1,147 @@
|
||||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
import {render, screen, waitFor} from '@testing-library/react'
|
||||
import userEvent from '@testing-library/user-event'
|
||||
import React from 'react'
|
||||
import {MockStoreEnhanced} from 'redux-mock-store'
|
||||
|
||||
import {mocked} from 'ts-jest/utils'
|
||||
|
||||
import {Provider as ReduxProvider} from 'react-redux'
|
||||
|
||||
import {MemoryRouter} from 'react-router-dom'
|
||||
|
||||
import Mutator from '../mutator'
|
||||
|
||||
import {Utils} from '../utils'
|
||||
|
||||
import {UserWorkspace} from '../user'
|
||||
|
||||
import {mockDOM, mockStateStore, wrapDNDIntl} from '../testUtils'
|
||||
|
||||
import EmptyCenterPanel from './emptyCenterPanel'
|
||||
|
||||
jest.mock('react-router-dom', () => {
|
||||
const originalModule = jest.requireActual('react-router-dom')
|
||||
|
||||
return {
|
||||
...originalModule,
|
||||
useRouteMatch: jest.fn(() => {
|
||||
return {url: '/'}
|
||||
}),
|
||||
}
|
||||
})
|
||||
jest.mock('../utils')
|
||||
jest.mock('../mutator')
|
||||
|
||||
describe('components/emptyCenterPanel', () => {
|
||||
const mockedUtils = mocked(Utils, true)
|
||||
const mockedMutator = mocked(Mutator, true)
|
||||
const workspace1: UserWorkspace = {
|
||||
id: 'workspace_1',
|
||||
title: 'Workspace 1',
|
||||
boardCount: 1,
|
||||
}
|
||||
const template1Title = 'Template 1'
|
||||
const globalTemplateTitle = 'Template Global'
|
||||
let store:MockStoreEnhanced<unknown, unknown>
|
||||
beforeAll(mockDOM)
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks()
|
||||
const state = {
|
||||
workspace: {
|
||||
userWorkspaces: new Array<UserWorkspace>(workspace1),
|
||||
current: workspace1,
|
||||
},
|
||||
boards: {
|
||||
templates: [
|
||||
{id: '1', title: template1Title, fields: {icon: '🚴🏻♂️'}},
|
||||
],
|
||||
},
|
||||
globalTemplates: {
|
||||
value: [{id: 'global-1', title: globalTemplateTitle, fields: {icon: '🚴🏻♂️'}}],
|
||||
},
|
||||
}
|
||||
store = mockStateStore([], state)
|
||||
})
|
||||
describe('not a focalboard Plugin', () => {
|
||||
beforeAll(() => {
|
||||
mockedUtils.isFocalboardPlugin.mockReturnValue(false)
|
||||
})
|
||||
test('should match snapshot', () => {
|
||||
const {container} = render(wrapDNDIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<EmptyCenterPanel/>
|
||||
</ReduxProvider>
|
||||
,
|
||||
), {wrapper: MemoryRouter})
|
||||
expect(container).toMatchSnapshot()
|
||||
})
|
||||
})
|
||||
describe('a focalboard Plugin', () => {
|
||||
beforeAll(() => {
|
||||
mockedUtils.isFocalboardPlugin.mockReturnValue(true)
|
||||
})
|
||||
test('should match snapshot', () => {
|
||||
const {container} = render(wrapDNDIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<EmptyCenterPanel/>
|
||||
</ReduxProvider>
|
||||
,
|
||||
), {wrapper: MemoryRouter})
|
||||
expect(container).toMatchSnapshot()
|
||||
})
|
||||
test('return emptyCenterPanel and click new template', () => {
|
||||
const {container} = render(wrapDNDIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<EmptyCenterPanel/>
|
||||
</ReduxProvider>
|
||||
,
|
||||
), {wrapper: MemoryRouter})
|
||||
const divNewTemplate = container.querySelector('div.button.new-template')
|
||||
expect(divNewTemplate).not.toBeNull()
|
||||
userEvent.click(divNewTemplate!)
|
||||
expect(mockedMutator.insertBlocks).toBeCalledTimes(1)
|
||||
})
|
||||
test('return emptyCenterPanel and click empty board', () => {
|
||||
render(wrapDNDIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<EmptyCenterPanel/>
|
||||
</ReduxProvider>
|
||||
,
|
||||
), {wrapper: MemoryRouter})
|
||||
const divEmptyboard = screen.getByText('Start with an Empty Board').parentElement
|
||||
expect(divEmptyboard).not.toBeNull()
|
||||
userEvent.click(divEmptyboard!)
|
||||
expect(mockedMutator.insertBlocks).toBeCalledTimes(1)
|
||||
})
|
||||
test('return emptyCenterPanel and click to add board from template', async () => {
|
||||
render(wrapDNDIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<EmptyCenterPanel/>
|
||||
</ReduxProvider>
|
||||
,
|
||||
), {wrapper: MemoryRouter})
|
||||
const divAddBoard = screen.getByText(template1Title).parentElement
|
||||
expect(divAddBoard).not.toBeNull()
|
||||
userEvent.click(divAddBoard!)
|
||||
await waitFor(async () => {
|
||||
expect(mockedMutator.duplicateBoard).toBeCalledTimes(1)
|
||||
})
|
||||
})
|
||||
test('return emptyCenterPanel and click to add board from global template', async () => {
|
||||
render(wrapDNDIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<EmptyCenterPanel/>
|
||||
</ReduxProvider>
|
||||
,
|
||||
), {wrapper: MemoryRouter})
|
||||
const divAddBoard = screen.getByText(globalTemplateTitle).parentElement
|
||||
expect(divAddBoard).not.toBeNull()
|
||||
userEvent.click(divAddBoard!)
|
||||
await waitFor(async () => {
|
||||
expect(mockedMutator.duplicateFromRootBoard).toBeCalledTimes(1)
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
Loading…
x
Reference in New Issue
Block a user