-
Notifications
You must be signed in to change notification settings - Fork 488
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fleet Frontend: Create integration tests QuerySidePanel.tests.tsx (#1…
- Loading branch information
1 parent
95e7b9e
commit 82e81c2
Showing
6 changed files
with
189 additions
and
5 deletions.
There are no files selected for viewing
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
import { DEFAULT_OSQUERY_TABLE, IOsQueryTable } from "interfaces/osquery_table"; | ||
|
||
const createMockOsqueryTable = ( | ||
overrides?: Partial<IOsQueryTable> | ||
): IOsQueryTable => { | ||
return { ...DEFAULT_OSQUERY_TABLE, ...overrides }; | ||
}; | ||
|
||
export default createMockOsqueryTable; |
121 changes: 121 additions & 0 deletions
121
frontend/components/side_panels/QuerySidePanel/QuerySidePanel.tests.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,121 @@ | ||
import React from "react"; | ||
import { noop } from "lodash"; | ||
import { render, screen } from "@testing-library/react"; | ||
|
||
import createMockOsqueryTable from "__mocks__/osqueryTableMock"; | ||
import QuerySidePanel from "./QuerySidePanel"; | ||
|
||
describe("QuerySidePanel - component", () => { | ||
it("renders the query side panel with the correct table selected", () => { | ||
render( | ||
<QuerySidePanel | ||
selectedOsqueryTable={createMockOsqueryTable()} | ||
onOsqueryTableSelect={(tableName: string) => noop} | ||
onClose={noop} | ||
/> | ||
); | ||
|
||
const tableDropdownText = screen.getByDisplayValue(/users/i); | ||
expect(tableDropdownText).toBeInTheDocument(); | ||
}); | ||
|
||
it("renders platform compatibility", () => { | ||
const { container } = render( | ||
<QuerySidePanel | ||
selectedOsqueryTable={createMockOsqueryTable()} | ||
onOsqueryTableSelect={(tableName: string) => noop} | ||
onClose={noop} | ||
/> | ||
); | ||
|
||
const platformList = container.getElementsByClassName("platform-list-item"); | ||
const platformCompatibility = screen.getByTestId("compatibility"); | ||
|
||
expect(platformList.length).toBe(4); | ||
expect(platformCompatibility).toHaveTextContent(/macos/i); | ||
expect(platformCompatibility).toHaveTextContent(/windows/i); | ||
expect(platformCompatibility).toHaveTextContent(/linux/i); | ||
expect(platformCompatibility).toHaveTextContent(/chromeos/i); | ||
}); | ||
|
||
it("renders the correct number of columns", () => { | ||
const { container } = render( | ||
<QuerySidePanel | ||
selectedOsqueryTable={createMockOsqueryTable()} | ||
onOsqueryTableSelect={(tableName: string) => noop} | ||
onClose={noop} | ||
/> | ||
); | ||
|
||
const platformList = container.getElementsByClassName("column-list-item"); | ||
expect(platformList.length).toBe(13); | ||
}); | ||
|
||
it("renders the platform specific column tooltip", () => { | ||
render( | ||
<QuerySidePanel | ||
selectedOsqueryTable={createMockOsqueryTable()} | ||
onOsqueryTableSelect={(tableName: string) => noop} | ||
onClose={noop} | ||
/> | ||
); | ||
|
||
const tooltip = screen.getByText(/only available on windows/i); | ||
expect(tooltip).toBeInTheDocument(); | ||
}); | ||
|
||
it("render an example", () => { | ||
render( | ||
<QuerySidePanel | ||
selectedOsqueryTable={createMockOsqueryTable()} | ||
onOsqueryTableSelect={(tableName: string) => noop} | ||
onClose={noop} | ||
/> | ||
); | ||
|
||
const exampleHeader = screen.getByText( | ||
/List users that have interactive access via a shell that isn't false/i | ||
); | ||
const example = screen.getByText("Example"); | ||
|
||
expect(exampleHeader).toBeInTheDocument(); | ||
expect(example).toBeInTheDocument(); | ||
}); | ||
it("render notes", () => { | ||
render( | ||
<QuerySidePanel | ||
selectedOsqueryTable={createMockOsqueryTable({ | ||
notes: "This table is being used for testing.", | ||
})} | ||
onOsqueryTableSelect={(tableName: string) => noop} | ||
onClose={noop} | ||
/> | ||
); | ||
|
||
const notesHeader = screen.getByText(/Notes/i); | ||
const notesText = screen.getByText(/This table is being used for testing/i); | ||
|
||
expect(notesHeader).toBeInTheDocument(); | ||
expect(notesText).toBeInTheDocument(); | ||
}); | ||
it("renders a link to the source", () => { | ||
render( | ||
<QuerySidePanel | ||
selectedOsqueryTable={createMockOsqueryTable()} | ||
onOsqueryTableSelect={(tableName: string) => noop} | ||
onClose={noop} | ||
/> | ||
); | ||
|
||
const text = screen.getByText("Source"); | ||
const icon = screen.queryByTestId("Icon"); | ||
|
||
expect(text).toBeInTheDocument(); | ||
expect(icon).toBeNull(); | ||
expect(text.closest("a")).toHaveAttribute( | ||
"href", | ||
"https://www.fleetdm.com/tables/users" | ||
); | ||
expect(text.closest("a")).toHaveAttribute("target", "_blank"); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,20 +1,53 @@ | ||
import type { Config } from "jest"; | ||
|
||
const esModules = [ | ||
"react-markdown", | ||
"vfile", | ||
"vfile-message", | ||
"micromark.+", | ||
"unist-.+", | ||
"unified", | ||
"bail", | ||
"is-plain-obj", | ||
"trough", | ||
"remark-.+", | ||
"mdast-util-.+", | ||
"parse-entities", | ||
"character-entities", | ||
"property-information", | ||
"comma-separated-tokens", | ||
"hast-util-whitespace", | ||
"remark-.+", | ||
"space-separated-tokens", | ||
"decode-named-character-reference", | ||
"ccount", | ||
"escape-string-regexp", | ||
"markdown-table", | ||
"trim-lines", | ||
].join("|"); | ||
|
||
const config: Config = { | ||
rootDir: "../", | ||
rootDir: "../../", | ||
moduleDirectories: ["node_modules", "frontend"], | ||
testEnvironment: "jsdom", | ||
moduleNameMapper: { | ||
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": | ||
"<rootDir>/__mocks__/fileMock.js", | ||
"<rootDir>/frontend/__mocks__/fileMock.js", | ||
"\\.(css|scss|sass)$": "identity-obj-proxy", | ||
// "react-markdown": | ||
// "<rootDir>/node_modules/react-markdown/react-markdown.min.js", | ||
// "remark-gfm": "<rootDir>/node_modules/remark-gfm/index.js", | ||
// "micromark-extension-gfm": | ||
// "<rootDir>/node_models/micromark-extension-gfm/index.js", | ||
}, | ||
testMatch: ["**/*tests.[jt]s?(x)"], | ||
setupFilesAfterEnv: ["<rootDir>/test/test-setup.ts"], | ||
setupFilesAfterEnv: ["<rootDir>/frontend/test/test-setup.ts"], | ||
clearMocks: true, | ||
testEnvironmentOptions: { | ||
url: "http://localhost:8080", | ||
}, | ||
// transformIgnorePatterns: ["node_modules/(?!react-markdown/)"], | ||
transformIgnorePatterns: [`/node_modules/(?!(${esModules})/)`], | ||
}; | ||
|
||
export default config; |