diff --git a/__mocks__/@linguiMacro.ts b/__mocks__/@linguiMacro.ts index 5a0c157331..a1154b42dd 100644 --- a/__mocks__/@linguiMacro.ts +++ b/__mocks__/@linguiMacro.ts @@ -1,3 +1,4 @@ module.exports = { Trans: ({ children }: { children: React.ReactNode }) => children, + t: (message: string) => message }; diff --git a/__mocks__/imageMock.ts b/__mocks__/imageMock.ts new file mode 100644 index 0000000000..a099545376 --- /dev/null +++ b/__mocks__/imageMock.ts @@ -0,0 +1 @@ +module.exports = {}; \ No newline at end of file diff --git a/package.json b/package.json index 2a5b194ad6..cecf4a39f6 100644 --- a/package.json +++ b/package.json @@ -76,6 +76,7 @@ }, "moduleNameMapper": { "\\.(css|scss)$": "/__mocks__/styleMock.ts", + "\\.(svg)$": "/__mocks__/imageMock.ts", "^@lingui/macro$": "/__mocks__/@linguiMacro.ts" }, "modulePathIgnorePatterns": [ @@ -83,7 +84,8 @@ "/src/extensions/npm" ], "setupFiles": [ - "/src/jest.setup.ts" + "/src/jest.setup.ts", + "jest-canvas-mock" ] }, "build": { @@ -212,6 +214,7 @@ "fs-extra": "^9.0.1", "handlebars": "^4.7.6", "http-proxy": "^1.18.1", + "jest-canvas-mock": "^2.3.0", "js-yaml": "^3.14.0", "jsdom": "^16.4.0", "jsonpath": "^1.0.2", diff --git a/src/renderer/components/dock/__test__/dock-tabs.test.tsx b/src/renderer/components/dock/__test__/dock-tabs.test.tsx new file mode 100644 index 0000000000..bcdf9de94e --- /dev/null +++ b/src/renderer/components/dock/__test__/dock-tabs.test.tsx @@ -0,0 +1,129 @@ + + +import React from "react"; +import { render, fireEvent } from "@testing-library/react"; +import "@testing-library/jest-dom/extend-expect"; + +import { DockTabs } from "../dock-tabs"; +import { dockStore, TabKind } from "../dock.store"; +import { createResourceTab } from "../create-resource.store"; +import { createTerminalTab } from "../terminal.store"; + +const onChangeTab = jest.fn(); +const getComponent = () => ( + +); + +const renderTabs = () => render(getComponent()); + +const getTabKinds = () => dockStore.tabs.map(tab => tab.kind); + +describe("", () => { + beforeEach(() => { + createTerminalTab(); + createResourceTab(); + createTerminalTab(); + createResourceTab(); + createTerminalTab(); + }); + + afterEach(() => { + dockStore.reset(); + }); + + it("renders w/o errors", () => { + const { container } = renderTabs(); + + expect(container).toBeInstanceOf(HTMLElement); + }); + + it("has 6 tabs (1 tab is initial terminal)", () => { + const { container } = renderTabs(); + const tabs = container.querySelectorAll(".Tab"); + + expect(tabs.length).toBe(6); + }); + + it("opens a context menu", () => { + const { container, getByText } = renderTabs(); + const tab = container.querySelector(".Tab"); + + fireEvent.contextMenu(tab); + expect(getByText("Close all tabs")).toBeInTheDocument(); + }); + + it("closes selected tab", () => { + const { container, getByText, rerender } = renderTabs(); + const tab = container.querySelector(".Tab"); + + fireEvent.contextMenu(tab); + const command = getByText("Close"); + + fireEvent.click(command); + rerender(getComponent()); + const tabs = container.querySelectorAll(".Tab"); + + expect(tabs.length).toBe(5); + expect(getTabKinds()).toEqual([ + TabKind.TERMINAL, + TabKind.CREATE_RESOURCE, + TabKind.TERMINAL, + TabKind.CREATE_RESOURCE, + TabKind.TERMINAL + ]); + }); + + it("closes other tabs", () => { + const { container, getByText, rerender } = renderTabs(); + const tab = container.querySelectorAll(".Tab")[3]; + + fireEvent.contextMenu(tab); + const command = getByText("Close other tabs"); + + fireEvent.click(command); + rerender(getComponent()); + const tabs = container.querySelectorAll(".Tab"); + + expect(tabs.length).toBe(1); + expect(getTabKinds()).toEqual([TabKind.TERMINAL]); + }); + + it("closes all tabs", () => { + const { container, getByText, rerender } = renderTabs(); + const tab = container.querySelector(".Tab"); + + fireEvent.contextMenu(tab); + const command = getByText("Close all tabs"); + + fireEvent.click(command); + rerender(getComponent()); + const tabs = container.querySelectorAll(".Tab"); + + expect(tabs.length).toBe(0); + }); + + it("closes tabs to the right", () => { + const { container, getByText, rerender } = renderTabs(); + const tab = container.querySelectorAll(".Tab")[3]; + + fireEvent.contextMenu(tab); + const command = getByText("Close tabs to the right"); + + fireEvent.click(command); + rerender(getComponent()); + const tabs = container.querySelectorAll(".Tab"); + + expect(tabs.length).toBe(4); + expect(getTabKinds()).toEqual([ + TabKind.TERMINAL, + TabKind.TERMINAL, + TabKind.CREATE_RESOURCE, + TabKind.TERMINAL + ]); + }); +}); diff --git a/yarn.lock b/yarn.lock index 88f6fd3d0e..c2b0efc19c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4482,7 +4482,7 @@ color-name@1.1.3: resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25" integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU= -color-name@^1.0.0, color-name@~1.1.4: +color-name@^1.0.0, color-name@^1.1.4, color-name@~1.1.4: version "1.1.4" resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2" integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA== @@ -5016,6 +5016,11 @@ cssesc@^3.0.0: resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee" integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg== +cssfontparser@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/cssfontparser/-/cssfontparser-1.2.1.tgz#f4022fc8f9700c68029d542084afbaf425a3f3e3" + integrity sha1-9AIvyPlwDGgCnVQghK+69CWj8+M= + cssom@^0.4.4: version "0.4.4" resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.4.4.tgz#5a66cf93d2d0b661d80bf6a44fb65f5c2e4e0a10" @@ -8423,6 +8428,14 @@ jake@^10.6.1: filelist "^1.0.1" minimatch "^3.0.4" +jest-canvas-mock@^2.3.0: + version "2.3.0" + resolved "https://registry.yarnpkg.com/jest-canvas-mock/-/jest-canvas-mock-2.3.0.tgz#50f4cc178ae52c4c0e2ce4fd3a3ad2a41ad4eb36" + integrity sha512-3TMyR66VG2MzAW8Negzec03bbcIjVJMfGNvKzrEnbws1CYKqMNkvIJ8LbkoGYfp42tKqDmhIpQq3v+MNLW2A2w== + dependencies: + cssfontparser "^1.2.1" + moo-color "^1.0.2" + jest-changed-files@^26.0.1: version "26.0.1" resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-26.0.1.tgz#1334630c6a1ad75784120f39c3aa9278e59f349f" @@ -10168,6 +10181,13 @@ moment@^2.10.2, moment@^2.26.0: resolved "https://registry.yarnpkg.com/moment/-/moment-2.26.0.tgz#5e1f82c6bafca6e83e808b30c8705eed0dcbd39a" integrity sha512-oIixUO+OamkUkwjhAVE18rAMfRJNsNe/Stid/gwHSOfHrOtw9EhAY2AHvdKZ/k/MggcYELFCJz/Sn2pL8b8JMw== +moo-color@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/moo-color/-/moo-color-1.0.2.tgz#837c40758d2d58763825d1359a84e330531eca64" + integrity sha512-5iXz5n9LWQzx/C2WesGFfpE6RLamzdHwsn3KpfzShwbfIqs7stnoEpaNErf/7+3mbxwZ4s8Foq7I0tPxw7BWHg== + dependencies: + color-name "^1.1.4" + move-concurrently@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"