diff options
Diffstat (limited to 'devtools/client/debugger/src/components/test')
14 files changed, 4041 insertions, 0 deletions
diff --git a/devtools/client/debugger/src/components/test/A11yIntention.spec.js b/devtools/client/debugger/src/components/test/A11yIntention.spec.js new file mode 100644 index 0000000000..6a529b851d --- /dev/null +++ b/devtools/client/debugger/src/components/test/A11yIntention.spec.js @@ -0,0 +1,33 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ + +import React from "react"; +import { shallow } from "enzyme"; +import A11yIntention from "../A11yIntention"; + +function render() { + return shallow( + <A11yIntention> + <span>hello world</span> + </A11yIntention> + ); +} + +describe("A11yIntention", () => { + it("renders its children", () => { + const component = render(); + expect(component).toMatchSnapshot(); + }); + + it("indicates that the mouse or keyboard is being used", () => { + const component = render(); + expect(component.prop("className")).toEqual("A11y-mouse"); + + component.simulate("keyDown"); + expect(component.prop("className")).toEqual("A11y-keyboard"); + + component.simulate("mouseDown"); + expect(component.prop("className")).toEqual("A11y-mouse"); + }); +}); diff --git a/devtools/client/debugger/src/components/test/Outline.spec.js b/devtools/client/debugger/src/components/test/Outline.spec.js new file mode 100644 index 0000000000..c104da53c3 --- /dev/null +++ b/devtools/client/debugger/src/components/test/Outline.spec.js @@ -0,0 +1,304 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ + +import React from "react"; +import { shallow } from "enzyme"; +import Outline from "../../components/PrimaryPanes/Outline"; +import { makeSymbolDeclaration } from "../../utils/test-head"; +import { mockcx } from "../../utils/test-mockup"; +import { showMenu } from "../../context-menu/menu"; +import { copyToTheClipboard } from "../../utils/clipboard"; + +jest.mock("../../context-menu/menu", () => ({ showMenu: jest.fn() })); +jest.mock("../../utils/clipboard", () => ({ copyToTheClipboard: jest.fn() })); + +const sourceId = "id"; +const mockFunctionText = "mock function text"; + +function generateDefaults(overrides) { + return { + cx: mockcx, + selectLocation: jest.fn(), + selectedSource: { id: sourceId }, + getFunctionText: jest.fn().mockReturnValue(mockFunctionText), + flashLineRange: jest.fn(), + isHidden: false, + symbols: {}, + selectedLocation: { id: sourceId }, + onAlphabetizeClick: jest.fn(), + ...overrides, + }; +} + +function render(overrides = {}) { + const props = generateDefaults(overrides); + const component = shallow(<Outline.WrappedComponent {...props} />); + const instance = component.instance(); + return { component, props, instance }; +} + +describe("Outline", () => { + afterEach(() => { + copyToTheClipboard.mockClear(); + showMenu.mockClear(); + }); + + it("renders a list of functions when properties change", async () => { + const symbols = { + functions: [ + makeSymbolDeclaration("my_example_function1", 21), + makeSymbolDeclaration("my_example_function2", 22), + ], + }; + + const { component } = render({ symbols }); + expect(component).toMatchSnapshot(); + }); + + it("selects a line of code in the current file on click", async () => { + const startLine = 12; + const symbols = { + functions: [makeSymbolDeclaration("my_example_function", startLine)], + }; + + const { component, props } = render({ symbols }); + + const { selectLocation } = props; + const listItem = component.find("li").first(); + listItem.simulate("click"); + expect(selectLocation).toHaveBeenCalledWith(mockcx, { + line: startLine, + column: undefined, + sourceId, + source: { + id: sourceId, + }, + sourceActor: null, + sourceActorId: undefined, + sourceUrl: "", + }); + }); + + describe("renders outline", () => { + describe("renders loading", () => { + it("if symbols is not defined", () => { + const { component } = render({ + symbols: null, + }); + expect(component).toMatchSnapshot(); + }); + }); + + it("renders ignore anonymous functions", async () => { + const symbols = { + functions: [ + makeSymbolDeclaration("my_example_function1", 21), + makeSymbolDeclaration("anonymous", 25), + ], + }; + + const { component } = render({ symbols }); + expect(component).toMatchSnapshot(); + }); + describe("renders placeholder", () => { + it("`No File Selected` if selectedSource is not defined", async () => { + const { component } = render({ + selectedSource: null, + }); + expect(component).toMatchSnapshot(); + }); + + it("`No functions` if all func are anonymous", async () => { + const symbols = { + functions: [ + makeSymbolDeclaration("anonymous", 25), + makeSymbolDeclaration("anonymous", 30), + ], + }; + + const { component } = render({ symbols }); + expect(component).toMatchSnapshot(); + }); + + it("`No functions` if symbols has no func", async () => { + const symbols = { + functions: [], + }; + const { component } = render({ symbols }); + expect(component).toMatchSnapshot(); + }); + }); + + it("sorts functions alphabetically by function name", async () => { + const symbols = { + functions: [ + makeSymbolDeclaration("c_function", 25), + makeSymbolDeclaration("x_function", 30), + makeSymbolDeclaration("a_function", 70), + ], + }; + + const { component } = render({ + symbols, + alphabetizeOutline: true, + }); + expect(component).toMatchSnapshot(); + }); + + it("calls onAlphabetizeClick when sort button is clicked", async () => { + const symbols = { + functions: [makeSymbolDeclaration("example_function", 25)], + }; + + const { component, props } = render({ symbols }); + + await component + .find(".outline-footer") + .find("button") + .simulate("click", {}); + + expect(props.onAlphabetizeClick).toHaveBeenCalled(); + }); + + it("renders functions by function class", async () => { + const symbols = { + functions: [ + makeSymbolDeclaration("x_function", 25, 26, "x_klass"), + makeSymbolDeclaration("a2_function", 30, 31, "a_klass"), + makeSymbolDeclaration("a1_function", 70, 71, "a_klass"), + ], + classes: [ + makeSymbolDeclaration("x_klass", 24, 27), + makeSymbolDeclaration("a_klass", 29, 72), + ], + }; + + const { component } = render({ symbols }); + expect(component).toMatchSnapshot(); + }); + + it("renders functions by function class, alphabetically", async () => { + const symbols = { + functions: [ + makeSymbolDeclaration("x_function", 25, 26, "x_klass"), + makeSymbolDeclaration("a2_function", 30, 31, "a_klass"), + makeSymbolDeclaration("a1_function", 70, 71, "a_klass"), + ], + classes: [ + makeSymbolDeclaration("x_klass", 24, 27), + makeSymbolDeclaration("a_klass", 29, 72), + ], + }; + + const { component } = render({ + symbols, + alphabetizeOutline: true, + }); + expect(component).toMatchSnapshot(); + }); + + it("selects class on click on class headline", async () => { + const symbols = { + functions: [makeSymbolDeclaration("x_function", 25, 26, "x_klass")], + classes: [makeSymbolDeclaration("x_klass", 24, 27)], + }; + + const { component, props } = render({ symbols }); + + await component.find("h2").simulate("click", {}); + + expect(props.selectLocation).toHaveBeenCalledWith(mockcx, { + line: 24, + column: undefined, + sourceId, + source: { + id: sourceId, + }, + sourceActor: null, + sourceActorId: undefined, + sourceUrl: "", + }); + }); + + it("does not select an item if selectedSource is not defined", async () => { + const { instance, props } = render({ selectedSource: null }); + await instance.selectItem({}); + expect(props.selectLocation).not.toHaveBeenCalled(); + }); + }); + + describe("onContextMenu of Outline", () => { + it("is called onContextMenu for each item", async () => { + const event = { event: "oncontextmenu" }; + const fn = makeSymbolDeclaration("exmple_function", 2); + const symbols = { + functions: [fn], + }; + + const { component, instance } = render({ symbols }); + instance.onContextMenu = jest.fn(() => {}); + await component + .find(".outline-list__element") + .simulate("contextmenu", event); + + expect(instance.onContextMenu).toHaveBeenCalledWith(event, fn); + }); + + it("does not show menu with no selected source", async () => { + const mockEvent = { + preventDefault: jest.fn(), + stopPropagation: jest.fn(), + }; + const { instance } = render({ + selectedSource: null, + }); + await instance.onContextMenu(mockEvent, {}); + expect(mockEvent.preventDefault).toHaveBeenCalled(); + expect(mockEvent.stopPropagation).toHaveBeenCalled(); + expect(showMenu).not.toHaveBeenCalled(); + }); + + it("shows menu to copy func, copies to clipboard on click", async () => { + const startLine = 12; + const endLine = 21; + const func = makeSymbolDeclaration( + "my_example_function", + startLine, + endLine + ); + const symbols = { + functions: [func], + }; + const mockEvent = { + preventDefault: jest.fn(), + stopPropagation: jest.fn(), + }; + const { instance, props } = render({ symbols }); + await instance.onContextMenu(mockEvent, func); + + expect(mockEvent.preventDefault).toHaveBeenCalled(); + expect(mockEvent.stopPropagation).toHaveBeenCalled(); + + const expectedMenuOptions = [ + { + accesskey: "F", + click: expect.any(Function), + disabled: false, + id: "node-menu-copy-function", + label: "Copy function", + }, + ]; + expect(props.getFunctionText).toHaveBeenCalledWith(12); + expect(showMenu).toHaveBeenCalledWith(mockEvent, expectedMenuOptions); + + showMenu.mock.calls[0][1][0].click(); + expect(copyToTheClipboard).toHaveBeenCalledWith(mockFunctionText); + expect(props.flashLineRange).toHaveBeenCalledWith({ + end: endLine, + sourceId, + start: startLine, + }); + }); + }); +}); diff --git a/devtools/client/debugger/src/components/test/OutlineFilter.spec.js b/devtools/client/debugger/src/components/test/OutlineFilter.spec.js new file mode 100644 index 0000000000..91ec7c0d97 --- /dev/null +++ b/devtools/client/debugger/src/components/test/OutlineFilter.spec.js @@ -0,0 +1,45 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ + +import React from "react"; +import { shallow } from "enzyme"; +import OutlineFilter from "../../components/PrimaryPanes/OutlineFilter"; + +function generateDefaults(overrides) { + return { + filter: "", + updateFilter: jest.fn(), + ...overrides, + }; +} + +function render(overrides = {}) { + const props = generateDefaults(overrides); + const component = shallow(<OutlineFilter {...props} />); + const instance = component.instance(); + return { component, props, instance }; +} + +describe("OutlineFilter", () => { + it("shows an input with no value when filter is empty", async () => { + const { component } = render({ filter: "" }); + expect(component).toMatchSnapshot(); + }); + + it("shows an input with the filter when it is not empty", async () => { + const { component } = render({ filter: "abc" }); + expect(component).toMatchSnapshot(); + }); + + it("calls props.updateFilter on change", async () => { + const updateFilter = jest.fn(); + const { component } = render({ updateFilter }); + const input = component.find("input"); + input.simulate("change", { target: { value: "a" } }); + input.simulate("change", { target: { value: "ab" } }); + expect(updateFilter).toHaveBeenCalled(); + expect(updateFilter.mock.calls[0][0]).toBe("a"); + expect(updateFilter.mock.calls[1][0]).toBe("ab"); + }); +}); diff --git a/devtools/client/debugger/src/components/test/QuickOpenModal.spec.js b/devtools/client/debugger/src/components/test/QuickOpenModal.spec.js new file mode 100644 index 0000000000..3cd21bac05 --- /dev/null +++ b/devtools/client/debugger/src/components/test/QuickOpenModal.spec.js @@ -0,0 +1,898 @@ +/* eslint max-nested-callbacks: ["error", 4] */ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ + +import React from "react"; +import { Provider } from "react-redux"; +import configureStore from "redux-mock-store"; + +import { shallow, mount } from "enzyme"; +import { QuickOpenModal } from "../QuickOpenModal"; +import { mockcx } from "../../utils/test-mockup"; +import { getDisplayURL } from "../../utils/sources-tree/getURL"; +import { searchKeys } from "../../constants"; + +jest.mock("fuzzaldrin-plus"); + +import { filter } from "fuzzaldrin-plus"; + +function generateModal(propOverrides, renderType = "shallow") { + const mockStore = configureStore([]); + const store = mockStore({ + ui: { + mutableSearchOptions: { + [searchKeys.QUICKOPEN_SEARCH]: { + regexMatch: false, + wholeWord: false, + caseSensitive: false, + excludePatterns: "", + }, + }, + }, + }); + const props = { + cx: mockcx, + enabled: false, + query: "", + searchType: "sources", + displayedSources: [], + blackBoxRanges: {}, + tabUrls: [], + selectSpecificLocation: jest.fn(), + setQuickOpenQuery: jest.fn(), + highlightLineRange: jest.fn(), + clearHighlightLineRange: jest.fn(), + closeQuickOpen: jest.fn(), + shortcutsModalEnabled: false, + symbols: { functions: [] }, + symbolsLoading: false, + toggleShortcutsModal: jest.fn(), + isOriginal: false, + thread: "FakeThread", + ...propOverrides, + }; + return { + wrapper: + renderType === "shallow" + ? shallow( + <Provider store={store}> + <QuickOpenModal {...props} /> + </Provider> + ).dive() + : mount( + <Provider store={store}> + <QuickOpenModal {...props} /> + </Provider> + ), + props, + }; +} + +function generateQuickOpenResult(title) { + return { + id: "qor", + value: "", + title, + }; +} + +async function waitForUpdateResultsThrottle() { + await new Promise(res => + setTimeout(res, QuickOpenModal.UPDATE_RESULTS_THROTTLE) + ); +} + +describe("QuickOpenModal", () => { + beforeEach(() => { + filter.mockClear(); + }); + test("Doesn't render when disabled", () => { + const { wrapper } = generateModal(); + expect(wrapper).toMatchSnapshot(); + }); + + test("Renders when enabled", () => { + const { wrapper } = generateModal({ enabled: true }); + expect(wrapper).toMatchSnapshot(); + }); + + test("Basic render with mount", () => { + const { wrapper } = generateModal({ enabled: true }, "mount"); + expect(wrapper).toMatchSnapshot(); + }); + + test("Basic render with mount & searchType = functions", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "@", + searchType: "functions", + symbols: { + functions: [], + variables: [], + }, + }, + "mount" + ); + expect(wrapper).toMatchSnapshot(); + }); + + test("toggles shortcut modal if enabled", () => { + const { props } = generateModal( + { + enabled: true, + query: "test", + shortcutsModalEnabled: true, + toggleShortcutsModal: jest.fn(), + }, + "shallow" + ); + expect(props.toggleShortcutsModal).toHaveBeenCalled(); + }); + + test("shows top sources", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "", + displayedSources: [ + { + url: "mozilla.com", + displayURL: getDisplayURL("mozilla.com"), + }, + ], + tabUrls: ["mozilla.com"], + }, + "shallow" + ); + expect(wrapper.state("results")).toEqual([ + { + id: undefined, + icon: "tab result-item-icon", + subtitle: "mozilla.com", + title: "mozilla.com", + url: "mozilla.com", + value: "mozilla.com", + source: { + url: "mozilla.com", + displayURL: getDisplayURL("mozilla.com"), + }, + }, + ]); + }); + + describe("shows loading", () => { + it("loads with function type search", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "", + searchType: "functions", + symbolsLoading: true, + }, + "shallow" + ); + expect(wrapper).toMatchSnapshot(); + }); + }); + + test("Ensure anonymous functions do not render in QuickOpenModal", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "@", + searchType: "functions", + symbols: { + functions: [ + generateQuickOpenResult("anonymous"), + generateQuickOpenResult("c"), + generateQuickOpenResult("anonymous"), + ], + variables: [], + }, + }, + "mount" + ); + expect(wrapper.find("ResultList")).toHaveLength(1); + expect(wrapper.find("li")).toHaveLength(1); + }); + + test("Basic render with mount & searchType = variables", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "#", + searchType: "variables", + symbols: { + functions: [], + variables: [], + }, + }, + "mount" + ); + expect(wrapper).toMatchSnapshot(); + }); + + test("Basic render with mount & searchType = shortcuts", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "?", + searchType: "shortcuts", + symbols: { + functions: [], + variables: [], + }, + }, + "mount" + ); + expect(wrapper.find("ResultList")).toHaveLength(1); + expect(wrapper.find("li")).toHaveLength(3); + }); + + test("updateResults on enable", () => { + const { wrapper } = generateModal({}, "mount"); + expect(wrapper).toMatchSnapshot(); + wrapper.setProps({ enabled: true }); + expect(wrapper).toMatchSnapshot(); + }); + + test("basic source search", async () => { + const { wrapper } = generateModal( + { + enabled: true, + symbols: { + functions: [], + variables: [], + }, + }, + "mount" + ); + wrapper.find("input").simulate("change", { target: { value: "somefil" } }); + await waitForUpdateResultsThrottle(); + expect(filter).toHaveBeenCalledWith([], "somefil", { + key: "value", + maxResults: 100, + }); + }); + + test("basic gotoSource search", async () => { + const { wrapper } = generateModal( + { + enabled: true, + searchType: "gotoSource", + symbols: { + functions: [], + variables: [], + }, + }, + "mount" + ); + wrapper + .find("input") + .simulate("change", { target: { value: "somefil:33" } }); + + await waitForUpdateResultsThrottle(); + + expect(filter).toHaveBeenCalledWith([], "somefil", { + key: "value", + maxResults: 100, + }); + }); + + describe("empty symbol search", () => { + it("basic symbol search", async () => { + const { wrapper } = generateModal( + { + enabled: true, + searchType: "functions", + symbols: { + functions: [], + variables: [], + }, + // symbol searching relies on a source being selected. + // So we dummy out the source and the API. + selectedSource: { id: "foo", text: "yo" }, + selectedContentLoaded: true, + }, + "mount" + ); + + wrapper + .find("input") + .simulate("change", { target: { value: "@someFunc" } }); + await waitForUpdateResultsThrottle(); + expect(filter).toHaveBeenCalledWith([], "someFunc", { + key: "value", + maxResults: 100, + }); + }); + + it("does not do symbol search if no selected source", () => { + const { wrapper } = generateModal( + { + enabled: true, + searchType: "functions", + symbols: { + functions: [], + variables: [], + }, + // symbol searching relies on a source being selected. + // So we dummy out the source and the API. + selectedSource: null, + selectedContentLoaded: false, + }, + "mount" + ); + wrapper + .find("input") + .simulate("change", { target: { value: "@someFunc" } }); + expect(filter).not.toHaveBeenCalled(); + }); + }); + + test("Simple goto search query = :abc & searchType = goto", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: ":abc", + searchType: "goto", + symbols: { + functions: [], + variables: [], + }, + }, + "mount" + ); + expect(wrapper.childAt(0)).toMatchSnapshot(); + expect(wrapper.childAt(0).state().results).toEqual(null); + }); + + describe("onEnter", () => { + it("on Enter go to location", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: ":34:12", + searchType: "goto", + selectedSource: { id: "foo" }, + }, + "shallow" + ); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.selectSpecificLocation).toHaveBeenCalledWith(mockcx, { + column: 12, + line: 34, + sourceId: "foo", + source: { + id: "foo", + }, + sourceActorId: undefined, + sourceActor: null, + sourceUrl: "", + }); + }); + + it("on Enter go to location with sourceId", () => { + const sourceId = "source_id"; + const { wrapper, props } = generateModal( + { + enabled: true, + query: ":34:12", + searchType: "goto", + selectedSource: { id: sourceId }, + selectedContentLoaded: true, + }, + "shallow" + ); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.selectSpecificLocation).toHaveBeenCalledWith(mockcx, { + column: 12, + line: 34, + sourceId, + source: { + id: sourceId, + }, + sourceActorId: undefined, + sourceActor: null, + sourceUrl: "", + }); + }); + + it("on Enter with no location, does no action", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: ":", + searchType: "goto", + }, + "shallow" + ); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.setQuickOpenQuery).not.toHaveBeenCalled(); + expect(props.selectSpecificLocation).not.toHaveBeenCalled(); + expect(props.highlightLineRange).not.toHaveBeenCalled(); + }); + + it("on Enter with empty results, handle no item", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: "", + searchType: "shortcuts", + }, + "shallow" + ); + wrapper.setState(() => ({ + results: [], + selectedIndex: 0, + })); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.setQuickOpenQuery).not.toHaveBeenCalled(); + expect(props.selectSpecificLocation).not.toHaveBeenCalled(); + expect(props.highlightLineRange).not.toHaveBeenCalled(); + }); + + it("on Enter with results, handle symbol shortcut", () => { + const symbols = [":", "#", "@"]; + for (const symbol of symbols) { + const { wrapper, props } = generateModal( + { + enabled: true, + query: "", + searchType: "shortcuts", + }, + "shallow" + ); + wrapper.setState(() => ({ + results: [{ id: symbol }], + selectedIndex: 0, + })); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.setQuickOpenQuery).toHaveBeenCalledWith(symbol); + } + }); + + it("on Enter, returns the result with the selected index", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: "@test", + searchType: "shortcuts", + }, + "shallow" + ); + wrapper.setState(() => ({ + results: [{ id: "@" }, { id: ":" }, { id: "#" }], + selectedIndex: 1, + })); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.setQuickOpenQuery).toHaveBeenCalledWith(":"); + }); + + it("on Enter with results, handle result item", () => { + const id = "test_id"; + const { wrapper, props } = generateModal( + { + enabled: true, + query: "@test", + searchType: "other", + selectedSource: { id }, + }, + "shallow" + ); + wrapper.setState(() => ({ + results: [{}, { id }], + selectedIndex: 1, + })); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.selectSpecificLocation).toHaveBeenCalledWith(mockcx, { + column: undefined, + sourceId: id, + line: 0, + source: { id }, + sourceActorId: undefined, + sourceActor: null, + sourceUrl: "", + }); + expect(props.setQuickOpenQuery).not.toHaveBeenCalled(); + }); + + it("on Enter with results, handle functions result item", () => { + const id = "test_id"; + const { wrapper, props } = generateModal( + { + enabled: true, + query: "@test", + searchType: "functions", + symbols: { + functions: [], + variables: {}, + }, + selectedSource: { id }, + }, + "shallow" + ); + wrapper.setState(() => ({ + results: [{}, { id }], + selectedIndex: 1, + })); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.selectSpecificLocation).toHaveBeenCalledWith(mockcx, { + column: undefined, + line: 0, + sourceId: id, + source: { id }, + sourceActorId: undefined, + sourceActor: null, + sourceUrl: "", + }); + expect(props.setQuickOpenQuery).not.toHaveBeenCalled(); + }); + + it("on Enter with results, handle gotoSource search", () => { + const id = "test_id"; + const { wrapper, props } = generateModal( + { + enabled: true, + query: ":3:4", + searchType: "gotoSource", + symbols: { + functions: [], + variables: {}, + }, + selectedSource: { id }, + }, + "shallow" + ); + wrapper.setState(() => ({ + results: [{}, { id }], + selectedIndex: 1, + })); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.selectSpecificLocation).toHaveBeenCalledWith(mockcx, { + column: 4, + line: 3, + sourceId: id, + source: { id }, + sourceActorId: undefined, + sourceActor: null, + sourceUrl: "", + }); + expect(props.setQuickOpenQuery).not.toHaveBeenCalled(); + }); + + it("on Enter with results, handle shortcuts search", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: "@", + searchType: "shortcuts", + symbols: { + functions: [], + variables: {}, + }, + }, + "shallow" + ); + const id = "#"; + wrapper.setState(() => ({ + results: [{}, { id }], + selectedIndex: 1, + })); + const event = { + key: "Enter", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.selectSpecificLocation).not.toHaveBeenCalled(); + expect(props.setQuickOpenQuery).toHaveBeenCalledWith(id); + }); + }); + + describe("onKeyDown", () => { + it("does nothing if search type is not goto", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: "test", + searchType: "other", + }, + "shallow" + ); + wrapper.find("Connect(SearchInput)").simulate("keydown", {}); + expect(props.selectSpecificLocation).not.toHaveBeenCalled(); + expect(props.setQuickOpenQuery).not.toHaveBeenCalled(); + }); + + it("on Tab, close modal", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: ":34:12", + searchType: "goto", + }, + "shallow" + ); + const event = { + key: "Tab", + }; + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(props.closeQuickOpen).toHaveBeenCalled(); + expect(props.selectSpecificLocation).not.toHaveBeenCalled(); + }); + }); + + describe("with arrow keys", () => { + it("on ArrowUp, traverse results up with functions", () => { + const sourceId = "sourceId"; + const { wrapper, props } = generateModal( + { + enabled: true, + query: "test", + searchType: "functions", + selectedSource: { id: sourceId }, + selectedContentLoaded: true, + symbols: { + functions: [], + variables: {}, + }, + }, + "shallow" + ); + const event = { + preventDefault: jest.fn(), + key: "ArrowUp", + }; + const location = { + sourceId: "sourceId", + start: { + line: 1, + }, + end: { + line: 3, + }, + }; + + wrapper.setState(() => ({ + results: [{ id: "0", location }, { id: "1" }, { id: "2" }], + selectedIndex: 1, + })); + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(event.preventDefault).toHaveBeenCalled(); + expect(wrapper.state().selectedIndex).toEqual(0); + expect(props.highlightLineRange).toHaveBeenCalledWith({ + sourceId: "sourceId", + end: 3, + start: 1, + }); + }); + + it("on ArrowDown, traverse down with no results", () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: "test", + searchType: "goto", + }, + "shallow" + ); + const event = { + preventDefault: jest.fn(), + key: "ArrowDown", + }; + wrapper.setState(() => ({ + results: null, + selectedIndex: 1, + })); + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(event.preventDefault).toHaveBeenCalled(); + expect(wrapper.state().selectedIndex).toEqual(0); + expect(props.selectSpecificLocation).not.toHaveBeenCalledWith(); + expect(props.highlightLineRange).not.toHaveBeenCalled(); + }); + + it("on ArrowUp, traverse results up to function with no location", () => { + const sourceId = "sourceId"; + const { wrapper, props } = generateModal( + { + enabled: true, + query: "test", + searchType: "functions", + selectedSource: { id: sourceId }, + selectedContentLoaded: true, + symbols: { + functions: [], + variables: {}, + }, + }, + "shallow" + ); + const event = { + preventDefault: jest.fn(), + key: "ArrowUp", + }; + wrapper.setState(() => ({ + results: [{ id: "0", location: null }, { id: "1" }, { id: "2" }], + selectedIndex: 1, + })); + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(event.preventDefault).toHaveBeenCalled(); + expect(wrapper.state().selectedIndex).toEqual(0); + expect(props.highlightLineRange).not.toHaveBeenCalled(); + expect(props.clearHighlightLineRange).toHaveBeenCalled(); + }); + + it( + "on ArrowDown, traverse down results, without " + + "taking action if no selectedSource", + () => { + const { wrapper, props } = generateModal( + { + enabled: true, + query: "test", + searchType: "variables", + selectedSource: null, + selectedContentLoaded: true, + symbols: { + functions: [], + variables: {}, + }, + }, + "shallow" + ); + const event = { + preventDefault: jest.fn(), + key: "ArrowDown", + }; + const location = { + sourceId: "sourceId", + start: { + line: 7, + }, + }; + wrapper.setState(() => ({ + results: [{ id: "0", location }, { id: "1" }, { id: "2" }], + selectedIndex: 1, + })); + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(event.preventDefault).toHaveBeenCalled(); + expect(wrapper.state().selectedIndex).toEqual(2); + expect(props.selectSpecificLocation).not.toHaveBeenCalled(); + expect(props.highlightLineRange).not.toHaveBeenCalled(); + } + ); + + it( + "on ArrowUp, traverse up results, without taking action if " + + "the query is not for variables or functions", + () => { + const sourceId = "sourceId"; + const { wrapper, props } = generateModal( + { + enabled: true, + query: "test", + searchType: "other", + selectedSource: { id: sourceId }, + selectedContentLoaded: true, + symbols: { + functions: [], + variables: {}, + }, + }, + "shallow" + ); + const event = { + preventDefault: jest.fn(), + key: "ArrowUp", + }; + const location = { + sourceId: "sourceId", + start: { + line: 7, + }, + }; + wrapper.setState(() => ({ + results: [{ id: "0", location }, { id: "1" }, { id: "2" }], + selectedIndex: 1, + })); + wrapper.find("Connect(SearchInput)").simulate("keydown", event); + expect(event.preventDefault).toHaveBeenCalled(); + expect(wrapper.state().selectedIndex).toEqual(0); + expect(props.selectSpecificLocation).not.toHaveBeenCalled(); + expect(props.highlightLineRange).not.toHaveBeenCalled(); + } + ); + }); + + describe("showErrorEmoji", () => { + it("true when no count + query", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "test", + searchType: "other", + }, + "mount" + ); + expect(wrapper).toMatchSnapshot(); + }); + + it("false when count + query", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "dasdasdas", + }, + "mount" + ); + wrapper.setState(() => ({ + results: [1, 2], + })); + expect(wrapper).toMatchSnapshot(); + }); + + it("false when no query", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: "", + searchType: "other", + }, + "mount" + ); + expect(wrapper).toMatchSnapshot(); + }); + + it("false when goto numeric ':2222'", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: ":2222", + searchType: "goto", + }, + "mount" + ); + expect(wrapper).toMatchSnapshot(); + }); + + it("true when goto not numeric ':22k22'", () => { + const { wrapper } = generateModal( + { + enabled: true, + query: ":22k22", + searchType: "goto", + }, + "mount" + ); + expect(wrapper).toMatchSnapshot(); + }); + }); +}); diff --git a/devtools/client/debugger/src/components/test/ShortcutsModal.spec.js b/devtools/client/debugger/src/components/test/ShortcutsModal.spec.js new file mode 100644 index 0000000000..d3264c02e0 --- /dev/null +++ b/devtools/client/debugger/src/components/test/ShortcutsModal.spec.js @@ -0,0 +1,32 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ + +import React from "react"; +import { shallow } from "enzyme"; +import { ShortcutsModal } from "../ShortcutsModal"; + +function render(overrides = {}) { + const props = { + enabled: true, + handleClose: jest.fn(), + ...overrides, + }; + const component = shallow(<ShortcutsModal {...props} />); + + return { component, props }; +} + +describe("ShortcutsModal", () => { + it("renders when enabled", () => { + const { component } = render(); + expect(component).toMatchSnapshot(); + }); + + it("renders nothing when not enabled", () => { + const { component } = render({ + enabled: false, + }); + expect(component.text()).toBe(""); + }); +}); diff --git a/devtools/client/debugger/src/components/test/WelcomeBox.spec.js b/devtools/client/debugger/src/components/test/WelcomeBox.spec.js new file mode 100644 index 0000000000..0a1dbc7459 --- /dev/null +++ b/devtools/client/debugger/src/components/test/WelcomeBox.spec.js @@ -0,0 +1,59 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ + +import React from "react"; +import { shallow } from "enzyme"; + +import { WelcomeBox } from "../WelcomeBox"; + +function render(overrides = {}) { + const props = { + horizontal: false, + togglePaneCollapse: jest.fn(), + endPanelCollapsed: false, + setActiveSearch: jest.fn(), + openQuickOpen: jest.fn(), + toggleShortcutsModal: jest.fn(), + setPrimaryPaneTab: jest.fn(), + ...overrides, + }; + const component = shallow(<WelcomeBox {...props} />); + + return { component, props }; +} + +describe("WelomeBox", () => { + it("renders with default values", () => { + const { component } = render(); + expect(component).toMatchSnapshot(); + }); + + it("doesn't render toggle button in horizontal mode", () => { + const { component } = render({ + horizontal: true, + }); + expect(component.find("PaneToggleButton")).toHaveLength(0); + }); + + it("calls correct function on searchSources click", () => { + const { component, props } = render(); + + component.find(".welcomebox__searchSources").simulate("click"); + expect(props.openQuickOpen).toHaveBeenCalled(); + }); + + it("calls correct function on searchProject click", () => { + const { component, props } = render(); + + component.find(".welcomebox__searchProject").simulate("click"); + expect(props.setActiveSearch).toHaveBeenCalled(); + }); + + it("calls correct function on allShotcuts click", () => { + const { component, props } = render(); + + component.find(".welcomebox__allShortcuts").simulate("click"); + expect(props.toggleShortcutsModal).toHaveBeenCalled(); + }); +}); diff --git a/devtools/client/debugger/src/components/test/WhyPaused.spec.js b/devtools/client/debugger/src/components/test/WhyPaused.spec.js new file mode 100644 index 0000000000..eff87c7cd1 --- /dev/null +++ b/devtools/client/debugger/src/components/test/WhyPaused.spec.js @@ -0,0 +1,59 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ + +import React from "react"; +import { shallow } from "enzyme"; +import WhyPaused from "../SecondaryPanes/WhyPaused.js"; + +function render(why, delay) { + const props = { why, delay }; + const component = shallow(<WhyPaused.WrappedComponent {...props} />); + + return { component, props }; +} + +describe("WhyPaused", () => { + it("should pause reason with message", () => { + const why = { + type: "breakpoint", + message: "bla is hit", + }; + const { component } = render(why); + expect(component).toMatchSnapshot(); + }); + + it("should show pause reason with exception details", () => { + const why = { + type: "exception", + exception: { + class: "ReferenceError", + isError: true, + preview: { + name: "ReferenceError", + message: "o is not defined", + }, + }, + }; + + const { component } = render(why); + expect(component).toMatchSnapshot(); + }); + + it("should show pause reason with exception string", () => { + const why = { + type: "exception", + exception: "Not Available", + }; + + const { component } = render(why); + expect(component).toMatchSnapshot(); + }); + + it("should show an empty div when there is no pause reason", () => { + const why = undefined; + + const { component } = render(why); + expect(component).toMatchSnapshot(); + }); +}); diff --git a/devtools/client/debugger/src/components/test/__snapshots__/A11yIntention.spec.js.snap b/devtools/client/debugger/src/components/test/__snapshots__/A11yIntention.spec.js.snap new file mode 100644 index 0000000000..80fdfa1dec --- /dev/null +++ b/devtools/client/debugger/src/components/test/__snapshots__/A11yIntention.spec.js.snap @@ -0,0 +1,13 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`A11yIntention renders its children 1`] = ` +<div + className="A11y-mouse" + onKeyDown={[Function]} + onMouseDown={[Function]} +> + <span> + hello world + </span> +</div> +`; diff --git a/devtools/client/debugger/src/components/test/__snapshots__/Outline.spec.js.snap b/devtools/client/debugger/src/components/test/__snapshots__/Outline.spec.js.snap new file mode 100644 index 0000000000..4e2e2c98fd --- /dev/null +++ b/devtools/client/debugger/src/components/test/__snapshots__/Outline.spec.js.snap @@ -0,0 +1,505 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Outline renders a list of functions when properties change 1`] = ` +<div + className="outline" +> + <div> + <OutlineFilter + filter="" + updateFilter={[Function]} + /> + <ul + className="outline-list devtools-monospace" + dir="ltr" + > + <li + className="outline-list__element" + key="my_example_function1:21:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "my_example_function1", + "parameterNames": undefined, + } + } + /> + </li> + <li + className="outline-list__element" + key="my_example_function2:22:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "my_example_function2", + "parameterNames": undefined, + } + } + /> + </li> + </ul> + <div + className="outline-footer" + > + <button + className="" + onClick={[MockFunction]} + > + Sort by name + </button> + </div> + </div> +</div> +`; + +exports[`Outline renders outline renders functions by function class 1`] = ` +<div + className="outline" +> + <div> + <OutlineFilter + filter="" + updateFilter={[Function]} + /> + <ul + className="outline-list devtools-monospace" + dir="ltr" + > + <li + className="outline-list__class" + key="x_klass" + > + <h2 + className="" + onClick={[Function]} + > + <div> + <span + className="keyword" + > + class + </span> + + x_klass + </div> + </h2> + <ul + className="outline-list__class-list" + > + <li + className="outline-list__element" + key="x_function:25:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "x_function", + "parameterNames": undefined, + } + } + /> + </li> + </ul> + </li> + <li + className="outline-list__class" + key="a_klass" + > + <h2 + className="" + onClick={[Function]} + > + <div> + <span + className="keyword" + > + class + </span> + + a_klass + </div> + </h2> + <ul + className="outline-list__class-list" + > + <li + className="outline-list__element" + key="a2_function:30:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "a2_function", + "parameterNames": undefined, + } + } + /> + </li> + <li + className="outline-list__element" + key="a1_function:70:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "a1_function", + "parameterNames": undefined, + } + } + /> + </li> + </ul> + </li> + </ul> + <div + className="outline-footer" + > + <button + className="" + onClick={[MockFunction]} + > + Sort by name + </button> + </div> + </div> +</div> +`; + +exports[`Outline renders outline renders functions by function class, alphabetically 1`] = ` +<div + className="outline" +> + <div> + <OutlineFilter + filter="" + updateFilter={[Function]} + /> + <ul + className="outline-list devtools-monospace" + dir="ltr" + > + <li + className="outline-list__class" + key="a_klass" + > + <h2 + className="" + onClick={[Function]} + > + <div> + <span + className="keyword" + > + class + </span> + + a_klass + </div> + </h2> + <ul + className="outline-list__class-list" + > + <li + className="outline-list__element" + key="a1_function:70:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "a1_function", + "parameterNames": undefined, + } + } + /> + </li> + <li + className="outline-list__element" + key="a2_function:30:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "a2_function", + "parameterNames": undefined, + } + } + /> + </li> + </ul> + </li> + <li + className="outline-list__class" + key="x_klass" + > + <h2 + className="" + onClick={[Function]} + > + <div> + <span + className="keyword" + > + class + </span> + + x_klass + </div> + </h2> + <ul + className="outline-list__class-list" + > + <li + className="outline-list__element" + key="x_function:25:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "x_function", + "parameterNames": undefined, + } + } + /> + </li> + </ul> + </li> + </ul> + <div + className="outline-footer" + > + <button + className="active" + onClick={[MockFunction]} + > + Sort by name + </button> + </div> + </div> +</div> +`; + +exports[`Outline renders outline renders ignore anonymous functions 1`] = ` +<div + className="outline" +> + <div> + <OutlineFilter + filter="" + updateFilter={[Function]} + /> + <ul + className="outline-list devtools-monospace" + dir="ltr" + > + <li + className="outline-list__element" + key="my_example_function1:21:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "my_example_function1", + "parameterNames": undefined, + } + } + /> + </li> + </ul> + <div + className="outline-footer" + > + <button + className="" + onClick={[MockFunction]} + > + Sort by name + </button> + </div> + </div> +</div> +`; + +exports[`Outline renders outline renders loading if symbols is not defined 1`] = ` +<div + className="outline-pane-info" +> + Loading… +</div> +`; + +exports[`Outline renders outline renders placeholder \`No File Selected\` if selectedSource is not defined 1`] = ` +<div + className="outline-pane-info" +> + No file selected +</div> +`; + +exports[`Outline renders outline renders placeholder \`No functions\` if all func are anonymous 1`] = ` +<div + className="outline-pane-info" +> + No functions +</div> +`; + +exports[`Outline renders outline renders placeholder \`No functions\` if symbols has no func 1`] = ` +<div + className="outline-pane-info" +> + No functions +</div> +`; + +exports[`Outline renders outline sorts functions alphabetically by function name 1`] = ` +<div + className="outline" +> + <div> + <OutlineFilter + filter="" + updateFilter={[Function]} + /> + <ul + className="outline-list devtools-monospace" + dir="ltr" + > + <li + className="outline-list__element" + key="a_function:70:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "a_function", + "parameterNames": undefined, + } + } + /> + </li> + <li + className="outline-list__element" + key="c_function:25:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "c_function", + "parameterNames": undefined, + } + } + /> + </li> + <li + className="outline-list__element" + key="x_function:30:undefined" + onClick={[Function]} + onContextMenu={[Function]} + > + <span + className="outline-list__element-icon" + > + λ + </span> + <PreviewFunction + func={ + Object { + "name": "x_function", + "parameterNames": undefined, + } + } + /> + </li> + </ul> + <div + className="outline-footer" + > + <button + className="active" + onClick={[MockFunction]} + > + Sort by name + </button> + </div> + </div> +</div> +`; diff --git a/devtools/client/debugger/src/components/test/__snapshots__/OutlineFilter.spec.js.snap b/devtools/client/debugger/src/components/test/__snapshots__/OutlineFilter.spec.js.snap new file mode 100644 index 0000000000..c4e03b77cd --- /dev/null +++ b/devtools/client/debugger/src/components/test/__snapshots__/OutlineFilter.spec.js.snap @@ -0,0 +1,39 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`OutlineFilter shows an input with no value when filter is empty 1`] = ` +<div + className="outline-filter" +> + <form> + <input + className="outline-filter-input devtools-filterinput" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Filter functions" + type="text" + value="" + /> + </form> +</div> +`; + +exports[`OutlineFilter shows an input with the filter when it is not empty 1`] = ` +<div + className="outline-filter" +> + <form> + <input + className="outline-filter-input devtools-filterinput" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Filter functions" + type="text" + value="abc" + /> + </form> +</div> +`; diff --git a/devtools/client/debugger/src/components/test/__snapshots__/QuickOpenModal.spec.js.snap b/devtools/client/debugger/src/components/test/__snapshots__/QuickOpenModal.spec.js.snap new file mode 100644 index 0000000000..83d643a597 --- /dev/null +++ b/devtools/client/debugger/src/components/test/__snapshots__/QuickOpenModal.spec.js.snap @@ -0,0 +1,1694 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`QuickOpenModal Basic render with mount & searchType = functions 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="@" + searchType="functions" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + "variables": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="@" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="@" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + size="" + summaryMsg="" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="empty" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value="@" + /> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + <ResultList + expanded={false} + items={Array []} + key="results" + role="listbox" + selectItem={[Function]} + selected={0} + size="small" + > + <ul + aria-live="polite" + className="result-list small" + id="result-list" + role="listbox" + /> + </ResultList> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal Basic render with mount & searchType = variables 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="#" + searchType="variables" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + "variables": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="#" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="#" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + size="" + summaryMsg="" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="empty" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value="#" + /> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal Basic render with mount 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="" + searchType="sources" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + size="big" + summaryMsg="" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + size="big" + summaryMsg="" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field big" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value="" + /> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + <ResultList + expanded={false} + items={Array []} + key="results" + role="listbox" + selectItem={[Function]} + selected={0} + size="big" + > + <ul + aria-live="polite" + className="result-list big" + id="result-list" + role="listbox" + /> + </ResultList> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal Doesn't render when disabled 1`] = `""`; + +exports[`QuickOpenModal Renders when enabled 1`] = ` +<Slide + handleClose={[Function]} + in={true} +> + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + size="big" + summaryMsg="" + /> + <ResultList + expanded={false} + items={Array []} + key="results" + role="listbox" + selectItem={[Function]} + selected={0} + size="big" + /> +</Slide> +`; + +exports[`QuickOpenModal Simple goto search query = :abc & searchType = goto 1`] = ` +<QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query=":abc" + searchType="goto" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + "variables": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} +> + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query=":abc" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="Go to line" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query=":abc" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + size="" + summaryMsg="Go to line" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="empty" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value=":abc" + /> + <div + className="search-field-summary" + > + Go to line + </div> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + </div> + </div> + </Modal> + </Transition> + </Slide> +</QuickOpenModal> +`; + +exports[`QuickOpenModal showErrorEmoji false when count + query 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="dasdasdas" + searchType="sources" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="dasdasdas" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + size="big" + summaryMsg="" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="dasdasdas" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + size="big" + summaryMsg="" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field big" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="empty" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value="dasdasdas" + /> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal showErrorEmoji false when goto numeric ':2222' 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query=":2222" + searchType="goto" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query=":2222" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="Go to line" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query=":2222" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + size="" + summaryMsg="Go to line" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value=":2222" + /> + <div + className="search-field-summary" + > + Go to line + </div> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal showErrorEmoji false when no query 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="" + searchType="other" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + size="" + summaryMsg="" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value="" + /> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + <ResultList + expanded={false} + items={Array []} + key="results" + role="listbox" + selectItem={[Function]} + selected={0} + size="small" + > + <ul + aria-live="polite" + className="result-list small" + id="result-list" + role="listbox" + /> + </ResultList> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal showErrorEmoji true when goto not numeric ':22k22' 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query=":22k22" + searchType="goto" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query=":22k22" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="Go to line" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query=":22k22" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + size="" + summaryMsg="Go to line" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="empty" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value=":22k22" + /> + <div + className="search-field-summary" + > + Go to line + </div> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal showErrorEmoji true when no count + query 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={true} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="test" + searchType="other" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + > + <Slide + handleClose={[Function]} + in={true} + > + <Transition + appear={true} + enter={true} + exit={true} + in={true} + mountOnEnter={false} + onEnter={[Function]} + onEntered={[Function]} + onEntering={[Function]} + onExit={[Function]} + onExited={[Function]} + onExiting={[Function]} + timeout={50} + unmountOnExit={false} + > + <Modal + handleClose={[Function]} + status="entering" + > + <div + className="modal-wrapper" + onClick={[Function]} + > + <div + className="modal entering" + onClick={[Function]} + > + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="test" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="" + > + <SearchInput + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="test" + searchKey="quickopen-search" + searchOptions={ + Object { + "caseSensitive": false, + "excludePatterns": "", + "regexMatch": false, + "wholeWord": false, + } + } + selectedItemId="" + setSearchOptions={[Function]} + showClose={false} + showErrorEmoji={true} + showExcludePatterns={false} + showSearchModifiers={false} + size="" + summaryMsg="" + > + <div + className="search-outline" + > + <div + aria-expanded={false} + aria-haspopup="listbox" + aria-owns="result-list" + className="search-field" + role="combobox" + > + <AccessibleImage + className="search" + > + <span + className="img search" + /> + </AccessibleImage> + <input + aria-activedescendant="" + aria-autocomplete="list" + aria-controls="result-list" + className="empty" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + spellCheck={false} + value="test" + /> + <div + className="search-buttons-bar" + /> + </div> + </div> + </SearchInput> + </Connect(SearchInput)> + </div> + </div> + </Modal> + </Transition> + </Slide> + </QuickOpenModal> +</Provider> +`; + +exports[`QuickOpenModal shows loading loads with function type search 1`] = ` +<Slide + handleClose={[Function]} + in={true} +> + <Connect(SearchInput) + count={0} + expanded={false} + handleClose={[Function]} + hasPrefix={true} + isLoading={false} + onChange={[Function]} + onKeyDown={[Function]} + placeholder="Go to file…" + query="" + searchKey="quickopen-search" + selectedItemId="" + showClose={false} + showErrorEmoji={false} + showExcludePatterns={false} + showSearchModifiers={false} + summaryMsg="Loading…" + /> + <ResultList + expanded={false} + items={Array []} + key="results" + role="listbox" + selectItem={[Function]} + selected={0} + size="small" + /> +</Slide> +`; + +exports[`QuickOpenModal updateResults on enable 1`] = ` +<Provider + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={false} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="" + searchType="sources" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + /> +</Provider> +`; + +exports[`QuickOpenModal updateResults on enable 2`] = ` +<Provider + enabled={true} + store={ + Object { + "clearActions": [Function], + "dispatch": [Function], + "getActions": [Function], + "getState": [Function], + "replaceReducer": [Function], + "subscribe": [Function], + } + } +> + <QuickOpenModal + blackBoxRanges={Object {}} + clearHighlightLineRange={[MockFunction]} + closeQuickOpen={[MockFunction]} + cx={ + Object { + "navigateCounter": 0, + } + } + displayedSources={Array []} + enabled={false} + highlightLineRange={[MockFunction]} + isOriginal={false} + query="" + searchType="sources" + selectSpecificLocation={[MockFunction]} + setQuickOpenQuery={[MockFunction]} + shortcutsModalEnabled={false} + symbols={ + Object { + "functions": Array [], + } + } + symbolsLoading={false} + tabUrls={Array []} + thread="FakeThread" + toggleShortcutsModal={[MockFunction]} + /> +</Provider> +`; diff --git a/devtools/client/debugger/src/components/test/__snapshots__/ShortcutsModal.spec.js.snap b/devtools/client/debugger/src/components/test/__snapshots__/ShortcutsModal.spec.js.snap new file mode 100644 index 0000000000..06ddc45c91 --- /dev/null +++ b/devtools/client/debugger/src/components/test/__snapshots__/ShortcutsModal.spec.js.snap @@ -0,0 +1,190 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`ShortcutsModal renders when enabled 1`] = ` +<Slide + additionalClass="shortcuts-modal" + handleClose={[MockFunction]} + in={true} +> + <div + className="shortcuts-content" + > + <div + className="shortcuts-section" + > + <h2> + Editor + </h2> + <ul + className="shortcuts-list" + > + <li> + <span> + Toggle Breakpoint + </span> + <span> + <span + className="keystroke" + key="Ctrl+B" + > + Ctrl+B + </span> + </span> + </li> + <li> + <span> + Edit Conditional Breakpoint + </span> + <span> + <span + className="keystroke" + key="Ctrl+Shift+B" + > + Ctrl+Shift+B + </span> + </span> + </li> + <li> + <span> + Edit Log Point + </span> + <span> + <span + className="keystroke" + key="Ctrl+Shift+Y" + > + Ctrl+Shift+Y + </span> + </span> + </li> + </ul> + </div> + <div + className="shortcuts-section" + > + <h2> + Stepping + </h2> + <ul + className="shortcuts-list" + > + <li> + <span> + Pause/Resume + </span> + <span> + <span + className="keystroke" + key="F8" + > + F8 + </span> + </span> + </li> + <li> + <span> + Step Over + </span> + <span> + <span + className="keystroke" + key="F10" + > + F10 + </span> + </span> + </li> + <li> + <span> + Step In + </span> + <span> + <span + className="keystroke" + key="F11" + > + F11 + </span> + </span> + </li> + <li> + <span> + Step Out + </span> + <span> + <span + className="keystroke" + key="Shift+F11" + > + Shift+F11 + </span> + </span> + </li> + </ul> + </div> + <div + className="shortcuts-section" + > + <h2> + Search + </h2> + <ul + className="shortcuts-list" + > + <li> + <span> + Go to file + </span> + <span> + <span + className="keystroke" + key="Ctrl+P" + > + Ctrl+P + </span> + </span> + </li> + <li> + <span> + Find in files + </span> + <span> + <span + className="keystroke" + key="Ctrl+Shift+F" + > + Ctrl+Shift+F + </span> + </span> + </li> + <li> + <span> + Find function + </span> + <span> + <span + className="keystroke" + key="Ctrl+Shift+O" + > + Ctrl+Shift+O + </span> + </span> + </li> + <li> + <span> + Go to line + </span> + <span> + <span + className="keystroke" + key="Ctrl+G" + > + Ctrl+G + </span> + </span> + </li> + </ul> + </div> + </div> +</Slide> +`; diff --git a/devtools/client/debugger/src/components/test/__snapshots__/WelcomeBox.spec.js.snap b/devtools/client/debugger/src/components/test/__snapshots__/WelcomeBox.spec.js.snap new file mode 100644 index 0000000000..9828e88ef4 --- /dev/null +++ b/devtools/client/debugger/src/components/test/__snapshots__/WelcomeBox.spec.js.snap @@ -0,0 +1,67 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`WelomeBox renders with default values 1`] = ` +<div + className="welcomebox" +> + <div + className="alignlabel" + > + <div + className="shortcutFunction" + > + <p + className="welcomebox__searchSources" + onClick={[Function]} + role="button" + tabIndex="0" + > + <span + className="shortcutKey" + > + Ctrl+P + </span> + <span + className="shortcutLabel" + > + Go to file + </span> + </p> + <p + className="welcomebox__searchProject" + onClick={[Function]} + role="button" + tabIndex="0" + > + <span + className="shortcutKey" + > + Ctrl+Shift+F + </span> + <span + className="shortcutLabel" + > + Find in files + </span> + </p> + <p + className="welcomebox__allShortcuts" + onClick={[Function]} + role="button" + tabIndex="0" + > + <span + className="shortcutKey" + > + Ctrl+/ + </span> + <span + className="shortcutLabel" + > + Show all shortcuts + </span> + </p> + </div> + </div> +</div> +`; diff --git a/devtools/client/debugger/src/components/test/__snapshots__/WhyPaused.spec.js.snap b/devtools/client/debugger/src/components/test/__snapshots__/WhyPaused.spec.js.snap new file mode 100644 index 0000000000..0762a0b69d --- /dev/null +++ b/devtools/client/debugger/src/components/test/__snapshots__/WhyPaused.spec.js.snap @@ -0,0 +1,103 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`WhyPaused should pause reason with message 1`] = ` +<LocalizationProvider + bundles={Array []} +> + <div + className="pane why-paused" + > + <div> + <div + className="info icon" + > + <AccessibleImage + className="info" + /> + </div> + <div + className="pause reason" + > + <Localized + id="whypaused-breakpoint" + /> + <div + className="message" + > + bla is hit + </div> + </div> + </div> + </div> +</LocalizationProvider> +`; + +exports[`WhyPaused should show an empty div when there is no pause reason 1`] = ` +<div + className="" +/> +`; + +exports[`WhyPaused should show pause reason with exception details 1`] = ` +<LocalizationProvider + bundles={Array []} +> + <div + className="pane why-paused" + > + <div> + <div + className="info icon" + > + <AccessibleImage + className="info" + /> + </div> + <div + className="pause reason" + > + <Localized + id="whypaused-exception" + /> + <div + className="message warning" + > + ReferenceError: o is not defined + </div> + </div> + </div> + </div> +</LocalizationProvider> +`; + +exports[`WhyPaused should show pause reason with exception string 1`] = ` +<LocalizationProvider + bundles={Array []} +> + <div + className="pane why-paused" + > + <div> + <div + className="info icon" + > + <AccessibleImage + className="info" + /> + </div> + <div + className="pause reason" + > + <Localized + id="whypaused-exception" + /> + <div + className="message warning" + > + Not Available + </div> + </div> + </div> + </div> +</LocalizationProvider> +`; |