fleet/frontend/components/TableContainer/DataTable/PlatformCell/PlatformCell.tests.tsx
jacobshandling fea4dd791a
UI - Update targeted platforms display logic in the queries table (#25037)
### Unreleased bug where queries targeting all platforms display as
targeting no platforms in the Queries table.

The below query is set to target _all_ platforms.

**Bug:**
<img width="1248" alt="Screenshot 2024-12-29 at 8 24 50 PM"
src="https://github.com/user-attachments/assets/90c9a498-f7d8-4d86-88f1-061c985fb4fa"
/>

**Fix:**
Targeting all platforms, frequency set, displays platform icons:
<img width="1248" alt="Screenshot 2024-12-29 at 8 25 25 PM"
src="https://github.com/user-attachments/assets/d03c1bba-e5ea-461a-b506-1840cf4ffa8e"
/>

Targeting all paltforms but no frequency set (i.e., no schedule), no
targeted platforms displayed:
<img width="1248" alt="Screenshot 2024-12-29 at 8 25 38 PM"
src="https://github.com/user-attachments/assets/9b08a8c3-b682-4eb0-aeb4-59a6e0144e14"
/>

- [x] Manual QA for all new/changed functionality
- [x] Updated tests

---------

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
2024-12-30 13:06:59 -08:00

40 lines
1.5 KiB
TypeScript

import React from "react";
import { render, screen } from "@testing-library/react";
import { DEFAULT_EMPTY_CELL_VALUE } from "utilities/constants";
import { ScheduledQueryablePlatform } from "interfaces/platform";
import PlatformCell from "./PlatformCell";
const SCHEDULED_QUERYABLE_PLATFORMS: ScheduledQueryablePlatform[] = [
"windows",
"darwin",
"linux",
];
describe("Platform cell", () => {
it("renders platform icons in correct order", () => {
render(<PlatformCell platforms={SCHEDULED_QUERYABLE_PLATFORMS} />);
const icons = screen.queryByTestId("icons");
const appleIcon = screen.queryByTestId("darwin-icon");
const linuxIcon = screen.queryByTestId("linux-icon");
const windowsIcon = screen.queryByTestId("windows-icon");
expect(icons?.firstChild).toBe(appleIcon);
expect(icons?.firstChild?.nextSibling).toBe(windowsIcon);
expect(icons?.firstChild?.nextSibling?.nextSibling).toBe(linuxIcon);
});
it("renders all platforms targeted when no platforms passed in and scheduled", () => {
render(<PlatformCell platforms={[]} />);
const icons = screen.queryByTestId("icons");
const appleIcon = screen.queryByTestId("darwin-icon");
const linuxIcon = screen.queryByTestId("linux-icon");
const windowsIcon = screen.queryByTestId("windows-icon");
expect(icons?.firstChild).toBe(appleIcon);
expect(icons?.firstChild?.nextSibling).toBe(windowsIcon);
expect(icons?.firstChild?.nextSibling?.nextSibling).toBe(linuxIcon);
});
});