mirror of
https://github.com/PostHog/posthog.git
synced 2024-11-24 18:07:17 +01:00
a895b3fc46
Adds a hook in preview.tsx where global storybook mocks could be added passes the same default mocks that are used in Jest tests into that hook merges those mocks with any provided by the mswDecorator for a particular story
75 lines
2.2 KiB
TypeScript
75 lines
2.2 KiB
TypeScript
import '~/styles'
|
|
import './storybook.scss'
|
|
import type { Meta } from '@storybook/react'
|
|
import { worker } from '~/mocks/browser'
|
|
import { loadPostHogJS } from '~/loadPostHogJS'
|
|
import { getStorybookAppContext } from './app-context'
|
|
import { withKea } from './decorators/withKea'
|
|
import { withMockDate } from './decorators/withMockDate'
|
|
import { defaultMocks } from '~/mocks/handlers'
|
|
|
|
const setupMsw = () => {
|
|
// Make sure the msw worker is started
|
|
worker.start({
|
|
quiet: true,
|
|
})
|
|
;(window as any).__mockServiceWorker = worker
|
|
;(window as any).POSTHOG_APP_CONTEXT = getStorybookAppContext()
|
|
}
|
|
setupMsw()
|
|
|
|
const setupPosthogJs = () => {
|
|
// Make sure we don't hit production posthog. We want to control requests to,
|
|
// e.g. `/decide/` for feature flags
|
|
window.JS_POSTHOG_HOST = window.location.origin
|
|
|
|
loadPostHogJS()
|
|
}
|
|
setupPosthogJs()
|
|
|
|
// Setup storybook global parameters. See https://storybook.js.org/docs/react/writing-stories/parameters#global-parameters
|
|
export const parameters = {
|
|
chromatic: { disableSnapshot: true },
|
|
actions: { argTypesRegex: '^on[A-Z].*', disabled: true },
|
|
controls: {
|
|
matchers: {
|
|
color: /(background|color)$/i,
|
|
date: /Date$/,
|
|
},
|
|
},
|
|
options: {
|
|
// automatically show code panel
|
|
showPanel: false,
|
|
storySort: {
|
|
method: 'alphabetical',
|
|
order: [
|
|
'Lemon UI',
|
|
['Overview', 'Utilities', 'Icons'],
|
|
'Components',
|
|
'Forms',
|
|
['Field'],
|
|
'Filters',
|
|
'Layout',
|
|
],
|
|
includeName: true,
|
|
},
|
|
},
|
|
viewMode: 'docs',
|
|
// auto-expand code blocks in docs
|
|
docs: {
|
|
source: { state: 'closed' },
|
|
},
|
|
msw: {
|
|
mocks: defaultMocks,
|
|
},
|
|
}
|
|
|
|
// Setup storybook global decorators. See https://storybook.js.org/docs/react/writing-stories/decorators#global-decorators
|
|
export const decorators: Meta['decorators'] = [
|
|
// Make sure the msw service worker is started, and reset the handlers to defaults.
|
|
withKea,
|
|
// Allow us to time travel to ensure our stories don't change over time.
|
|
// To mock a date for a story, set the `mockDate` parameter.
|
|
withMockDate,
|
|
]
|