[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 = {
|
||||
apm: 'x-pack/legacy/plugins/apm/scripts/storybook.js',
|
||||
canvas: 'x-pack/legacy/plugins/canvas/scripts/storybook_new.js',
|
||||
embeddable: 'src/plugins/embeddable/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
|
||||
|
||||
|
||||
To create the users with the correct roles run the following script:
|
||||
|
||||
```sh
|
||||
|
@ -88,6 +87,12 @@ yarn prettier "./x-pack/legacy/plugins/apm/**/*.{tsx,ts,js}" --write
|
|||
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
|
||||
|
||||
- [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