fleet/frontend/test
Martavis Parker a8d7b5478b
Updated API routes to use current format for frontend use (#5018)
* removed global api routes; using 'latest' instead of v1 for api routes

* lint fixes

* updated docs and tests

* lint fixes

* route fix

* fixed routes breaking packs queries

* revert test change
2022-04-11 13:04:38 -07:00
..
mocks Updated API routes to use current format for frontend use (#5018) 2022-04-11 13:04:38 -07:00
envSetup.js Updated API routes to use current format for frontend use (#5018) 2022-04-11 13:04:38 -07:00
helpers.jsx Removed 500 route middleware, added error boundary (#2665) 2021-10-26 09:26:51 -05:00
index.js add prettier and have it format all fleet application code (#625) 2021-04-12 14:32:25 +01:00
loaderMock.js add prettier and have it format all fleet application code (#625) 2021-04-12 14:32:25 +01:00
README.md Remove Kolide from frontend directory, fix sentence casing as needed (#4338) 2022-02-24 09:11:57 -05:00
stubs.ts Add UI for team admin role (#2637) 2021-10-26 09:24:16 -05:00
target_mock.js Updated API routes to use current format for frontend use (#5018) 2022-04-11 13:04:38 -07:00

Fleet tests

The test directory contains helper functions, request mocks, and entity stubs 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.

The default export from the test directory includes Helpers, Mocks, and Stubs.

Helpers

import Test from 'test';

const helpers = Test.Helpers;

The helpers file includes functions that make certain test actions easy, such as mounting a connected component, building a mock redux store, and filling in a form input.

Below are a couple particularly useful test helpers.

fillInFormInput

This function is useful when the component renders a form that needs to be filled out. The function takes to parameters, the form input element and the value to be filled in.

Example

reduxMockStore

This function is useful for creating a fake redux store. This store will allow actions to be dispatched, keep a collection of dispatched actions, and hold state.

Example using mockStore.dispatch

Example using mockStore.dispatch

Example mounting a connected component and checking dispatched actions

connectedComponent

The connectedComponent function is useful for mounting connected components in tests (usually Page components). This helper wraps the component in a Provider component and sets a mock store as the redux store for the connected component. It takes 2 parameters, the component class and an options hash. The options has 2 optional keys, mockStore and props. Keep in mind that when mounting a connected component mapStateToProps will run and the component will receive the props assigned in the mapStateToProps function.

Example

Example

Mocks

import Test from 'test';

const mocks = Test.Mocks;

Documentation on request mocks can be found in the Fleet request mock documentation

Stubs

import Test from 'test';

const stubs = Test.Stubs;

The Stubs file contains objects that represent entities used in the Fleet application. These re-usable objects help keep the code DRY.