From 832509c76616fea3d5a67a8b3070a0d939beb2cd Mon Sep 17 00:00:00 2001 From: Chen-I Lim Date: Mon, 7 Dec 2020 15:17:04 -0800 Subject: [PATCH] Unit test: WorkspaceTree --- webapp/src/blocks/block.test.ts | 153 +++------------------ webapp/src/test/block.ts | 130 +++++++++++++++++ webapp/src/viewModel/cardTree.test.ts | 100 +++----------- webapp/src/viewModel/workspaceTree.test.ts | 67 +++++++++ 4 files changed, 234 insertions(+), 216 deletions(-) create mode 100644 webapp/src/test/block.ts create mode 100644 webapp/src/viewModel/workspaceTree.test.ts diff --git a/webapp/src/blocks/block.test.ts b/webapp/src/blocks/block.test.ts index 7ec586ada..37b1bd5c0 100644 --- a/webapp/src/blocks/block.test.ts +++ b/webapp/src/blocks/block.test.ts @@ -1,20 +1,19 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import {FilterClause} from '../filterClause' -import {FilterGroup} from '../filterGroup' -import {Utils} from '../utils' +import {TestBlockFactory} from '../test/block' -import {Board, IPropertyOption, IPropertyTemplate, MutableBoard} from './board' -import {BoardView, MutableBoardView} from './boardView' -import {Card, MutableCard} from './card' -import {CommentBlock, MutableCommentBlock} from './commentBlock' -import {DividerBlock, MutableDividerBlock} from './dividerBlock' -import {ImageBlock, MutableImageBlock} from './imageBlock' -import {MutableTextBlock, TextBlock} from './textBlock' +import {MutableBoard} from './board' +import {MutableBoardView} from './boardView' +import {MutableCard} from './card' +import {MutableCommentBlock} from './commentBlock' +import {MutableDividerBlock} from './dividerBlock' +import {MutableImageBlock} from './imageBlock' +import {MutableTextBlock} from './textBlock' test('block: clone board', async () => { - const boardA = createBoardTemplate() + const boardA = TestBlockFactory.createBoard() + boardA.isTemplate = true const boardB = new MutableBoard(boardA) expect(boardB).toEqual(boardA) @@ -26,7 +25,7 @@ test('block: clone board', async () => { }) test('block: clone view', async () => { - const viewA = createBoardView() + const viewA = TestBlockFactory.createBoardView() const viewB = new MutableBoardView(viewA) expect(viewB).toEqual(viewA) @@ -41,7 +40,8 @@ test('block: clone view', async () => { }) test('block: clone card', async () => { - const cardA = createCardTemplate() + const cardA = TestBlockFactory.createCard() + cardA.isTemplate = true const cardB = new MutableCard(cardA) expect(cardB).toEqual(cardA) @@ -50,14 +50,16 @@ test('block: clone card', async () => { }) test('block: clone comment', async () => { - const blockA = createComment() + const card = TestBlockFactory.createCard() + const blockA = TestBlockFactory.createComment(card) const blockB = new MutableCommentBlock(blockA) expect(blockB).toEqual(blockA) }) test('block: clone text', async () => { - const blockA = createText() + const card = TestBlockFactory.createCard() + const blockA = TestBlockFactory.createText(card) const blockB = new MutableTextBlock(blockA) expect(blockB).toEqual(blockA) @@ -65,7 +67,8 @@ test('block: clone text', async () => { }) test('block: clone image', async () => { - const blockA = createImage() + const card = TestBlockFactory.createCard() + const blockA = TestBlockFactory.createImage(card) const blockB = new MutableImageBlock(blockA) expect(blockB).toEqual(blockA) @@ -75,124 +78,10 @@ test('block: clone image', async () => { }) test('block: clone divider', async () => { - const blockA = createDivider() + const card = TestBlockFactory.createCard() + const blockA = TestBlockFactory.createDivider(card) const blockB = new MutableDividerBlock(blockA) expect(blockB).toEqual(blockA) expect(blockB.order).toEqual(blockA.order) }) - -function createBoardTemplate(): Board { - const board = new MutableBoard() - board.parentId = 'parent' - board.rootId = 'root' - board.title = 'title' - board.description = 'description' - board.showDescription = true - board.icon = 'i' - - for (let i = 0; i < 5; i++) { - const propertyOption: IPropertyOption = { - id: 'property1', - value: 'value1', - color: 'color1', - } - const propertyTemplate: IPropertyTemplate = { - id: Utils.createGuid(), - name: 'Status', - type: 'select', - options: [propertyOption], - } - board.cardProperties.push(propertyTemplate) - } - board.isTemplate = true - - return board -} - -function createBoardView(): BoardView { - const view = new MutableBoardView() - view.parentId = 'parent' - view.rootId = 'root' - view.title = 'title' - view.viewType = 'board' - view.groupById = 'groupId' - view.hiddenOptionIds = ['option1', 'option2', 'option3'] - view.cardOrder = ['card1', 'card2', 'card3'] - view.sortOptions = [ - { - propertyId: 'property1', - reversed: true, - }, - { - propertyId: 'property2', - reversed: false, - }, - ] - view.columnWidths = { - column1: 100, - column2: 200, - } - - // Filter - const filterGroup = new FilterGroup() - const filter = new FilterClause() - filter.propertyId = 'property1' - filter.condition = 'includes' - filter.values = ['value1'] - filterGroup.filters.push(filter) - view.filter = filterGroup - - return view -} - -function createCardTemplate(): Card { - const card = new MutableCard() - card.parentId = 'parent' - card.rootId = 'root' - card.title = 'title' - card.icon = 'i' - card.properties.property1 = 'value1' - card.isTemplate = true - - return card -} - -function createComment(): CommentBlock { - const block = new MutableCommentBlock() - block.parentId = 'parent' - block.rootId = 'root' - block.title = 'title' - - return block -} - -function createText(): TextBlock { - const block = new MutableTextBlock() - block.parentId = 'parent' - block.rootId = 'root' - block.title = 'title' - block.order = 100 - - return block -} - -function createImage(): ImageBlock { - const block = new MutableImageBlock() - block.parentId = 'parent' - block.rootId = 'root' - block.url = 'url' - block.order = 100 - - return block -} - -function createDivider(): DividerBlock { - const block = new MutableDividerBlock() - block.parentId = 'parent' - block.rootId = 'root' - block.title = 'title' - block.order = 100 - - return block -} diff --git a/webapp/src/test/block.ts b/webapp/src/test/block.ts new file mode 100644 index 000000000..c40b36ed4 --- /dev/null +++ b/webapp/src/test/block.ts @@ -0,0 +1,130 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import {IPropertyOption, IPropertyTemplate, MutableBoard} from '../blocks/board' +import {MutableBoardView} from '../blocks/boardView' +import {Card, MutableCard} from '../blocks/card' +import {MutableCommentBlock} from '../blocks/commentBlock' +import {DividerBlock, MutableDividerBlock} from '../blocks/dividerBlock' +import {ImageBlock, MutableImageBlock} from '../blocks/imageBlock' +import {MutableTextBlock, TextBlock} from '../blocks/textBlock' +import {FilterClause} from '../filterClause' +import {FilterGroup} from '../filterGroup' +import {Utils} from '../utils' + +class TestBlockFactory { + static createBoard(): MutableBoard { + const board = new MutableBoard() + board.parentId = 'parent' + board.rootId = 'root' + board.title = 'title' + board.description = 'description' + board.showDescription = true + board.icon = 'i' + + for (let i = 0; i < 5; i++) { + const propertyOption: IPropertyOption = { + id: 'property1', + value: 'value1', + color: 'color1', + } + const propertyTemplate: IPropertyTemplate = { + id: Utils.createGuid(), + name: 'Status', + type: 'select', + options: [propertyOption], + } + board.cardProperties.push(propertyTemplate) + } + + return board + } + + static createBoardView(): MutableBoardView { + const view = new MutableBoardView() + view.parentId = 'parent' + view.rootId = 'root' + view.title = 'title' + view.viewType = 'board' + view.groupById = 'groupId' + view.hiddenOptionIds = ['option1', 'option2', 'option3'] + view.cardOrder = ['card1', 'card2', 'card3'] + view.sortOptions = [ + { + propertyId: 'property1', + reversed: true, + }, + { + propertyId: 'property2', + reversed: false, + }, + ] + view.columnWidths = { + column1: 100, + column2: 200, + } + + // Filter + const filterGroup = new FilterGroup() + const filter = new FilterClause() + filter.propertyId = 'property1' + filter.condition = 'includes' + filter.values = ['value1'] + filterGroup.filters.push(filter) + view.filter = filterGroup + + return view + } + + static createCard(): MutableCard { + const card = new MutableCard() + card.parentId = 'parent' + card.rootId = 'root' + card.title = 'title' + card.icon = 'i' + card.properties.property1 = 'value1' + + return card + } + + static createComment(card: Card): MutableCommentBlock { + const block = new MutableCommentBlock() + block.parentId = card.id + block.rootId = card.rootId + block.title = 'title' + + return block + } + + static createText(card: Card): TextBlock { + const block = new MutableTextBlock() + block.parentId = card.id + block.rootId = card.rootId + block.title = 'title' + block.order = 100 + + return block + } + + static createImage(card: Card): ImageBlock { + const block = new MutableImageBlock() + block.parentId = card.id + block.rootId = card.rootId + block.url = 'url' + block.order = 100 + + return block + } + + static createDivider(card: Card): DividerBlock { + const block = new MutableDividerBlock() + block.parentId = card.id + block.rootId = card.rootId + block.title = 'title' + block.order = 100 + + return block + } +} + +export {TestBlockFactory} diff --git a/webapp/src/viewModel/cardTree.test.ts b/webapp/src/viewModel/cardTree.test.ts index 16925c224..993e39d40 100644 --- a/webapp/src/viewModel/cardTree.test.ts +++ b/webapp/src/viewModel/cardTree.test.ts @@ -5,12 +5,7 @@ console.log = jest.fn() import 'isomorphic-fetch' -import {IBlock} from '../blocks/block' -import {Card, MutableCard} from '../blocks/card' -import {MutableCommentBlock} from '../blocks/commentBlock' -import {DividerBlock, MutableDividerBlock} from '../blocks/dividerBlock' -import {ImageBlock, MutableImageBlock} from '../blocks/imageBlock' -import {MutableTextBlock, TextBlock} from '../blocks/textBlock' +import {TestBlockFactory} from '../test/block' import {MutableCardTree} from './cardTree' @@ -25,21 +20,15 @@ beforeEach(() => { fetchMock.mockReset() }) -test('CardTree: sync', async () => { - const blocks: IBlock[] = [] - const card = createCard() +test('CardTree', async () => { + const card = TestBlockFactory.createCard() expect(card.id).not.toBeNull() - blocks.push(card) - const comment = createComment(card) - blocks.push(comment) - const text = createText(card) - blocks.push(text) - const image = createImage(card) - blocks.push(image) - const divider = createDivider(card) - blocks.push(divider) + const comment = TestBlockFactory.createComment(card) + const text = TestBlockFactory.createText(card) + const image = TestBlockFactory.createImage(card) + const divider = TestBlockFactory.createDivider(card) - fetchMock.mockReturnValueOnce(jsonResponse(JSON.stringify(blocks))) + fetchMock.mockReturnValueOnce(jsonResponse(JSON.stringify([card, comment, text, image, divider]))) const cardTree = new MutableCardTree(card.id) await cardTree.sync() @@ -49,26 +38,19 @@ test('CardTree: sync', async () => { expect(cardTree.contents).toEqual([text, image, divider]) // Incremental update - const blocks2: IBlock[] = [] - const comment2 = createComment(card) - blocks2.push(comment2) - const text2 = createText(card) - blocks2.push(text2) - const image2 = createImage(card) - blocks2.push(image2) - const divider2 = createDivider(card) - blocks2.push(divider2) + const comment2 = TestBlockFactory.createComment(card) + const text2 = TestBlockFactory.createText(card) + const image2 = TestBlockFactory.createImage(card) + const divider2 = TestBlockFactory.createDivider(card) - expect(cardTree.incrementalUpdate(blocks2)).toBe(true) + expect(cardTree.incrementalUpdate([comment2, text2, image2, divider2])).toBe(true) expect(cardTree.comments).toEqual([comment, comment2]) expect(cardTree.contents).toEqual([text, image, divider, text2, image2, divider2]) // Incremental update: No change - const blocks3: IBlock[] = [] - const comment3 = createComment(card) - comment3.parentId = 'another parent' - blocks3.push(comment3) - expect(cardTree.incrementalUpdate(blocks3)).toBe(false) + const anotherCard = TestBlockFactory.createCard() + const comment3 = TestBlockFactory.createComment(anotherCard) + expect(cardTree.incrementalUpdate([comment3])).toBe(false) // Copy const cardTree2 = cardTree.mutableCopy() @@ -80,53 +62,3 @@ async function jsonResponse(json: string) { const response = new Response(json) return response } - -function createCard(): Card { - const card = new MutableCard() - card.parentId = 'parent' - card.rootId = 'root' - card.title = 'title' - card.icon = 'i' - card.properties.property1 = 'value1' - - return card -} - -function createComment(card: Card): MutableCommentBlock { - const block = new MutableCommentBlock() - block.parentId = card.id - block.rootId = card.rootId - block.title = 'title' - - return block -} - -function createText(card: Card): TextBlock { - const block = new MutableTextBlock() - block.parentId = card.id - block.rootId = card.rootId - block.title = 'title' - block.order = 100 - - return block -} - -function createImage(card: Card): ImageBlock { - const block = new MutableImageBlock() - block.parentId = card.id - block.rootId = card.rootId - block.url = 'url' - block.order = 100 - - return block -} - -function createDivider(card: Card): DividerBlock { - const block = new MutableDividerBlock() - block.parentId = card.id - block.rootId = card.rootId - block.title = 'title' - block.order = 100 - - return block -} diff --git a/webapp/src/viewModel/workspaceTree.test.ts b/webapp/src/viewModel/workspaceTree.test.ts new file mode 100644 index 000000000..eaabcfc0d --- /dev/null +++ b/webapp/src/viewModel/workspaceTree.test.ts @@ -0,0 +1,67 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. +console.log = jest.fn() + +import 'isomorphic-fetch' +import {TestBlockFactory} from '../test/block' + +import {MutableWorkspaceTree} from './workspaceTree' + +const fetchMock = jest.fn(async () => { + const response = new Response() + return response +}) + +global.fetch = fetchMock + +beforeEach(() => { + fetchMock.mockReset() +}) + +test('WorkspaceTree', async () => { + const board = TestBlockFactory.createBoard() + const boardTemplate = TestBlockFactory.createBoard() + boardTemplate.isTemplate = true + const view = TestBlockFactory.createBoardView() + + // Sync + fetchMock.mockReturnValueOnce(jsonResponse(JSON.stringify([board, boardTemplate]))) + fetchMock.mockReturnValueOnce(jsonResponse(JSON.stringify([view]))) + const workspaceTree = new MutableWorkspaceTree() + await workspaceTree.sync() + + expect(fetchMock).toBeCalledTimes(2) + expect(workspaceTree.boards).toEqual([board]) + expect(workspaceTree.boardTemplates).toEqual([boardTemplate]) + expect(workspaceTree.views).toEqual([view]) + + // Incremental update + const board2 = TestBlockFactory.createBoard() + const boardTemplate2 = TestBlockFactory.createBoard() + boardTemplate2.isTemplate = true + const view2 = TestBlockFactory.createBoardView() + + expect(workspaceTree.incrementalUpdate([board2, boardTemplate2, view2])).toBe(true) + expect(workspaceTree.boards).toEqual([board, board2]) + expect(workspaceTree.boardTemplates).toEqual([boardTemplate, boardTemplate2]) + expect(workspaceTree.views).toEqual([view, view2]) + + // Incremental update: No change + const card = TestBlockFactory.createCard() + expect(workspaceTree.incrementalUpdate([card])).toBe(false) + expect(workspaceTree.boards).toEqual([board, board2]) + expect(workspaceTree.boardTemplates).toEqual([boardTemplate, boardTemplate2]) + expect(workspaceTree.views).toEqual([view, view2]) + + // Copy + const workspaceTree2 = workspaceTree.mutableCopy() + expect(workspaceTree2).toEqual(workspaceTree) + expect(workspaceTree2.boards).toEqual(workspaceTree.boards) + expect(workspaceTree2.boardTemplates).toEqual(workspaceTree.boardTemplates) + expect(workspaceTree2.views).toEqual(workspaceTree.views) +}) + +async function jsonResponse(json: string) { + const response = new Response(json) + return response +}