fleet/frontend/components/AddHostsModal/AddHostsModal.tests.tsx
Gabriel Hernandez 35c172dcfd
add ability for end users to enrol their device into fleet mdm (#21751)
relates to #21559

This adds the ability for end users to enrol their own device in fleet
mdm.

> NOTE: this new byod HTML page is a separate HTML asset that contains
all styles and scripts needed for the page to work. We do not send the
fleet UI assets and this drastically cuts down the response time to the
users who will be visiting this page on mobile devices

There are two sides included in this:

**Adding a new add host modal ios and iPad section for IT admins**


![image](https://github.com/user-attachments/assets/1008b190-9c38-4a0e-9b02-19df5da7937d)

**delivering a new byod HTML page to end users that will allow end users
to download the config profile to enrol into fleet mdm**


![image](https://github.com/user-attachments/assets/58d790e4-233b-4b03-ab36-9971aac075de)

<!-- Note that API documentation changes are now addressed by the
product design team. -->

- [x] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/Committing-Changes.md#changes-files)
for more information.
- [ ] Added/updated tests
- [x] Manual QA for all new/changed functionality
2024-09-05 12:47:34 +01:00

213 lines
6.7 KiB
TypeScript

import React from "react";
import { screen } from "@testing-library/react";
import { noop } from "lodash";
import { createCustomRenderer } from "test/test-utils";
import createMockConfig from "__mocks__/configMock";
import AddHostsModal from "./AddHostsModal";
const ENROLL_SECRET = "abcdefg12345678";
describe("AddHostsModal", () => {
it("renders loading state", async () => {
const render = createCustomRenderer({
withBackendMock: true,
context: {
app: {
isPreviewMode: false,
config: createMockConfig(),
},
},
});
render(
<AddHostsModal isAnyTeamSelected={false} isLoading onCancel={noop} />
);
const loadingSpinner = screen.getByTestId("spinner");
expect(loadingSpinner).toBeVisible();
});
it("renders platform tabs", async () => {
const render = createCustomRenderer({
withBackendMock: true,
context: {
app: {
isPreviewMode: false,
config: createMockConfig(),
},
},
});
const { user } = render(
<AddHostsModal
isAnyTeamSelected
enrollSecret={ENROLL_SECRET}
isLoading={false}
onCancel={noop}
/>
);
await user.click(screen.getByRole("tab", { name: "macOS" }));
const macOSText = screen.getByText(/--type=pkg/i);
expect(macOSText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "Windows" }));
const windowsText = screen.getByText(/--type=msi/i);
expect(windowsText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "Linux" }));
const linuxDebText = screen.getByText(/--type=deb/i);
expect(linuxDebText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).toBeInTheDocument();
expect(
screen.queryByText(/CentOS, Red Hat, and Fedora Linux, use --type=rpm/i)
).toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "ChromeOS" }));
const extensionId = screen.getByDisplayValue(
/fleeedmmihkfkeemmipgmhhjemlljidg/i
);
expect(extensionId).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "iOS & iPadOS" }));
expect(
screen.queryByText(/Send this to your end users:/i)
).toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "Advanced" }));
const advancedText = screen.getByText(/--type=YOUR_TYPE/i);
expect(advancedText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
await user.click(screen.getByText(/Plain osquery/i));
const downloadEnrollSecret = screen.getByText(
/Download your enroll secret/i
);
expect(downloadEnrollSecret).toBeInTheDocument();
const osquerydCommand = screen.getByDisplayValue(
/osqueryd --flagfile=flagfile.txt --verbose/i
);
expect(osquerydCommand).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
});
it("renders installer with secret", async () => {
const render = createCustomRenderer({
withBackendMock: true,
context: {
app: {
isPreviewMode: false,
config: createMockConfig(),
},
},
});
render(
<AddHostsModal
isAnyTeamSelected
enrollSecret={ENROLL_SECRET}
isLoading={false}
onCancel={noop}
/>
);
const regex = new RegExp(`${ENROLL_SECRET}`);
const text = screen.getByDisplayValue(regex);
expect(text).toBeInTheDocument();
});
it("renders no enroll secret cta", async () => {
const render = createCustomRenderer({
withBackendMock: true,
context: {
app: {
isPreviewMode: false,
config: createMockConfig(),
},
},
});
render(
<AddHostsModal
isAnyTeamSelected={false}
currentTeamName="Apples"
isLoading={false}
onCancel={noop}
openEnrollSecretModal={noop}
/>
);
const text = screen.getByText("Something's gone wrong.");
const ctaButton = screen.getByRole("button", {
name: "Manage enroll secrets",
});
expect(text).toBeInTheDocument();
expect(ctaButton).toBeEnabled();
});
it("excludes `--enable-scripts` flag if `config.server_settings.scripts-disabled` is `true`", async () => {
const mockConfig = createMockConfig();
mockConfig.server_settings.scripts_disabled = true;
const render = createCustomRenderer({
withBackendMock: true,
context: {
app: {
isPreviewMode: false,
config: mockConfig,
},
},
});
const { user } = render(
<AddHostsModal
isAnyTeamSelected
enrollSecret={ENROLL_SECRET}
isLoading={false}
onCancel={noop}
/>
);
await user.click(screen.getByRole("tab", { name: "macOS" }));
const macOSText = screen.getByText(/--type=pkg/i);
expect(macOSText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "Windows" }));
const windowsText = screen.getByText(/--type=msi/i);
expect(windowsText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "Linux" }));
const linuxRPMText = screen.getByText(/--type=rpm/i);
expect(linuxRPMText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "ChromeOS" }));
const extensionId = screen.getByDisplayValue(
/fleeedmmihkfkeemmipgmhhjemlljidg/i
);
expect(extensionId).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
await user.click(screen.getByRole("tab", { name: "Advanced" }));
const advancedText = screen.getByText(/--type=YOUR_TYPE/i);
expect(advancedText).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
await user.click(screen.getByText(/Plain osquery/i));
const downloadEnrollSecret = screen.getByText(
/Download your enroll secret/i
);
expect(downloadEnrollSecret).toBeInTheDocument();
const osquerydCommand = screen.getByDisplayValue(
/osqueryd --flagfile=flagfile.txt --verbose/i
);
expect(osquerydCommand).toBeInTheDocument();
expect(screen.queryByText(/--enable-scripts/i)).not.toBeInTheDocument();
});
});