kibana/renovate.json
Paulo Henrique cb11a1b004
[Cloud Security] Adding MSW for mocking server responses in React integration tests (#184555)
## Summary

It closes #183977

This PR introduces the MSW library into Kibana and setups for MSW usage
with Jest for integration testing of React components in the Cloud
Security Posture plugin.

It also adds the setup for the initial
[handlers](https://mswjs.io/docs/concepts/request-handler/), and
configures a test for the `<NoFindingsStates/>` components using MSW to
exemplify how the library works.

### Problem Statement

Currently, integration tests for React components that interact with the
server are hard to write and maintain, as they often require mocking
functions implementation and responses, this can lead to tests that do
not accurately verify the intended functionality and can be hard to
maintain as the implementation of the functions changes.

This leads to situations our team faces now, where due to the difficult
maintainability of integration tests, we rely much more on End-to-End
tests, and maintaining those many End-to-End comes with its own set of
tradeoffs, as oftentimes End-to-End tests are detected by the CI as
failing or flaky, and as flakiness can happen in End-to-end tests due to
its nature of multiple integrated systems, this concept proposes that
it's better to reserve End-to-end tests for the features in the most
critical path and tests that test multiple integrated systems as those
will benefit most of the end-to-end testing. For all the other tests we
should focus on unit and integration tests.

### How MSW works

MSW is a library that allows you to mock server responses in your tests,
it works by intercepting the requests made by the client and returning
the mocked responses, this way we can test how the client behaves in
different states of the lifecycle such as loading, error, and success.

This proposes that we should use MSW to enhance our integration tests,
and give preference to writing integration tests over End-to-End tests
whenever possible, but this doesn't mean that we should stop writing
end-to-end tests, as end-to-end tests are still important for the
features in the most critical path and tests that tests multiple
integrated systems.


### MSW Diagram

Here's a diagram that shows how MSW works with Jest tests:

```mermaid
%%{init:{'themeCSS':' g:nth-of-type(3) rect.actor { fill: #eee; };g:nth-of-type(7) rect.actor { fill: #eee; };'}}%%

sequenceDiagram
    participant ReactComponent as React Component
    participant API as API
    participant MSW as MSW Mock Server
    participant Jest as Jest Test

    Jest->>ReactComponent: Setup component test and mock providers
    Jest->>MSW: Setup Mock Server
    Note over Jest,MSW: start listening for requests
    activate MSW
    ReactComponent->>API: Make API Call
    Note over ReactComponent,API: loading state
    activate API
    MSW-->>API: Intercepts API Call
    deactivate API
    alt is success
        MSW-->>ReactComponent: Send Mocked success Response
    else is error
        MSW-->>ReactComponent: Send Mocked error Response
    end
    deactivate MSW
    ReactComponent-->>Jest: Receive Mocked data and render
```


### Documentation

- Refer to this [PR](https://github.com/elastic/security-team/pull/9624)
containing the documentation of how MSW works and how to use it.
- Refer to this
[presentation](https://docs.google.com/presentation/d/1KYtBaeDMZrpoU5lnKASm8GvCxhrXVqMKxWgR-Xvaxzc/edit#slide=id.g11f0f180654_1_0)
to understand the main motivations behind this proposal.

### How to test it


```
yarn test:jest x-pack/plugins/cloud_security_posture/public/components/no_findings_states.test.tsx

```


### Screenshot


![image](f0673be2-f087-42b5-8ed6-42ce3159e378)


Intercepted requests logged with `{debug: true}`:


![image](b512d486-8a2a-422e-bf26-3c6b60a8c6d2)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2024-06-18 11:08:01 -07:00

440 lines
14 KiB
JSON

{
"$schema": "https://docs.renovatebot.com/renovate-schema.json",
"extends": ["config:recommended"],
"ignorePaths": ["**/__fixtures__/**", "**/fixtures/**"],
"enabledManagers": ["npm"],
"baseBranches": ["main", "7.17"],
"prConcurrentLimit": 0,
"prHourlyLimit": 0,
"separateMajorMinor": false,
"rangeStrategy": "bump",
"semanticCommits": "disabled",
"vulnerabilityAlerts": {
"enabled": false
},
"lockFileMaintenance": {
"enabled": false
},
"packageRules": [
{
"matchDepPatterns": [".*"],
"enabled": false
},
{
"groupName": "@elastic/charts",
"matchDepNames": ["@elastic/charts"],
"reviewers": ["team:visualizations", "markov00", "nickofthyme"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:skip", "Team:Visualizations"],
"enabled": true
},
{
"groupName": "@elastic/elasticsearch",
"matchDepNames": ["@elastic/elasticsearch"],
"reviewers": ["team:kibana-operations", "team:kibana-core"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:skip", "Team:Operations", "Team:Core"],
"enabled": true
},
{
"groupName": "@elastic/elasticsearch",
"matchDepNames": ["@elastic/elasticsearch"],
"reviewers": ["team:kibana-operations", "team:kibana-core"],
"matchBaseBranches": ["7.17"],
"labels": ["release_note:skip", "Team:Operations", "Team:Core", "backport:skip"],
"enabled": true
},
{
"groupName": "LaunchDarkly",
"matchDepNames": ["launchdarkly-js-client-sdk", "@launchdarkly/node-server-sdk"],
"reviewers": ["team:kibana-security", "team:kibana-core"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "Team:Security", "Team:Core", "backport:prev-minor"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "APM",
"matchDepNames": ["elastic-apm-node", "@elastic/apm-rum", "@elastic/apm-rum-react"],
"reviewers": ["team:kibana-core"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "Team:Core", "backport:skip"],
"enabled": true
},
{
"groupName": "ansi-regex",
"matchDepNames": ["ansi-regex"],
"reviewers": ["team:kibana-core"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "Team:Core", "backport:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "OpenAPI Spec",
"matchDepNames": ["@redocly/cli"],
"reviewers": ["team:kibana-core"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "Team:Core", "backport:all-open"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "babel",
"matchDepNames": ["@types/babel__core"],
"matchDepPatterns": ["^@babel", "^babel-plugin"],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "typescript",
"matchDepNames": ["typescript", "prettier", "@types/jsdom"],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "typescript-eslint",
"matchDepPatterns": ["^@typescript-eslint"],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "polyfills",
"matchDepNames": ["core-js"],
"matchDepPatterns": ["polyfill"],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "CLI tooling",
"matchDepNames": ["listr2"],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "backport:all-open", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "vega related modules",
"matchDepNames": ["vega", "vega-lite", "vega-schema-url-parser", "vega-tooltip"],
"reviewers": ["team:kibana-visualizations"],
"matchBaseBranches": ["main"],
"labels": ["Feature:Vega", "Team:Visualizations"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "cypress",
"matchDepPatterns": ["cypress"],
"reviewers": ["Team:apm", "Team: SecuritySolution"],
"matchBaseBranches": ["main"],
"labels": ["buildkite-ci", "ci:all-cypress-suites"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "security solution modules",
"matchDepNames": ["zod", "langchain"],
"reviewers": ["Team: SecuritySolution"],
"matchBaseBranches": ["main"],
"labels": ["Team: SecuritySolution"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "platform security modules",
"matchDepNames": [
"css.escape",
"node-forge",
"formik",
"@types/node-forge",
"require-in-the-middle",
"tough-cookie",
"@types/tough-cookie",
"xml-crypto",
"@types/xml-crypto",
"@kayahr/text-encoding"
],
"reviewers": ["team:kibana-security"],
"matchBaseBranches": ["main"],
"labels": ["Team:Security", "release_note:skip", "backport:all-open"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "ftr",
"matchDepNames": [
"@types/chromedriver",
"@types/selenium-webdriver",
"chromedriver",
"geckodriver",
"ms-chromium-edge-driver",
"selenium-webdriver"
],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "scss",
"matchDepNames": ["sass-embedded"],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip", "backport:all-open"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "minify",
"matchDepNames": ["gulp-terser", "terser"],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "@testing-library",
"matchDepNames": [
"@testing-library/dom",
"@testing-library/jest-dom",
"@testing-library/react",
"@testing-library/react-hooks",
"@testing-library/user-event",
"@types/testing-library__jest-dom"
],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "jest",
"matchDepNames": [
"@jest/console",
"@jest/reporters",
"@jest/types",
"babel-jest",
"expect",
"jest",
"jest-cli",
"jest-config",
"jest-diff",
"jest-environment-jsdom",
"jest-matcher-utils",
"jest-mock",
"jest-runtime",
"jest-snapshot"
],
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"labels": ["Team:Operations", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "@storybook",
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"matchDepPatterns": ["^@storybook"],
"excludeDepNames": ["@storybook/testing-react"],
"labels": ["Team:Operations", "release_note:skip", "ci:build-storybooks", "backport:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"allowedVersions": "<7.0",
"enabled": true
},
{
"groupName": "@storybook/testing-react",
"reviewers": ["team:kibana-operations"],
"matchBaseBranches": ["main"],
"matchDepNames": ["@storybook/testing-react"],
"labels": ["Team:Operations", "release_note:skip", "ci:build-storybooks", "backport:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"allowedVersions": "<2.0",
"enabled": true
},
{
"groupName": "react-query",
"matchDepNames": ["@tanstack/react-query", "@tanstack/react-query-devtools"],
"reviewers": [
"team:response-ops",
"team:kibana-cloud-security-posture",
"team:security-asset-management",
"team:fleet",
"team:awp-platform",
"team:security-onboarding-and-lifecycle-mgt"
],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:skip", "ci:all-cypress-suites"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "react-hook-form",
"matchDepNames": ["react-hook-form"],
"reviewers": ["team:security-asset-management", "team:uptime"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:skip", "ci:all-cypress-suites"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "redux",
"matchDepNames": ["redux", "react-redux"],
"reviewers": [
"team:search-kibana",
"team:kibana-presentation",
"team:kibana-data-discovery",
"team:kibana-management",
"team:kibana-gis",
"team:security-solution"
],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:skip", "ci:all-cypress-suites"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "Profiling",
"matchDepNames": ["peggy", "@types/dagre"],
"reviewers": ["team:profiling-ui"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:skip"],
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "TTY Output",
"matchDepNames": ["xterm", "byte-size", "@types/byte-size"],
"reviewers": ["team:sec-cloudnative-integrations"],
"matchBaseBranches": ["main"],
"labels": ["Team: AWP: Visualization", "release_note:skip", "backport:skip"],
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "Cloud Defend",
"matchDepNames": ["monaco-yaml"],
"reviewers": ["team:sec-cloudnative-integrations"],
"matchBaseBranches": ["main"],
"labels": ["Team: Cloud Native Integrations", "release_note:skip", "backport:skip"],
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "JSON Web Token",
"matchDepNames": ["jsonwebtoken"],
"reviewers": ["team:response-ops", "team:kibana-core"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:all-open"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "XState",
"matchDepNames": ["xstate"],
"matchDepPrefixes": ["@xstate/"],
"reviewers": ["team:obs-ux-logs"],
"matchBaseBranches": ["main"],
"labels": ["Team:Obs UX Logs", "release_note:skip"],
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "OpenTelemetry modules",
"matchDepPrefixes": ["@opentelemetry/"],
"reviewers": ["team:monitoring"],
"matchBaseBranches": ["main"],
"labels": ["Team:Monitoring"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "csp",
"matchDepNames": ["content-security-policy-parser"],
"reviewers": ["team:kibana-security", "team:kibana-core"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:skip", "ci:serverless-test-all"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "AlertingEmails",
"matchDepNames": ["nodemailer"],
"reviewers": ["team:response-ops"],
"matchBaseBranches": ["main"],
"labels": ["release_note:skip", "backport:prev-minor"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "machine learning modules",
"matchDepNames": ["apidoc-markdown"],
"reviewers": ["team:ml-ui"],
"matchBaseBranches": ["main"],
"labels": ["Team:ML", "release_note:skip", "backport:all-open"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "Kibana ES|QL Team",
"matchDepNames": ["recast"],
"reviewers": ["team:kibana-esql"],
"matchBaseBranches": ["main"],
"labels": ["Team:ESQL", "release_note:skip"],
"prCreation": "not-pending",
"minimumReleaseAge": "7 days",
"enabled": true
},
{
"groupName": "MSW",
"matchPackageNames": ["msw"],
"reviewers": ["team:kibana-cloud-security-posture"],
"matchBaseBranches": ["main"],
"labels": ["Team: Cloud Security", "release_note:skip", "backport:skip"],
"enabled": true
}
]
}