mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
# Backport This will backport the following commits from `main` to `8.x`: - [[Dev Docs] Add VS Code configurations to Dev Docs Debugging Tutorial (#212807)](https://github.com/elastic/kibana/pull/212807) <!--- Backport version: 9.6.6 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Nick Peihl","email":"nick.peihl@elastic.co"},"sourceCommit":{"committedDate":"2025-03-06T15:14:19Z","message":"[Dev Docs] Add VS Code configurations to Dev Docs Debugging Tutorial (#212807)\n\n## Summary\n\nAdds to the Dev Docs Debugging tutorial suggested configurations for VS\nCode users for debugging Kibana server code, Jest unit tests, and\nfunctional tests.\n\n\n### Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers should verify this PR satisfies this list as well.\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)","sha":"d2412a5f98f341cf59e02e7340d718493d0492e7","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Docs","release_note:skip","DevDocs","backport:prev-major","v9.1.0"],"title":"[Dev Docs] Add VS Code configurations to Dev Docs Debugging Tutorial","number":212807,"url":"https://github.com/elastic/kibana/pull/212807","mergeCommit":{"message":"[Dev Docs] Add VS Code configurations to Dev Docs Debugging Tutorial (#212807)\n\n## Summary\n\nAdds to the Dev Docs Debugging tutorial suggested configurations for VS\nCode users for debugging Kibana server code, Jest unit tests, and\nfunctional tests.\n\n\n### Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers should verify this PR satisfies this list as well.\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)","sha":"d2412a5f98f341cf59e02e7340d718493d0492e7"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/212807","number":212807,"mergeCommit":{"message":"[Dev Docs] Add VS Code configurations to Dev Docs Debugging Tutorial (#212807)\n\n## Summary\n\nAdds to the Dev Docs Debugging tutorial suggested configurations for VS\nCode users for debugging Kibana server code, Jest unit tests, and\nfunctional tests.\n\n\n### Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers should verify this PR satisfies this list as well.\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)","sha":"d2412a5f98f341cf59e02e7340d718493d0492e7"}}]}] BACKPORT--> Co-authored-by: Nick Peihl <nick.peihl@elastic.co>
This commit is contained in:
parent
1c626b33f2
commit
5059e6b3e6
1 changed files with 244 additions and 23 deletions
|
@ -3,7 +3,7 @@ id: kibDevTutorialDebugging
|
|||
slug: /kibana-dev-docs/tutorials/debugging
|
||||
title: Debugging in development
|
||||
description: Learn how to debug Kibana while running from source
|
||||
date: 2021-04-26
|
||||
date: 2025-02-28
|
||||
tags: ['kibana', 'onboarding', 'dev', 'tutorials', 'debugging']
|
||||
---
|
||||
|
||||
|
@ -33,6 +33,225 @@ Additional information can be found in the [Jest troubleshooting documentation](
|
|||
|
||||
`node --inspect-brk scripts/kibana`
|
||||
|
||||
## Debugging using VS Code
|
||||
|
||||
See [Debug code with Visual Studio Code](https://code.visualstudio.com/docs/editor/debugging) and [Node.js debugging in VS Code](https://code.visualstudio.com/docs/nodejs/nodejs-debugging) for more information.
|
||||
|
||||
### Kibana Server
|
||||
|
||||
There are two options for debugging server code in Kibana: Attach to process or Launch Kibana from VS Code.
|
||||
|
||||
#### Attach to process
|
||||
|
||||
1. Create or modify your `.vscode/launch.json` file with the following configuration. See the [Visual Studio Code debug configuration documentation](https://code.visualstudio.com/docs/editor/debugging-configuration) for more information.
|
||||
|
||||
```json
|
||||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"type": "node",
|
||||
"request": "attach",
|
||||
"name": "kibana-9229",
|
||||
"port": 9229,
|
||||
"presentation": {
|
||||
"hidden": true,
|
||||
"group": "Kibana Debug",
|
||||
"order": 1
|
||||
},
|
||||
"skipFiles": ["<node_internals>/**", "**/node_modules/**"]
|
||||
},
|
||||
{
|
||||
"type": "node",
|
||||
"request": "attach",
|
||||
"name": "kibana-9230",
|
||||
"port": 9230,
|
||||
"presentation": {
|
||||
"hidden": true,
|
||||
"group": "Kibana Debug",
|
||||
"order": 1
|
||||
},
|
||||
"skipFiles": ["<node_internals>/**", "**/node_modules/**"]
|
||||
},
|
||||
{
|
||||
"type": "node",
|
||||
"request": "attach",
|
||||
"name": "kibana-9231",
|
||||
"port": 9231,
|
||||
"presentation": {
|
||||
"hidden": true,
|
||||
"group": "Kibana Debug",
|
||||
"order": 1
|
||||
},
|
||||
"skipFiles": ["<node_internals>/**", "**/node_modules/**"]
|
||||
}
|
||||
],
|
||||
"compounds": [
|
||||
{
|
||||
"name": "Debug Kibana Server",
|
||||
"description": "Attaches to Kibana server in debug mode. Requires first starting Kibana with `yarn debug`",
|
||||
"configurations": ["kibana-9229", "kibana-9230", "kibana-9231"],
|
||||
"restart": true,
|
||||
"presentation": {
|
||||
"hidden": false,
|
||||
"group": "Kibana Debug",
|
||||
"order": 1
|
||||
},
|
||||
"stopAll": true
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
2. Start Elasticsearch with `yarn es snapshot`.
|
||||
3. Start Kibana with `yarn debug` or `node --inspect scripts/kibana --dev`.
|
||||
4. In VS Code, click the "Run and debug" icon in the sidebar.
|
||||
5. Select "Debug Kibana Server" from the dropdown menu.
|
||||
6. Click the green play button to start debugging.
|
||||
|
||||
#### Launch Kibana from VS Code
|
||||
|
||||
1. Create or modify your `.vscode/launch.json` file with the following configuration.
|
||||
|
||||
```json
|
||||
{
|
||||
"version": "0.2.0",
|
||||
"inputs": [
|
||||
{
|
||||
"id": "runExamples",
|
||||
"type": "pickString",
|
||||
"description": "Run developer examples?",
|
||||
"default": "No",
|
||||
"options": [
|
||||
{
|
||||
"label": "No",
|
||||
"value": ""
|
||||
},
|
||||
{
|
||||
"label": "Yes",
|
||||
"value": "--run-examples"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"configurations": [
|
||||
{
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"name": "Launch and Debug Kibana",
|
||||
"runtimeExecutable": "node",
|
||||
"runtimeArgs": [
|
||||
"--nolazy",
|
||||
"--inspect=127.0.0.1:9229",
|
||||
"scripts/kibana",
|
||||
"--dev",
|
||||
"${input:runExamples}"
|
||||
],
|
||||
"autoAttachChildProcesses": true
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
2. Start Elasticsearch with `yarn es snapshot`, but don't start Kibana and kill any running instances of Kibana.
|
||||
3. In VS Code, click the "Run and debug" icon in the sidebar.
|
||||
4. Select "Launch and Debug Kibana" from the dropdown menu.
|
||||
5. Click the green play button to start debugging. You can choose whether or not to run the developer examples.
|
||||
|
||||
### Jest Unit Tests
|
||||
|
||||
Install the [Jest extension for VS Code](https://marketplace.visualstudio.com/items?itemName=Orta.vscode-jest).
|
||||
|
||||
If necessary, add the following to your `.vscode/settings.json` file.
|
||||
|
||||
```jsonc
|
||||
// self managed
|
||||
"jest.jestCommandLine": "yarn test:jest --runInBand"
|
||||
```
|
||||
|
||||
See the [Jest extension for VS Code documentation](https://marketplace.visualstudio.com/items?itemName=Orta.vscode-jest) for information on how to run and debug your unit tests.
|
||||
|
||||
### Functional Test Runner
|
||||
|
||||
1. Create or modify your `.vscode/launch.json` file with the following configuration
|
||||
|
||||
```json
|
||||
{
|
||||
"version": "0.2.0",
|
||||
"inputs": [
|
||||
{
|
||||
"id": "grep",
|
||||
"type": "promptString",
|
||||
"description": "Grep pattern to filter tests"
|
||||
},
|
||||
{
|
||||
"id": "ftConfig",
|
||||
"type": "promptString",
|
||||
"description": "Path to the functional tests config file"
|
||||
},
|
||||
{
|
||||
"id": "ftHeadless",
|
||||
"type": "pickString",
|
||||
"description": "Run functional tests in headless mode?",
|
||||
"options": [
|
||||
{
|
||||
"label": "No - tests run in Chrome",
|
||||
"value": "0"
|
||||
},
|
||||
{
|
||||
"label": "Yes - tests run in headless mode",
|
||||
"value": "1"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"configurations": [
|
||||
{
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"name": "FT Server",
|
||||
"program": "${workspaceFolder}/scripts/functional_tests_server",
|
||||
"internalConsoleOptions": "openOnFirstSessionStart",
|
||||
"outputCapture": "std",
|
||||
"presentation": {
|
||||
"hidden": false,
|
||||
"group": "Functional tests",
|
||||
"order": 0
|
||||
},
|
||||
"args": ["--config", "${input:ftConfig}", "--debug"],
|
||||
"skipFiles": ["<node_internals>/**", "**/node_modules/**"]
|
||||
},
|
||||
{
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"name": "FT Runner",
|
||||
"env": {
|
||||
"TEST_BROWSER_HEADLESS": "${input:ftHeadless}"
|
||||
},
|
||||
"program": "${workspaceFolder}/scripts/functional_test_runner",
|
||||
"internalConsoleOptions": "openOnSessionStart",
|
||||
"outputCapture": "std",
|
||||
"presentation": {
|
||||
"hidden": false,
|
||||
"group": "Functional tests",
|
||||
"order": 1
|
||||
},
|
||||
"args": ["--config", "${input:ftConfig}", "--grep", "${input:grep}", "--verbose"],
|
||||
"skipFiles": ["<node_internals>/**", "**/node_modules/**"]
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
2. Click the "Run and debug" icon in the sidebar.
|
||||
3. Select "FT Server" from the dropdown menu and click the green play button to start the functional test server.
|
||||
4. When prompted, enter the relative path to your functional test config file.
|
||||
5. Monitor the "DEBUG CONSOLE" tab until the functional test server is ready.
|
||||
6. Select "FT Runner" from the dropdown menu and click the green play button to start the functional test runner.
|
||||
7. When prompted, choose to run your tests in headless mode or in a Chrome browser.
|
||||
8. The path to the functional tests config file should be the same as in step 4.
|
||||
9. When prompted, optionally enter a grep pattern to filter tests. Leave blank to run all tests.
|
||||
|
||||
## Debugging using logging
|
||||
|
||||
When running Kibana, it's sometimes helpful to enable verbose logging.
|
||||
|
@ -64,46 +283,48 @@ logging:
|
|||
|
||||
## Debugging Kibana with APM
|
||||
|
||||
Kibana is integrated with APM's node and RUM agents.
|
||||
Kibana is integrated with APM's node and RUM agents.
|
||||
To learn more about how APM works and what it reports, refer to the [documentation](https://www.elastic.co/guide/en/apm/guide/current/index.html).
|
||||
|
||||
We currently track the following types of transactions from Kibana:
|
||||
We currently track the following types of transactions from Kibana:
|
||||
|
||||
Frontend (APM RUM):
|
||||
* `http-request`- tracks all outgoing API requests
|
||||
* `page-load` - tracks the inidial loading time of kibana
|
||||
* `app-change` - tracks application changes
|
||||
Frontend (APM RUM):
|
||||
|
||||
Backend (APM Node):
|
||||
* `request` - tracks all incoming API requests
|
||||
* `kibana-platform` - tracks server initiation phases (preboot, setup and start)
|
||||
* `task-manager` - tracks the operation of the task manager, including claiming pending tasks and marking them as running
|
||||
* `task-run` - tracks the execution of individual tasks
|
||||
- `http-request`- tracks all outgoing API requests
|
||||
- `page-load` - tracks the inidial loading time of kibana
|
||||
- `app-change` - tracks application changes
|
||||
|
||||
Backend (APM Node):
|
||||
|
||||
- `request` - tracks all incoming API requests
|
||||
- `kibana-platform` - tracks server initiation phases (preboot, setup and start)
|
||||
- `task-manager` - tracks the operation of the task manager, including claiming pending tasks and marking them as running
|
||||
- `task-run` - tracks the execution of individual tasks
|
||||
|
||||
### Enabling APM on a local environment
|
||||
|
||||
In some cases, it is beneficial to enable APM on a local development environment to get an initial undesrtanding of a feature's performance during manual or automatic tests.
|
||||
|
||||
1. Create a secondary monitoring deployment to collect APM data. The easiest option is to use [Elastic Cloud](https://cloud.elastic.co/deployments) to create a new deployment.
|
||||
2. Open the Kibana from the monitoring deployment (_not_ your local Kibana), go to `Integrations` and enable the Elastic APM integration.
|
||||
3. Scroll down and copy the server URL and secret token. You may also find them in your cloud console under APM & Fleet.
|
||||
4. Create or open `config\kibana.dev.yml` on your local development environment.
|
||||
5. Add the following settings:
|
||||
1. Create a secondary monitoring deployment to collect APM data. The easiest option is to use [Elastic Cloud](https://cloud.elastic.co/deployments) to create a new deployment.
|
||||
2. Open the Kibana from the monitoring deployment (_not_ your local Kibana), go to `Integrations` and enable the Elastic APM integration.
|
||||
3. Scroll down and copy the server URL and secret token. You may also find them in your cloud console under APM & Fleet.
|
||||
4. Create or open `config\kibana.dev.yml` on your local development environment.
|
||||
5. Add the following settings:
|
||||
```
|
||||
elastic.apm.active: true
|
||||
elastic.apm.serverUrl: <serverUrl>
|
||||
elastic.apm.secretToken: <secretToken>
|
||||
```
|
||||
6. Once you run kibana and start using it, two new services (kibana, kibana-frontend) should appear under the APM UI on the APM deployment.
|
||||

|
||||
6. Once you run kibana and start using it, two new services (kibana, kibana-frontend) should appear under the APM UI on the APM deployment.
|
||||

|
||||
|
||||
### Enabling APM via environment variables
|
||||
|
||||
It is possible to enable APM via environment variables as well.
|
||||
They take precedence over any values defined in `kibana.yml` or `kibana.dev.yml`
|
||||
|
||||
Set the following environment variables to enable APM:
|
||||
Set the following environment variables to enable APM:
|
||||
|
||||
* ELASTIC_APM_ACTIVE
|
||||
* ELASTIC_APM_SERVER_URL
|
||||
* ELASTIC_APM_SECRET_TOKEN or ELASTIC_APM_API_KEY
|
||||
- ELASTIC_APM_ACTIVE
|
||||
- ELASTIC_APM_SERVER_URL
|
||||
- ELASTIC_APM_SECRET_TOKEN or ELASTIC_APM_API_KEY
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue