How to use firstEnhancer method in storybook-root

Best JavaScript code snippet using storybook-root

prepareStory.test.ts

Source:prepareStory.test.ts Github

copy

Full Screen

1import global from 'global';2import { addons, HooksContext } from '@storybook/addons';3import type {4 AnyFramework,5 ArgsEnhancer,6 SBObjectType,7 SBScalarType,8 StoryContext,9} from '@storybook/csf';10import { NO_TARGET_NAME } from '../args';11import { prepareStory } from './prepareStory';12jest.mock('global', () => ({13 ...(jest.requireActual('global') as any),14 FEATURES: {15 breakingChangesV7: true,16 },17}));18const id = 'id';19const name = 'name';20const title = 'title';21const render = (args: any) => {};22const stringType: SBScalarType = { name: 'string' };23const numberType: SBScalarType = { name: 'number' };24const booleanType: SBScalarType = { name: 'boolean' };25const complexType: SBObjectType = {26 name: 'object',27 value: {28 complex: {29 name: 'object',30 value: {31 object: {32 name: 'array',33 value: { name: 'string' },34 },35 },36 },37 },38};39beforeEach(() => {40 global.FEATURES = { breakingChangesV7: true };41});42describe('prepareStory', () => {43 describe('parameters', () => {44 it('are combined in the right order', () => {45 const { parameters } = prepareStory(46 { id, name, parameters: { a: 'story', nested: { z: 'story' } } },47 {48 id,49 title,50 parameters: {51 a: { name: 'component' },52 b: { name: 'component' },53 nested: { z: { name: 'component' }, y: { name: 'component' } },54 },55 },56 {57 render,58 parameters: {59 a: { name: 'global' },60 b: { name: 'global' },61 c: { name: 'global' },62 nested: { z: { name: 'global' }, x: { name: 'global' } },63 },64 }65 );66 expect(parameters).toEqual({67 __isArgsStory: true,68 a: 'story',69 b: { name: 'component' },70 c: { name: 'global' },71 nested: { z: 'story', y: { name: 'component' }, x: { name: 'global' } },72 });73 });74 it('sets a value even if metas do not have parameters', () => {75 const { parameters } = prepareStory({ id, name }, { id, title }, { render });76 expect(parameters).toEqual({ __isArgsStory: true });77 });78 it('does not set `__isArgsStory` if `passArgsFirst` is disabled', () => {79 const { parameters } = prepareStory(80 { id, name, parameters: { passArgsFirst: false } },81 { id, title },82 { render }83 );84 expect(parameters).toEqual({ passArgsFirst: false, __isArgsStory: false });85 });86 it('does not set `__isArgsStory` if `render` does not take args', () => {87 const { parameters } = prepareStory({ id, name }, { id, title }, { render: () => {} });88 expect(parameters).toEqual({ __isArgsStory: false });89 });90 });91 describe('args/initialArgs', () => {92 it('are combined in the right order', () => {93 const { initialArgs } = prepareStory(94 { id, name, args: { a: 'story', nested: { z: 'story' } } },95 {96 id,97 title,98 args: {99 a: 'component',100 b: 'component',101 nested: { z: 'component', y: 'component' },102 },103 },104 {105 render,106 args: {107 a: 'global',108 b: 'global',109 c: 'global',110 nested: { z: 'global', x: 'global' },111 },112 }113 );114 expect(initialArgs).toEqual({115 a: 'story',116 b: 'component',117 c: 'global',118 nested: { z: 'story' },119 });120 });121 it('can be overriden by `undefined`', () => {122 const { initialArgs } = prepareStory(123 { id, name, args: { a: undefined } },124 { id, title, args: { a: 'component' } },125 { render }126 );127 expect(initialArgs).toEqual({ a: undefined });128 });129 it('sets a value even if metas do not have args', () => {130 const { initialArgs } = prepareStory({ id, name }, { id, title }, { render });131 expect(initialArgs).toEqual({});132 });133 it('are initialized to argTypes[x].defaultValue if unset', () => {134 const { initialArgs } = prepareStory(135 {136 id,137 name,138 args: {139 arg2: 3,140 arg4: 'foo',141 arg7: false,142 },143 argTypes: {144 arg1: { name: 'arg1', type: stringType, defaultValue: 'arg1' },145 arg2: { name: 'arg2', type: numberType, defaultValue: 2 },146 arg3: {147 name: 'arg3',148 type: complexType,149 defaultValue: { complex: { object: ['type'] } },150 },151 arg4: { name: 'arg4', type: stringType },152 arg5: { name: 'arg5', type: stringType },153 arg6: { name: 'arg6', type: numberType, defaultValue: 0 }, // See https://github.com/storybookjs/storybook/issues/12767 }154 },155 },156 { id, title },157 { render: () => {} }158 );159 expect(initialArgs).toEqual({160 arg1: 'arg1',161 arg2: 3,162 arg3: { complex: { object: ['type'] } },163 arg4: 'foo',164 arg6: 0,165 arg7: false,166 });167 });168 describe('argsEnhancers', () => {169 it('are applied in the right order', () => {170 const run = [];171 const enhancerOne: ArgsEnhancer<AnyFramework> = () => {172 run.push(1);173 return {};174 };175 const enhancerTwo: ArgsEnhancer<AnyFramework> = () => {176 run.push(2);177 return {};178 };179 prepareStory(180 { id, name },181 { id, title },182 { render, argsEnhancers: [enhancerOne, enhancerTwo] }183 );184 expect(run).toEqual([1, 2]);185 });186 it('allow you to add args', () => {187 const enhancer = jest.fn(() => ({ c: 'd' }));188 const { initialArgs } = prepareStory(189 { id, name, args: { a: 'b' } },190 { id, title },191 { render, argsEnhancers: [enhancer] }192 );193 expect(enhancer).toHaveBeenCalledWith(expect.objectContaining({ initialArgs: { a: 'b' } }));194 expect(initialArgs).toEqual({ a: 'b', c: 'd' });195 });196 it('passes result of earlier enhancers into subsequent ones, and composes their output', () => {197 const enhancerOne = jest.fn(() => ({ b: 'B' }));198 const enhancerTwo = jest.fn(({ initialArgs }) =>199 Object.entries(initialArgs).reduce(200 (acc, [key, val]) => ({ ...acc, [key]: `enhanced ${val}` }),201 {}202 )203 );204 const enhancerThree = jest.fn(() => ({ c: 'C' }));205 const { initialArgs } = prepareStory(206 { id, name, args: { a: 'A' } },207 { id, title },208 { render, argsEnhancers: [enhancerOne, enhancerTwo, enhancerThree] }209 );210 expect(enhancerOne).toHaveBeenCalledWith(211 expect.objectContaining({ initialArgs: { a: 'A' } })212 );213 expect(enhancerTwo).toHaveBeenCalledWith(214 expect.objectContaining({ initialArgs: { a: 'A', b: 'B' } })215 );216 expect(enhancerThree).toHaveBeenCalledWith(217 expect.objectContaining({ initialArgs: { a: 'enhanced A', b: 'enhanced B' } })218 );219 expect(initialArgs).toEqual({220 a: 'enhanced A',221 b: 'enhanced B',222 c: 'C',223 });224 });225 });226 });227 describe('argTypes', () => {228 it('are combined in the right order', () => {229 const { argTypes } = prepareStory(230 {231 id,232 name,233 argTypes: {234 a: { name: 'a-story', type: booleanType },235 nested: { name: 'nested', type: booleanType, a: 'story' },236 },237 },238 {239 id,240 title,241 argTypes: {242 a: { name: 'a-component', type: stringType },243 b: { name: 'b-component', type: stringType },244 nested: { name: 'nested', type: booleanType, a: 'component', b: 'component' },245 },246 },247 {248 render,249 argTypes: {250 a: { name: 'a-global', type: numberType },251 b: { name: 'b-global', type: numberType },252 c: { name: 'c-global', type: numberType },253 nested: { name: 'nested', type: booleanType, a: 'global', b: 'global', c: 'global' },254 },255 }256 );257 expect(argTypes).toEqual({258 a: { name: 'a-story', type: booleanType },259 b: { name: 'b-component', type: stringType },260 c: { name: 'c-global', type: numberType },261 nested: { name: 'nested', type: booleanType, a: 'story', b: 'component', c: 'global' },262 });263 });264 describe('argTypesEnhancers', () => {265 it('allows you to alter argTypes when stories are added', () => {266 const enhancer = jest.fn((context) => ({ ...context.argTypes, c: { name: 'd' } }));267 const { argTypes } = prepareStory(268 { id, name, argTypes: { a: { name: 'b' } } },269 { id, title },270 { render, argTypesEnhancers: [enhancer] }271 );272 expect(enhancer).toHaveBeenCalledWith(273 expect.objectContaining({ argTypes: { a: { name: 'b' } } })274 );275 expect(argTypes).toEqual({ a: { name: 'b' }, c: { name: 'd' } });276 });277 it('does not merge argType enhancer results', () => {278 const enhancer = jest.fn(() => ({ c: { name: 'd' } }));279 const { argTypes } = prepareStory(280 { id, name, argTypes: { a: { name: 'b' } } },281 { id, title },282 { render, argTypesEnhancers: [enhancer] }283 );284 expect(enhancer).toHaveBeenCalledWith(285 expect.objectContaining({ argTypes: { a: { name: 'b' } } })286 );287 expect(argTypes).toEqual({ c: { name: 'd' } });288 });289 it('recursively passes argTypes to successive enhancers', () => {290 const firstEnhancer = jest.fn((context) => ({ ...context.argTypes, c: { name: 'd' } }));291 const secondEnhancer = jest.fn((context) => ({ ...context.argTypes, e: { name: 'f' } }));292 const { argTypes } = prepareStory(293 { id, name, argTypes: { a: { name: 'b' } } },294 { id, title },295 { render, argTypesEnhancers: [firstEnhancer, secondEnhancer] }296 );297 expect(firstEnhancer).toHaveBeenCalledWith(298 expect.objectContaining({ argTypes: { a: { name: 'b' } } })299 );300 expect(secondEnhancer).toHaveBeenCalledWith(301 expect.objectContaining({ argTypes: { a: { name: 'b' }, c: { name: 'd' } } })302 );303 expect(argTypes).toEqual({ a: { name: 'b' }, c: { name: 'd' }, e: { name: 'f' } });304 });305 });306 });307 describe('applyLoaders', () => {308 it('awaits the result of a loader', async () => {309 const loader = jest.fn(async () => new Promise((r) => setTimeout(() => r({ foo: 7 }), 100)));310 const { applyLoaders } = prepareStory(311 { id, name, loaders: [loader] },312 { id, title },313 { render }314 );315 const storyContext = { context: 'value' } as any;316 const loadedContext = await applyLoaders(storyContext);317 expect(loader).toHaveBeenCalledWith(storyContext);318 expect(loadedContext).toEqual({319 context: 'value',320 loaded: { foo: 7 },321 });322 });323 it('loaders are composed in the right order', async () => {324 const globalLoader = async () => ({ foo: 1, bar: 1, baz: 1 });325 const componentLoader = async () => ({ foo: 3, bar: 3 });326 const storyLoader = async () => ({ foo: 5 });327 const { applyLoaders } = prepareStory(328 { id, name, loaders: [storyLoader] },329 { id, title, loaders: [componentLoader] },330 { render, loaders: [globalLoader] }331 );332 const storyContext = { context: 'value' } as any;333 const loadedContext = await applyLoaders(storyContext);334 expect(loadedContext).toEqual({335 context: 'value',336 loaded: { foo: 5, bar: 3, baz: 1 },337 });338 });339 it('later loaders override earlier loaders', async () => {340 const loaders = [341 async () => new Promise((r) => setTimeout(() => r({ foo: 7 }), 100)),342 async () => new Promise((r) => setTimeout(() => r({ foo: 3 }), 50)),343 ];344 const { applyLoaders } = prepareStory({ id, name, loaders }, { id, title }, { render });345 const storyContext = { context: 'value' } as any;346 const loadedContext = await applyLoaders(storyContext);347 expect(loadedContext).toEqual({348 context: 'value',349 loaded: { foo: 3 },350 });351 });352 });353 describe('undecoratedStoryFn', () => {354 it('args are mapped by argTypes[x].mapping', () => {355 const renderMock = jest.fn();356 const story = prepareStory(357 {358 id,359 name,360 argTypes: {361 one: { name: 'one', type: { name: 'string' }, mapping: { 1: 'mapped' } },362 two: { name: 'two', type: { name: 'string' }, mapping: { 1: 'no match' } },363 },364 args: { one: 1, two: 2, three: 3 },365 },366 { id, title },367 { render: renderMock }368 );369 const context = { args: story.initialArgs, ...story };370 story.undecoratedStoryFn(context as any);371 expect(renderMock).toHaveBeenCalledWith(372 { one: 'mapped', two: 2, three: 3 },373 expect.objectContaining({ args: { one: 'mapped', two: 2, three: 3 } })374 );375 });376 it('passes args as the first argument to the story if `parameters.passArgsFirst` is true', () => {377 const renderMock = jest.fn();378 const firstStory = prepareStory(379 { id, name, args: { a: 1 }, parameters: { passArgsFirst: true } },380 { id, title },381 { render: renderMock }382 );383 firstStory.undecoratedStoryFn({ args: firstStory.initialArgs, ...firstStory } as any);384 expect(renderMock).toHaveBeenCalledWith(385 { a: 1 },386 expect.objectContaining({ args: { a: 1 } })387 );388 const secondStory = prepareStory(389 { id, name, args: { a: 1 }, parameters: { passArgsFirst: false } },390 { id, title },391 { render: renderMock }392 );393 secondStory.undecoratedStoryFn({ args: secondStory.initialArgs, ...secondStory } as any);394 expect(renderMock).toHaveBeenCalledWith(expect.objectContaining({ args: { a: 1 } }));395 });396 });397 describe('storyFn', () => {398 it('produces a story with inherited decorators applied', () => {399 const renderMock = jest.fn();400 const globalDecorator = jest.fn((s) => s());401 const componentDecorator = jest.fn((s) => s());402 const storyDecorator = jest.fn((s) => s());403 const story = prepareStory(404 {405 id,406 name,407 decorators: [storyDecorator],408 },409 { id, title, decorators: [componentDecorator] },410 { render: renderMock, decorators: [globalDecorator] }411 );412 addons.setChannel({ on: jest.fn(), removeListener: jest.fn() } as any);413 const hooks = new HooksContext();414 story.unboundStoryFn({ args: story.initialArgs, hooks, ...story } as any);415 expect(globalDecorator).toHaveBeenCalled();416 expect(componentDecorator).toHaveBeenCalled();417 expect(storyDecorator).toHaveBeenCalled();418 expect(renderMock).toHaveBeenCalled();419 hooks.clean();420 });421 });422 describe('with `FEATURES.argTypeTargetsV7`', () => {423 beforeEach(() => {424 global.FEATURES = { breakingChangesV7: true, argTypeTargetsV7: true };425 });426 it('filters out targeted args', () => {427 const renderMock = jest.fn();428 const firstStory = prepareStory(429 {430 id,431 name,432 args: { a: 1, b: 2 },433 argTypes: { b: { name: 'b', target: 'foo' } },434 },435 { id, title },436 { render: renderMock }437 );438 firstStory.unboundStoryFn({439 args: firstStory.initialArgs,440 hooks: new HooksContext(),441 ...firstStory,442 } as any);443 expect(renderMock).toHaveBeenCalledWith(444 { a: 1 },445 expect.objectContaining({ args: { a: 1 }, allArgs: { a: 1, b: 2 } })446 );447 });448 it('adds argsByTarget to context', () => {449 const renderMock = jest.fn();450 const firstStory = prepareStory(451 {452 id,453 name,454 args: { a: 1, b: 2 },455 argTypes: { b: { name: 'b', target: 'foo' } },456 },457 { id, title },458 { render: renderMock }459 );460 firstStory.unboundStoryFn({461 args: firstStory.initialArgs,462 hooks: new HooksContext(),463 ...firstStory,464 } as any);465 expect(renderMock).toHaveBeenCalledWith(466 { a: 1 },467 expect.objectContaining({ argsByTarget: { [NO_TARGET_NAME]: { a: 1 }, foo: { b: 2 } } })468 );469 });470 it('always sets args, even when all are targetted', () => {471 const renderMock = jest.fn();472 const firstStory = prepareStory(473 {474 id,475 name,476 args: { b: 2 },477 argTypes: { b: { name: 'b', target: 'foo' } },478 },479 { id, title },480 { render: renderMock }481 );482 firstStory.unboundStoryFn({483 args: firstStory.initialArgs,484 hooks: new HooksContext(),485 ...firstStory,486 } as any);487 expect(renderMock).toHaveBeenCalledWith(488 {},489 expect.objectContaining({ argsByTarget: { foo: { b: 2 } } })490 );491 });492 it('always sets args, even when none are set for the story', () => {493 const renderMock = jest.fn();494 const firstStory = prepareStory(495 {496 id,497 name,498 },499 { id, title },500 { render: renderMock }501 );502 firstStory.unboundStoryFn({503 args: firstStory.initialArgs,504 hooks: new HooksContext(),505 ...firstStory,506 } as any);507 expect(renderMock).toHaveBeenCalledWith({}, expect.objectContaining({ argsByTarget: {} }));508 });509 });510});511describe('playFunction', () => {512 it('awaits play if defined', async () => {513 const inner = jest.fn();514 const play = jest.fn(async () => {515 await new Promise((r) => setTimeout(r, 0)); // Ensure this puts an async boundary in516 inner();517 });518 const { playFunction } = prepareStory({ id, name, play }, { id, title }, { render });519 await playFunction({} as StoryContext<AnyFramework>);520 expect(play).toHaveBeenCalled();521 expect(inner).toHaveBeenCalled();522 });...

Full Screen

Full Screen

index.test.ts

Source:index.test.ts Github

copy

Full Screen

1import { createStore, combineReducers, applyMiddleware, bindActionCreator, compose } from '..';2import { emptyReducer } from './utils/fixture';3const INCREMENT_ACTION_TYPE = 'INCREMENT';4describe('createStore', () => {5 it('should get initialState', () => {6 const store = createStore(emptyReducer, { counter: 0 });7 expect(store.getState()).toEqual({ counter: 0 });8 });9 it('should get {} without initialState', () => {10 const store = createStore(emptyReducer);11 expect(store.getState()).toEqual({});12 });13});14describe('dispatch, subscribe and replaceReducer in store', () => {15 const reducer = (preveState: any, action: any) => {16 if (action.type === INCREMENT_ACTION_TYPE) {17 return { ...preveState, counter: preveState.counter + 1 };18 }19 };20 it('should change State', () => {21 const store = createStore(reducer, { counter: 0 });22 expect(store.getState()).toEqual({ counter: 0 });23 store.dispatch({ type: INCREMENT_ACTION_TYPE });24 expect(store.getState()).toEqual({ counter: 1 });25 });26 it('should run subscribe after dispatch', () => {27 const store = createStore(reducer, { counter: 0 });28 const subscriber = jest.fn();29 store.subscribe(subscriber);30 store.dispatch({ type: INCREMENT_ACTION_TYPE });31 expect(subscriber.mock.calls.length).toBe(1);32 store.dispatch({ type: INCREMENT_ACTION_TYPE });33 expect(subscriber.mock.calls.length).toBe(2);34 });35 it('should return unscribe function when call subscribe', () => {36 const store = createStore(reducer, { counter: 0 });37 const subscriber = jest.fn();38 const unscribe = store.subscribe(subscriber);39 store.dispatch({ type: INCREMENT_ACTION_TYPE });40 expect(subscriber.mock.calls.length).toBe(1);41 unscribe();42 store.dispatch({ type: INCREMENT_ACTION_TYPE });43 expect(subscriber.mock.calls.length).toBe(1);44 });45 it('should use new reducer after call replace reducer', () => {46 const originalReducer = jest.fn().mockImplementation((state) => state);47 const store = createStore(originalReducer, { counter: 0 });48 const newRedcuer = jest.fn().mockImplementation((...args) => {49 return reducer(...args);50 });51 store.dispatch({ type: INCREMENT_ACTION_TYPE });52 expect(store.getState()).toEqual({ counter: 0 });53 expect(originalReducer.mock.calls.length).toEqual(1);54 store.replaceReducer(newRedcuer);55 store.dispatch({ type: INCREMENT_ACTION_TYPE });56 expect(originalReducer.mock.calls.length).toEqual(1);57 expect(store.getState()).toEqual({ counter: 1 });58 expect(newRedcuer.mock.calls.length).toEqual(1);59 });60});61const APPLE_INCREMENT_ACTION_TYPE = 'APPLE_INCREMENT';62const BANANA_INCREMENT_ACTION_TYPE = 'BANANA_INCREMENT';63describe('combineReducers', () => {64 const appleReducer = (state: any, action: any) => {65 if (action.type === APPLE_INCREMENT_ACTION_TYPE) {66 return { ...state, counter: state.counter + 1 };67 }68 return state;69 };70 const bananaReducer = (state: any, action: any) => {71 if (action.type === BANANA_INCREMENT_ACTION_TYPE) {72 return { ...state, counter: state.counter + 1 };73 }74 return state;75 };76 it('should combine reducers', () => {77 const combindReducers = combineReducers({78 apple: appleReducer,79 banana: bananaReducer,80 });81 const initialState = {82 apple: { counter: 0 },83 banana: { counter: 0 },84 };85 const store = createStore(combindReducers, initialState);86 expect(store.getState()).toEqual(initialState);87 store.dispatch({ type: BANANA_INCREMENT_ACTION_TYPE });88 expect(store.getState()).toEqual({ apple: { counter: 0 }, banana: { counter: 1 } });89 store.dispatch({ type: APPLE_INCREMENT_ACTION_TYPE });90 expect(store.getState()).toEqual({ apple: { counter: 1 }, banana: { counter: 1 } });91 });92});93describe('applyMiddleware', () => {94 let mockedMiddleware;95 const middleware = (getState: Function, dispatch: Function) => {96 return (next) =>97 (mockedMiddleware = jest.fn().mockImplementation((action) => {98 next(action);99 }));100 };101 let secondMockedMiddelware;102 const secondMiddelware = (getState, dispatch) => (next) =>103 (secondMockedMiddelware = jest.fn().mockImplementation((action) => {104 next(action);105 }));106 const initialState = { counter: 0 };107 const reducer = (state, action) => {108 if (action.type === INCREMENT_ACTION_TYPE) {109 return { ...state, counter: state.counter + 1 };110 }111 return state;112 };113 it('should call middleware and update state', () => {114 const store = createStore(reducer, initialState, applyMiddleware(middleware));115 store.dispatch({116 type: INCREMENT_ACTION_TYPE,117 });118 expect(store.getState()).toEqual({ counter: 1 });119 expect(mockedMiddleware.mock.calls.length).toBe(1);120 });121 it('should call each middelware in middleware chain', () => {122 const store = createStore(reducer, initialState, applyMiddleware(middleware, secondMiddelware));123 store.dispatch({124 type: INCREMENT_ACTION_TYPE,125 });126 expect(store.getState()).toEqual({ counter: 1 });127 expect(mockedMiddleware.mock.calls.length).toBe(1);128 expect(secondMockedMiddelware.mock.calls.length).toBe(1);129 });130});131describe('bindActionCreators', () => {132 const reducer = (state, action) =>133 action.type === INCREMENT_ACTION_TYPE ? { ...state, counter: state.counter + action.payload.step || 1 } : state;134 const actionCreator = (step: number) => {135 return {136 type: INCREMENT_ACTION_TYPE,137 payload: { step },138 };139 };140 it('should call correct dispatach', () => {141 const store = createStore(reducer, { counter: 0 });142 let mockedDispatch;143 const originalDispatch = store.dispatch;144 store.dispatch = mockedDispatch = jest.fn().mockImplementation((action: any) => {145 return originalDispatch(action);146 });147 const increment = bindActionCreator(actionCreator, store.dispatch);148 increment();149 expect(mockedDispatch.mock.calls.length).toBe(1);150 expect(store.getState()).toEqual({ counter: 1 });151 increment(2);152 expect(mockedDispatch.mock.calls.length).toBe(2);153 expect(store.getState()).toEqual({ counter: 3 });154 });155});156describe('compose', () => {157 let mockedMiddleware;158 const middleware = (getState: Function, dispatch: Function) => {159 return (next) =>160 (mockedMiddleware = jest.fn().mockImplementation((action) => {161 next(action);162 }));163 };164 const calledEnhancers = [];165 const firstEnhancer = (store) => {166 store.enhancedFunctionFirst = () => {167 return 'first enhancedStore';168 };169 calledEnhancers.push('first');170 return store;171 };172 const secondEnhancer = (store) => {173 store.enhancedFunctionSecond = () => {174 return 'second enhancedStore';175 };176 calledEnhancers.push('second');177 return store;178 };179 it('will call enhancers in order', () => {180 const store = createStore(emptyReducer, {}, compose(secondEnhancer, firstEnhancer));181 expect(store.enhancedFunctionFirst).toBeTruthy();182 expect(store.enhancedFunctionFirst()).toBe('first enhancedStore');183 expect(store.enhancedFunctionSecond).toBeTruthy();184 expect(store.enhancedFunctionSecond()).toEqual('second enhancedStore');185 ['first', 'second'].forEach((num: number, index: number) => {186 expect(calledEnhancers[index]).toBe(num);187 });188 });...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1import { firstEnhancer } from 'storybook-root-config';2import { secondEnhancer } from 'storybook-root-config';3export const decorators = [firstEnhancer, secondEnhancer];4module.exports = {5 stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)'],6 webpackFinal: async (config) => {7 const firstEnhancer = require('storybook-root-config').firstEnhancer;8 const secondEnhancer = require('storybook-root-config').secondEnhancer;9 return [firstEnhancer, secondEnhancer].reduce(10 (finalConfig, enhancer) => enhancer(finalConfig),11 );12 },13};14import { firstEnhancer } from 'storybook-root-config';15import { secondEnhancer } from 'storybook-root-config';16export const decorators = [firstEnhancer, secondEnhancer];17module.exports = {18 stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)'],19 webpackFinal: async (config) => {20 const firstEnhancer = require('storybook-root-config').firstEnhancer;

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1import { firstEnhancer } from 'storybook-root-config';2import { configure, addDecorator } from '@storybook/react';3addDecorator(firstEnhancer);4configure(require.context('../src', true, /\.stories\.js$/), module);5import { addDecorator } from '@storybook/react';6import { withA11y } from '@storybook/addon-a11y';7import { withKnobs } from '@storybook/addon-knobs';8import { withInfo } from '@storybook/addon-info';9import { withTests } from '@storybook/addon-jest';10import { withConsole } from '@storybook/addon-console';11import { withPerformance } from 'storybook-addon-performance';12import { withBackgrounds } from '@storybook/addon-backgrounds';13import { withViewport } from '@storybook/addon-viewport';14import { withOptions } from '@storybook/addon-options';15import { withCssResources } from '@storybook/addon-cssresources';16import { withContexts } from '@storybook/addon-contexts/react';17import { withRedux } from 'addon-redux';18import { withMockedApis } from 'storybook-addon-mock';19import { withThemesProvider } from 'storybook-addon-styled-component-theme';20import { withI18next } from 'storybook-addon-i18next';21import { withGraphQL } from 'storybook-addon-graphql';22import { withStyledComponents } from 'storybook-addon-styled-component-theme/dist/withStyledComponents';23import { withContexts as withContexts2 } from 'storybook-addon-contexts';24import { withXstate } from 'storybook-addon-xstate-viz';25import { withEmotion } from 'storybook-addon-emotion-theme/dist/withEmotion';26import { withA11y as withA11y2 } from 'storybook-addon-a11y';27import { withTests as withTests2 } from 'storybook-addon-jest';28import { withConsole as withConsole2 } from 'storybook-addon-console';29import { withPerformance as withPerformance2 } from 'storybook-addon-performance';30import { withBackgrounds as withBackgrounds2 } from 'storybook-addon-backgrounds';31import { withViewport as withViewport2 } from 'storybook-addon-viewport';32import { withOptions as withOptions2 } from 'storybook-addon-options';33import { withCssResources as withCssResources2 } from 'storybook-addon-cssresources';34import { withRedux as withRedux2 } from 'storybook-addon-redux

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { useFirstEnhancer } = require('storybook-root-config');2module.exports = {3 webpackFinal: async (config) => {4 return useFirstEnhancer(config);5 },6};7const { useSecondEnhancer } = require('storybook-root-config');8module.exports = {9 webpackFinal: async (config) => {10 return useSecondEnhancer(config);11 },12};13const { useThirdEnhancer } = require('storybook-root-config');14module.exports = {

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1import { firstEnhancer } from 'storybook-root-config';2export const decorators = [firstEnhancer];3import { firstEnhancer } from 'storybook-root-config';4export const decorators = [firstEnhancer];5import { firstEnhancer } from 'storybook-root-config';6export const decorators = [firstEnhancer];7import { withRootConfig } from 'storybook-root-config';8export default {9};10export const test = () => <div>Test</div>;11import { withRootConfig } from 'storybook-root-config';12export const decorators = [withRootConfig];13import { withRootConfig } from 'storybook-root-config';14export const decorators = [withRootConfig];15export const rootConfig = {16};

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1import {firstEnhancer} from 'storybook-root';2import {storiesOf} from '@storybook/react';3import {withInfo} from '@storybook/addon-info';4storiesOf('My Component', module)5 .addDecorator(firstEnhancer)6 .add('with text', () => <div>Hello World</div>)7 .add('with some emoji', () => <div>😀 😎 👍 💯</div>)8import {secondEnhancer} from 'storybook-root';9import {storiesOf} from '@storybook/react';10import {withInfo} from '@storybook/addon-info';11storiesOf('My Component', module)12 .addDecorator(secondEnhancer)13 .add('with text', () => <div>Hello World</div>)14 .add('with some emoji', () => <div>😀 😎 👍 💯</div>)15import {thirdEnhancer} from 'storybook-root';16import {storiesOf} from '@storybook/react';17import {withInfo} from '@storybook/addon-info';18storiesOf('My Component', module)19 .addDecorator(thirdEnhancer)20 .add('with text', () => <div>Hello World</div>)21 .add('with some emoji', () => <div>😀 😎 👍 💯</div>)22import {fourthEnhancer} from 'storybook-root';23import {storiesOf} from '@storybook/react';24import {withInfo} from '@storybook/addon-info';25storiesOf('My Component', module)26 .addDecorator(fourthEnhancer)27 .add('with text', () => <div>Hello World</div>)28 .add('with some emoji', () => <div>😀 😎 👍 💯</div>)29import {fifthEnhancer} from 'storybook-root';30import {storiesOf} from '@

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1import { firstEnhancer } from 'storybook-root-config';2import { addDecorator } from '@storybook/react';3addDecorator(firstEnhancer);4const path = require('path');5module.exports = ({ config }) => {6 config.module.rules.push({7 {8 options: {9 includePaths: [path.resolve(__dirname, '../src')],10 },11 },12 include: path.resolve(__dirname, '../'),13 });14 return config;15};16{17 "scripts": {18 },19 "devDependencies": {20 },21 "dependencies": {22 },23 "storybook": {24 }25}26{27 "scripts": {28 },29 "devDependencies": {30 },31 "dependencies": {32 },33 "storybook": {34 },35 "storybook-root-config": {36 }37}38import React from 'react';39import { addDecorator, addParameters } from '@storybook/react';40import { withA11y } from '@storybook/add

Full Screen

Full Screen

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run storybook-root automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

... View sample repo... View DocumentationSign up Free
›
_

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

...
Sign up with GoogleSign up with Email
Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful