fleet/frontend/test
Gabriel Hernandez 963d628588
move out manage host filters into their own component (#10749)
# Checklist for submitter

This removes the filtering UI from the manage hosts page. Currently it
keeps the same code (I felt it was too risky to move out the code AND do
a big rewrite) but I have other work still in progress where I try to
improve the code for filtering.

Basically this is the first step to making the code for creating and
maintaining filters a bit easier.

- [x] Manual QA for all new/changed functionality
2023-03-30 15:29:54 +01:00
..
handlers Add readonly MDM.EnabledAndConfigured to app config and device responses (#9575) 2023-02-01 14:47:52 -03:00
default-handlers.ts Frontend integration tests: Create mock mac admins handler (#8728) 2022-11-16 13:57:51 -05:00
jest.config.ts update jest setup and move config to its own file (#8258) 2022-10-25 14:17:32 +01:00
mock-server.ts Frontend Integration Tests: Create activity integration tests, reorganized mock server calls (#8620) 2022-11-15 13:29:12 +00:00
README.md Frontend testing documentation (#8936) 2022-12-14 13:56:56 -05:00
stubs.ts Use new display name property in live query results (#8268) 2022-10-19 17:24:42 -05:00
test-setup.ts Frontend Integration Tests: Create activity integration tests, reorganized mock server calls (#8620) 2022-11-15 13:29:12 +00:00
test-utils.tsx move out manage host filters into their own component (#10749) 2023-03-30 15:29:54 +01:00

Fleet UI tests

The test directory contains the jest configuration, test setup, request handlers, mock server definition, testing utilities, and entity stubs (deprecated and will be replaced by mocks in frontend/__mocks__) for use in test files throughout the application. The test files for components and app functions are located in the same directory as the files they test.

Table of contents

Jest configuration

This is where the jest configuration is located. Refer to Jest's official documentation.

Test setup

This file configures the testing environment for every test file.

Request handlers and their setup

Default handlers and custom handlers are both defined within the handlers directory and return mocked data. The handlers directory will naturally grow with more default and custom handlers required for more tests. We use mock service worker to define all request handlers.

Default handlers and custom handlers differ in their setup. Default handlers are setup in mock-server.ts. The mock server will serve the default handlers outlined in default-handlers.ts. Custom handlers must be setup inline within a component's test suite (frontend/**/ComponentName.tests.tsx). For example, we would setup the custom handler activityHandler9Activities inline using mockServer.use(activityHandler9Activities);.

Testing utilities

We use various utility functions to write our tests.

Testing stubs Deprecated

Testing stubs are still being used in a handful of old tests. We are no longer following this pattern of adding data to testing stubs. Rather, we are building stubs as mocks located in the frontend/__mocks__ directory.

Check out how we mock data used for unit and integration tests.

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.