[APM] Storybook support (#54970)
Add Storybook with help from changes in #43529. We still need to do some work around having mocks for hooks and HTTP requests but the basics are there.
This commit is contained in:
parent
0d19b38f18
commit
e60289f611
|
@ -18,6 +18,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
export const storybookAliases = {
|
export const storybookAliases = {
|
||||||
|
apm: 'x-pack/legacy/plugins/apm/scripts/storybook.js',
|
||||||
canvas: 'x-pack/legacy/plugins/canvas/scripts/storybook_new.js',
|
canvas: 'x-pack/legacy/plugins/canvas/scripts/storybook_new.js',
|
||||||
embeddable: 'src/plugins/embeddable/scripts/storybook.js',
|
embeddable: 'src/plugins/embeddable/scripts/storybook.js',
|
||||||
infra: 'x-pack/legacy/plugins/infra/scripts/storybook.js',
|
infra: 'x-pack/legacy/plugins/infra/scripts/storybook.js',
|
||||||
|
|
|
@ -0,0 +1,33 @@
|
||||||
|
/*
|
||||||
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||||
|
* or more contributor license agreements. Licensed under the Elastic License;
|
||||||
|
* you may not use this file except in compliance with the Elastic License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { storiesOf } from '@storybook/react';
|
||||||
|
import React from 'react';
|
||||||
|
import { PlatinumLicensePrompt } from './PlatinumLicensePrompt';
|
||||||
|
import {
|
||||||
|
ApmPluginContext,
|
||||||
|
ApmPluginContextValue
|
||||||
|
} from '../../../context/ApmPluginContext';
|
||||||
|
|
||||||
|
storiesOf('app/ServiceMap/PlatinumLicensePrompt', module).add(
|
||||||
|
'example',
|
||||||
|
() => {
|
||||||
|
const contextMock = ({
|
||||||
|
core: { http: { basePath: { prepend: () => {} } } }
|
||||||
|
} as unknown) as ApmPluginContextValue;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ApmPluginContext.Provider value={contextMock}>
|
||||||
|
<PlatinumLicensePrompt />
|
||||||
|
</ApmPluginContext.Provider>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
{
|
||||||
|
info: {
|
||||||
|
source: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
|
@ -40,7 +40,6 @@ For testing purposes APM uses 3 custom users:
|
||||||
|
|
||||||
**kibana_write_user** Apps: read/write. Indices: None
|
**kibana_write_user** Apps: read/write. Indices: None
|
||||||
|
|
||||||
|
|
||||||
To create the users with the correct roles run the following script:
|
To create the users with the correct roles run the following script:
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
|
@ -88,6 +87,12 @@ yarn prettier "./x-pack/legacy/plugins/apm/**/*.{tsx,ts,js}" --write
|
||||||
yarn eslint ./x-pack/legacy/plugins/apm --fix
|
yarn eslint ./x-pack/legacy/plugins/apm --fix
|
||||||
```
|
```
|
||||||
|
|
||||||
|
#### Storybook
|
||||||
|
|
||||||
|
Start the [Storybook](https://storybook.js.org/) development environment with
|
||||||
|
`yarn storybook apm`. All files with a .stories.tsx extension will be loaded.
|
||||||
|
You can access the development environment at http://localhost:9001.
|
||||||
|
|
||||||
#### Further resources
|
#### Further resources
|
||||||
|
|
||||||
- [Cypress integration tests](cypress/README.md)
|
- [Cypress integration tests](cypress/README.md)
|
||||||
|
|
15
x-pack/legacy/plugins/apm/scripts/storybook.js
Normal file
15
x-pack/legacy/plugins/apm/scripts/storybook.js
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
/*
|
||||||
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||||
|
* or more contributor license agreements. Licensed under the Elastic License;
|
||||||
|
* you may not use this file except in compliance with the Elastic License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { join } from 'path';
|
||||||
|
|
||||||
|
// eslint-disable-next-line
|
||||||
|
require('@kbn/storybook').runStorybookCli({
|
||||||
|
name: 'apm',
|
||||||
|
storyGlobs: [
|
||||||
|
join(__dirname, '..', 'public', 'components', '**', '*.stories.tsx')
|
||||||
|
]
|
||||||
|
});
|
Loading…
Reference in a new issue