fleet/frontend/__mocks__
jacobshandling 32c60fe69d
UI: Linux setup experience - End user (#32639)
## PR 2/2 for #32037

- Implements update for the Linux setup experience from the end-user's
point of view (the "My device" page).
- Works in concert with the new endpoints implemented in
https://github.com/fleetdm/fleet/pull/32493
- My device page calls a new endpoint to get in-progress setup
experience software installations. If there are any, the page is
replaced with a "Setting up your device" page
- The UI polls this endpoint until all such installations are either
successful or failed (including canceled)
- Setting up your device page includes a table displaying the name and
status of each software installation
- Once all installations are finished (succeed/fail), renders the
regular My device page
- Add a handler for the new API call for relevant tests


![ezgif-6b54f32a7103ec](https://github.com/user-attachments/assets/cd94f92f-2daa-40a2-8fa1-643ed69a198c)

## Testing
Can use [this branch with fake
data](https://github.com/fleetdm/fleet/tree/32037-end-user-fake-data) to
help test this PR

- [x] Changes file added for user-visible changes in `changes/`
- [x] Added/updated automated tests - additional tests coming in
follow-up
- [x] QA'd all new/changed functionality manually

---------

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
2025-09-05 15:53:01 -07:00
..
activityMock.ts API only users show a different avatar in the activity feed (#30512) 2025-07-07 10:45:51 -04:00
appleMdm.ts UI – Add VPP features for iPadOS and iOS (#20755) 2024-07-30 10:14:25 -07:00
axiosError.ts Feat UI update macos windows setup (#12744) 2023-07-17 15:51:40 +01:00
certificatesMock.ts Hydrant CA Feature Branch (#31807) 2025-09-04 12:39:41 -04:00
configMock.ts Hydrant CA Feature Branch (#31807) 2025-09-04 12:39:41 -04:00
deviceUserMock.ts UI: Linux setup experience - End user (#32639) 2025-09-05 15:53:01 -07:00
fileMock.js add prettier and have it format all fleet application code (#625) 2021-04-12 14:32:25 +01:00
hostMock.ts Add custom software icons (#32652) 2025-09-05 17:31:03 -05:00
idpMock.ts add new idp section on integrations page and show the users idp connection with fleet (#27566) 2025-03-28 11:23:07 +00:00
labelsMock.ts UI: Labels by IdP (#30368) 2025-06-30 10:05:03 -07:00
licenseMock.ts integration test device user page with mock and custom renderer (#8475) 2022-11-01 18:59:40 +00:00
macAdminsMock.ts UI for bootstrap package flows (#11288) 2023-04-27 16:10:41 +01:00
mdmMock.ts UI tests for setup experience (#22861) 2024-10-14 13:01:56 +01:00
operatingSystemsMock.ts Fleet UI: Add Linux kernel vulns card/table (#31840) 2025-08-14 09:30:49 -04:00
osqueryTableMock.ts Fleet Frontend: Create integration tests QuerySidePanel.tests.tsx (#12179) 2023-06-07 12:01:59 -04:00
policyMock.ts UI: Update conditional access on a per-policy basis (#28658) 2025-05-01 11:43:38 -07:00
queryMock.ts Fleet UI: Can run a live query on an edited (but not saved) existing query (#16282) 2024-01-25 13:12:59 -05:00
queryReportMock.ts Added server_settings.query_report_cap (#19692) 2024-06-14 12:24:01 -03:00
README.md Organize contributor docs and establish ADR process and template (#29101) 2025-05-17 15:03:52 -05:00
scheduleableQueryMock.ts Fleet UI: Can run a live query on an edited (but not saved) existing query (#16282) 2024-01-25 13:12:59 -05:00
scriptMock.ts UI: Batch script run detail page (#32333) 2025-08-29 09:37:05 -06:00
setupExperienceMock.ts disabled manual agent install checkbox when setup experience software and run script is already added (#28679) 2025-04-30 16:22:24 +01:00
softwareMock.ts Add custom software icons (#32652) 2025-09-05 17:31:03 -05:00
teamMock.ts refactor activity items and add query name to live_query activity type (#8740) 2022-11-17 14:25:40 +00:00
userMock.ts Fleet UI: Add update details modal (#31250) 2025-07-25 09:28:25 -04:00
vulnerabilitiesMock.ts Fleet UI: Add Linux kernel vulns card/table (#31840) 2025-08-14 09:30:49 -04:00

Frontend mocks

Each __mocks___/*Mock.ts file contains one or more default mock objects and their corresponding helper function to partially override the default mock creating custom mocks.

Table of contents

Default mocks

Default mocks are simple to work with objects. We limit the default mock to a single object that can be modified with the helper function as needed using overrides.

The default mock object is returned by calling the helper function with no arguments.

Example

A single default activity is defined in __mocks__/activityMock.ts as:

const DEFAULT_ACTIVITY_MOCK: IActivity = {
  created_at: "2022-11-03T17:22:14Z",
  id: 1,
  actor_full_name: "Test",
  actor_id: 1,
  actor_gravatar: "",
  actor_email: "test@example.com",
  type: ActivityType.EditedAgentOptions,
};

To return this default object, call its helper function createActivityMock() with no arguments.

Custom mocks

Custom mocks are useful when we need a mock object with specific data.

Use the helper function with arguments to override the default mock data with the specific data you need.

Example

createMockActivity({ id: 2, actor_full_name: "Gabe" }) will return modifications to the DEFAULT_ACTIVITY_MOCK to override the id and actor_full_name keys only.

Check out the frontend test directory for information about our unit and integration testing layers. We use default mocks and custom mocks when mocking server requests.

Follow this guide to run tests locally.

Visit the frontend overview of Fleet UI testing for more information on our testing strategy, philosophies, and tools.