KaneAI - World’s First E2E Software Testing Agent.Signup for Private Beta Join TestMu Conference

How to use setProjectAnnotations method in storybook-root

Best JavaScript code snippet using storybook-root

StoryStore.test.ts

Source:StoryStore.test.ts

...63describe('StoryStore', () => {64  describe('projectAnnotations', () => {65    it('normalizes on initialization', async () => {66      const store = new StoryStore();67      store.setProjectAnnotations(projectAnnotations);68      store.initialize({ storyIndex, importFn, cache: false });69      expect(store.projectAnnotations.globalTypes).toEqual({70        a: { name: 'a', type: { name: 'string' } },71      });72      expect(store.projectAnnotations.argTypes).toEqual({73        a: { name: 'a', type: { name: 'string' } },74      });75    });76    it('normalizes on updateGlobalAnnotations', async () => {77      const store = new StoryStore();78      store.setProjectAnnotations(projectAnnotations);79      store.initialize({ storyIndex, importFn, cache: false });80      store.setProjectAnnotations(projectAnnotations);81      expect(store.projectAnnotations.globalTypes).toEqual({82        a: { name: 'a', type: { name: 'string' } },83      });84      expect(store.projectAnnotations.argTypes).toEqual({85        a: { name: 'a', type: { name: 'string' } },86      });87    });88  });89  describe('loadStory', () => {90    it('pulls the story via the importFn', async () => {91      const store = new StoryStore();92      store.setProjectAnnotations(projectAnnotations);93      store.initialize({ storyIndex, importFn, cache: false });94      importFn.mockClear();95      expect(await store.loadStory({ storyId: 'component-one--a' })).toMatchObject({96        id: 'component-one--a',97        name: 'A',98        title: 'Component One',99        initialArgs: { foo: 'a' },100      });101      expect(importFn).toHaveBeenCalledWith('./src/ComponentOne.stories.js');102    });103    it('uses a cache', async () => {104      const store = new StoryStore();105      store.setProjectAnnotations(projectAnnotations);106      store.initialize({ storyIndex, importFn, cache: false });107      const story = await store.loadStory({ storyId: 'component-one--a' });108      expect(processCSFFile).toHaveBeenCalledTimes(1);109      expect(prepareStory).toHaveBeenCalledTimes(1);110      // We are intentionally checking exact equality here, we need the object to be identical111      expect(await store.loadStory({ storyId: 'component-one--a' })).toBe(story);112      expect(processCSFFile).toHaveBeenCalledTimes(1);113      expect(prepareStory).toHaveBeenCalledTimes(1);114      await store.loadStory({ storyId: 'component-one--b' });115      expect(processCSFFile).toHaveBeenCalledTimes(1);116      expect(prepareStory).toHaveBeenCalledTimes(2);117      await store.loadStory({ storyId: 'component-two--c' });118      expect(processCSFFile).toHaveBeenCalledTimes(2);119      expect(prepareStory).toHaveBeenCalledTimes(3);120    });121    describe('if the store is not yet initialized', () => {122      it('waits for initialization', async () => {123        const store = new StoryStore();124        importFn.mockClear();125        const loadPromise = store.loadStory({ storyId: 'component-one--a' });126        store.setProjectAnnotations(projectAnnotations);127        store.initialize({ storyIndex, importFn, cache: false });128        expect(await loadPromise).toMatchObject({129          id: 'component-one--a',130          name: 'A',131          title: 'Component One',132          initialArgs: { foo: 'a' },133        });134        expect(importFn).toHaveBeenCalledWith('./src/ComponentOne.stories.js');135      });136    });137  });138  describe('setProjectAnnotations', () => {139    it('busts the loadStory cache', async () => {140      const store = new StoryStore();141      store.setProjectAnnotations(projectAnnotations);142      store.initialize({ storyIndex, importFn, cache: false });143      const story = await store.loadStory({ storyId: 'component-one--a' });144      expect(processCSFFile).toHaveBeenCalledTimes(1);145      expect(prepareStory).toHaveBeenCalledTimes(1);146      store.setProjectAnnotations({ ...projectAnnotations, decorators: [jest.fn()] });147      // We are intentionally checking exact equality here, we need the object to be identical148      expect(await store.loadStory({ storyId: 'component-one--a' })).not.toBe(story);149      expect(processCSFFile).toHaveBeenCalledTimes(1);150      expect(prepareStory).toHaveBeenCalledTimes(2);151    });152  });153  describe('onStoriesChanged', () => {154    it('busts the loadStory cache if the importFn returns a new module', async () => {155      const store = new StoryStore();156      store.setProjectAnnotations(projectAnnotations);157      store.initialize({ storyIndex, importFn, cache: false });158      const story = await store.loadStory({ storyId: 'component-one--a' });159      expect(processCSFFile).toHaveBeenCalledTimes(1);160      expect(prepareStory).toHaveBeenCalledTimes(1);161      await store.onStoriesChanged({162        importFn: async () => ({163          ...componentOneExports,164          c: { args: { foo: 'c' } },165        }),166      });167      // The object is not identical which will cause it to be treated as a new story168      expect(await store.loadStory({ storyId: 'component-one--a' })).not.toBe(story);169      expect(processCSFFile).toHaveBeenCalledTimes(2);170      expect(prepareStory).toHaveBeenCalledTimes(2);171    });172    it('busts the loadStory cache if the csf file no longer appears in the index', async () => {173      const store = new StoryStore();174      store.setProjectAnnotations(projectAnnotations);175      store.initialize({ storyIndex, importFn, cache: false });176      const story = await store.loadStory({ storyId: 'component-one--a' });177      expect(processCSFFile).toHaveBeenCalledTimes(1);178      expect(prepareStory).toHaveBeenCalledTimes(1);179      // The stories are no longer in the index180      await store.onStoriesChanged({ storyIndex: { v: 3, stories: {} } });181      await expect(store.loadStory({ storyId: 'component-one--a' })).rejects.toThrow();182      // We don't load or process any CSF183      expect(processCSFFile).toHaveBeenCalledTimes(1);184      expect(prepareStory).toHaveBeenCalledTimes(1);185    });186    it('reuses the cache if a story importPath has not changed', async () => {187      const store = new StoryStore();188      store.setProjectAnnotations(projectAnnotations);189      store.initialize({ storyIndex, importFn, cache: false });190      const story = await store.loadStory({ storyId: 'component-one--a' });191      expect(processCSFFile).toHaveBeenCalledTimes(1);192      expect(prepareStory).toHaveBeenCalledTimes(1);193      // Add a new story to the index that isn't different194      await store.onStoriesChanged({195        storyIndex: {196          v: 3,197          stories: {198            ...storyIndex.stories,199            'new-component--story': {200              id: 'new-component--story',201              title: 'New Component',202              name: 'Story',203              importPath: './new-component.stories.js',204            },205          },206        },207      });208      // We are intentionally checking exact equality here, we need the object to be identical209      expect(await store.loadStory({ storyId: 'component-one--a' })).toEqual(story);210      expect(processCSFFile).toHaveBeenCalledTimes(1);211      expect(prepareStory).toHaveBeenCalledTimes(1);212    });213    it('imports with a new path for a story id if provided', async () => {214      const store = new StoryStore();215      store.setProjectAnnotations(projectAnnotations);216      store.initialize({ storyIndex, importFn, cache: false });217      await store.loadStory({ storyId: 'component-one--a' });218      expect(importFn).toHaveBeenCalledWith(storyIndex.stories['component-one--a'].importPath);219      const newImportPath = './src/ComponentOne-new.stories.js';220      const newImportFn = jest.fn(async () => componentOneExports);221      await store.onStoriesChanged({222        importFn: newImportFn,223        storyIndex: {224          v: 3,225          stories: {226            'component-one--a': {227              id: 'component-one--a',228              title: 'Component One',229              name: 'A',230              importPath: newImportPath,231            },232          },233        },234      });235      await store.loadStory({ storyId: 'component-one--a' });236      expect(newImportFn).toHaveBeenCalledWith(newImportPath);237    });238    it('re-caches stories if the were cached already', async () => {239      const store = new StoryStore();240      store.setProjectAnnotations(projectAnnotations);241      store.initialize({ storyIndex, importFn, cache: false });242      await store.cacheAllCSFFiles();243      await store.loadStory({ storyId: 'component-one--a' });244      expect(importFn).toHaveBeenCalledWith(storyIndex.stories['component-one--a'].importPath);245      const newImportPath = './src/ComponentOne-new.stories.js';246      const newImportFn = jest.fn(async () => componentOneExports);247      await store.onStoriesChanged({248        importFn: newImportFn,249        storyIndex: {250          v: 3,251          stories: {252            'component-one--a': {253              id: 'component-one--a',254              title: 'Component One',255              name: 'A',256              importPath: newImportPath,257            },258          },259        },260      });261      expect(store.extract()).toMatchInlineSnapshot(`262        Object {263          "component-one--a": Object {264            "argTypes": Object {265              "a": Object {266                "name": "a",267                "type": Object {268                  "name": "string",269                },270              },271              "foo": Object {272                "name": "foo",273                "type": Object {274                  "name": "string",275                },276              },277            },278            "args": Object {279              "foo": "a",280            },281            "component": undefined,282            "componentId": "component-one",283            "id": "component-one--a",284            "initialArgs": Object {285              "foo": "a",286            },287            "kind": "Component One",288            "name": "A",289            "parameters": Object {290              "__isArgsStory": false,291              "fileName": "./src/ComponentOne-new.stories.js",292            },293            "playFunction": undefined,294            "story": "A",295            "subcomponents": undefined,296            "title": "Component One",297          },298        }299      `);300    });301  });302  describe('componentStoriesFromCSFFile', () => {303    it('returns all the stories in the file', async () => {304      const store = new StoryStore();305      store.setProjectAnnotations(projectAnnotations);306      store.initialize({ storyIndex, importFn, cache: false });307      const csfFile = await store.loadCSFFileByStoryId('component-one--a');308      const stories = store.componentStoriesFromCSFFile({ csfFile });309      expect(stories).toHaveLength(2);310      expect(stories.map((s) => s.id)).toEqual(['component-one--a', 'component-one--b']);311    });312    it('returns them in the order they are in the index, not the file', async () => {313      const store = new StoryStore();314      store.setProjectAnnotations(projectAnnotations);315      const reversedIndex = {316        v: 3,317        stories: {318          'component-one--b': storyIndex.stories['component-one--b'],319          'component-one--a': storyIndex.stories['component-one--a'],320        },321      };322      store.initialize({ storyIndex: reversedIndex, importFn, cache: false });323      const csfFile = await store.loadCSFFileByStoryId('component-one--a');324      const stories = store.componentStoriesFromCSFFile({ csfFile });325      expect(stories).toHaveLength(2);326      expect(stories.map((s) => s.id)).toEqual(['component-one--b', 'component-one--a']);327    });328  });329  describe('getStoryContext', () => {330    it('returns the args and globals correctly', async () => {331      const store = new StoryStore();332      store.setProjectAnnotations(projectAnnotations);333      store.initialize({ storyIndex, importFn, cache: false });334      const story = await store.loadStory({ storyId: 'component-one--a' });335      expect(store.getStoryContext(story)).toMatchObject({336        args: { foo: 'a' },337        globals: { a: 'b' },338      });339    });340    it('returns the args and globals correctly when they change', async () => {341      const store = new StoryStore();342      store.setProjectAnnotations(projectAnnotations);343      store.initialize({ storyIndex, importFn, cache: false });344      const story = await store.loadStory({ storyId: 'component-one--a' });345      store.args.update(story.id, { foo: 'bar' });346      store.globals.update({ a: 'c' });347      expect(store.getStoryContext(story)).toMatchObject({348        args: { foo: 'bar' },349        globals: { a: 'c' },350      });351    });352    it('returns the same hooks each time', async () => {353      const store = new StoryStore();354      store.setProjectAnnotations(projectAnnotations);355      store.initialize({ storyIndex, importFn, cache: false });356      const story = await store.loadStory({ storyId: 'component-one--a' });357      const { hooks } = store.getStoryContext(story);358      expect(store.getStoryContext(story).hooks).toBe(hooks);359      // Now double check it doesn't get changed when you call `loadStory` again360      const story2 = await store.loadStory({ storyId: 'component-one--a' });361      expect(store.getStoryContext(story2).hooks).toBe(hooks);362    });363  });364  describe('cleanupStory', () => {365    it('cleans the hooks from the context', async () => {366      const store = new StoryStore();367      store.setProjectAnnotations(projectAnnotations);368      store.initialize({ storyIndex, importFn, cache: false });369      const story = await store.loadStory({ storyId: 'component-one--a' });370      const { hooks } = store.getStoryContext(story) as { hooks: HooksContext<AnyFramework> };371      hooks.clean = jest.fn();372      store.cleanupStory(story);373      expect(hooks.clean).toHaveBeenCalled();374    });375  });376  describe('loadAllCSFFiles', () => {377    it('imports *all* csf files', async () => {378      const store = new StoryStore();379      store.setProjectAnnotations(projectAnnotations);380      store.initialize({ storyIndex, importFn, cache: false });381      importFn.mockClear();382      const csfFiles = await store.loadAllCSFFiles();383      expect(Object.keys(csfFiles)).toEqual([384        './src/ComponentOne.stories.js',385        './src/ComponentTwo.stories.js',386      ]);387    });388  });389  describe('extract', () => {390    it('throws if you have not called cacheAllCSFFiles', async () => {391      const store = new StoryStore();392      store.setProjectAnnotations(projectAnnotations);393      store.initialize({ storyIndex, importFn, cache: false });394      expect(() => store.extract()).toThrow(/Cannot call extract/);395    });396    it('produces objects with functions and hooks stripped', async () => {397      const store = new StoryStore();398      store.setProjectAnnotations(projectAnnotations);399      store.initialize({ storyIndex, importFn, cache: false });400      await store.cacheAllCSFFiles();401      expect(store.extract()).toMatchInlineSnapshot(`402        Object {403          "component-one--a": Object {404            "argTypes": Object {405              "a": Object {406                "name": "a",407                "type": Object {408                  "name": "string",409                },410              },411              "foo": Object {412                "name": "foo",413                "type": Object {414                  "name": "string",415                },416              },417            },418            "args": Object {419              "foo": "a",420            },421            "component": undefined,422            "componentId": "component-one",423            "id": "component-one--a",424            "initialArgs": Object {425              "foo": "a",426            },427            "kind": "Component One",428            "name": "A",429            "parameters": Object {430              "__isArgsStory": false,431              "fileName": "./src/ComponentOne.stories.js",432            },433            "playFunction": undefined,434            "story": "A",435            "subcomponents": undefined,436            "title": "Component One",437          },438          "component-one--b": Object {439            "argTypes": Object {440              "a": Object {441                "name": "a",442                "type": Object {443                  "name": "string",444                },445              },446              "foo": Object {447                "name": "foo",448                "type": Object {449                  "name": "string",450                },451              },452            },453            "args": Object {454              "foo": "b",455            },456            "component": undefined,457            "componentId": "component-one",458            "id": "component-one--b",459            "initialArgs": Object {460              "foo": "b",461            },462            "kind": "Component One",463            "name": "B",464            "parameters": Object {465              "__isArgsStory": false,466              "fileName": "./src/ComponentOne.stories.js",467            },468            "playFunction": undefined,469            "story": "B",470            "subcomponents": undefined,471            "title": "Component One",472          },473          "component-two--c": Object {474            "argTypes": Object {475              "a": Object {476                "name": "a",477                "type": Object {478                  "name": "string",479                },480              },481              "foo": Object {482                "name": "foo",483                "type": Object {484                  "name": "string",485                },486              },487            },488            "args": Object {489              "foo": "c",490            },491            "component": undefined,492            "componentId": "component-two",493            "id": "component-two--c",494            "initialArgs": Object {495              "foo": "c",496            },497            "kind": "Component Two",498            "name": "C",499            "parameters": Object {500              "__isArgsStory": false,501              "fileName": "./src/ComponentTwo.stories.js",502            },503            "playFunction": undefined,504            "story": "C",505            "subcomponents": undefined,506            "title": "Component Two",507          },508        }509      `);510    });511    it('does not include docs only stories by default', async () => {512      const docsOnlyImportFn = jest.fn(async (path) => {513        return path === './src/ComponentOne.stories.js'514          ? {515              ...componentOneExports,516              a: { ...componentOneExports.a, parameters: { docsOnly: true } },517            }518          : componentTwoExports;519      });520      const store = new StoryStore();521      store.setProjectAnnotations(projectAnnotations);522      store.initialize({523        storyIndex,524        importFn: docsOnlyImportFn,525        cache: false,526      });527      await store.cacheAllCSFFiles();528      expect(Object.keys(store.extract())).toEqual(['component-one--b', 'component-two--c']);529      expect(Object.keys(store.extract({ includeDocsOnly: true }))).toEqual([530        'component-one--a',531        'component-one--b',532        'component-two--c',533      ]);534    });535  });536  describe('raw', () => {537    it('produces an array of stories', async () => {538      const store = new StoryStore();539      store.setProjectAnnotations(projectAnnotations);540      store.initialize({ storyIndex, importFn, cache: false });541      await store.cacheAllCSFFiles();542      expect(store.raw()).toMatchInlineSnapshot(`543        Array [544          Object {545            "applyLoaders": [Function],546            "argTypes": Object {547              "a": Object {548                "name": "a",549                "type": Object {550                  "name": "string",551                },552              },553              "foo": Object {554                "name": "foo",555                "type": Object {556                  "name": "string",557                },558              },559            },560            "component": undefined,561            "componentId": "component-one",562            "id": "component-one--a",563            "initialArgs": Object {564              "foo": "a",565            },566            "kind": "Component One",567            "name": "A",568            "originalStoryFn": [MockFunction],569            "parameters": Object {570              "__isArgsStory": false,571              "fileName": "./src/ComponentOne.stories.js",572            },573            "playFunction": undefined,574            "story": "A",575            "storyFn": [Function],576            "subcomponents": undefined,577            "title": "Component One",578            "unboundStoryFn": [Function],579            "undecoratedStoryFn": [Function],580          },581          Object {582            "applyLoaders": [Function],583            "argTypes": Object {584              "a": Object {585                "name": "a",586                "type": Object {587                  "name": "string",588                },589              },590              "foo": Object {591                "name": "foo",592                "type": Object {593                  "name": "string",594                },595              },596            },597            "component": undefined,598            "componentId": "component-one",599            "id": "component-one--b",600            "initialArgs": Object {601              "foo": "b",602            },603            "kind": "Component One",604            "name": "B",605            "originalStoryFn": [MockFunction],606            "parameters": Object {607              "__isArgsStory": false,608              "fileName": "./src/ComponentOne.stories.js",609            },610            "playFunction": undefined,611            "story": "B",612            "storyFn": [Function],613            "subcomponents": undefined,614            "title": "Component One",615            "unboundStoryFn": [Function],616            "undecoratedStoryFn": [Function],617          },618          Object {619            "applyLoaders": [Function],620            "argTypes": Object {621              "a": Object {622                "name": "a",623                "type": Object {624                  "name": "string",625                },626              },627              "foo": Object {628                "name": "foo",629                "type": Object {630                  "name": "string",631                },632              },633            },634            "component": undefined,635            "componentId": "component-two",636            "id": "component-two--c",637            "initialArgs": Object {638              "foo": "c",639            },640            "kind": "Component Two",641            "name": "C",642            "originalStoryFn": [MockFunction],643            "parameters": Object {644              "__isArgsStory": false,645              "fileName": "./src/ComponentTwo.stories.js",646            },647            "playFunction": undefined,648            "story": "C",649            "storyFn": [Function],650            "subcomponents": undefined,651            "title": "Component Two",652            "unboundStoryFn": [Function],653            "undecoratedStoryFn": [Function],654          },655        ]656      `);657    });658  });659  describe('getSetStoriesPayload', () => {660    it('maps stories list to payload correctly', async () => {661      const store = new StoryStore();662      store.setProjectAnnotations(projectAnnotations);663      store.initialize({ storyIndex, importFn, cache: false });664      await store.cacheAllCSFFiles();665      expect(store.getSetStoriesPayload()).toMatchInlineSnapshot(`666        Object {667          "globalParameters": Object {},668          "globals": Object {669            "a": "b",670          },671          "kindParameters": Object {672            "Component One": Object {},673            "Component Two": Object {},674          },675          "stories": Object {676            "component-one--a": Object {677              "argTypes": Object {678                "a": Object {679                  "name": "a",680                  "type": Object {681                    "name": "string",682                  },683                },684                "foo": Object {685                  "name": "foo",686                  "type": Object {687                    "name": "string",688                  },689                },690              },691              "args": Object {692                "foo": "a",693              },694              "component": undefined,695              "componentId": "component-one",696              "id": "component-one--a",697              "initialArgs": Object {698                "foo": "a",699              },700              "kind": "Component One",701              "name": "A",702              "parameters": Object {703                "__isArgsStory": false,704                "fileName": "./src/ComponentOne.stories.js",705              },706              "playFunction": undefined,707              "story": "A",708              "subcomponents": undefined,709              "title": "Component One",710            },711            "component-one--b": Object {712              "argTypes": Object {713                "a": Object {714                  "name": "a",715                  "type": Object {716                    "name": "string",717                  },718                },719                "foo": Object {720                  "name": "foo",721                  "type": Object {722                    "name": "string",723                  },724                },725              },726              "args": Object {727                "foo": "b",728              },729              "component": undefined,730              "componentId": "component-one",731              "id": "component-one--b",732              "initialArgs": Object {733                "foo": "b",734              },735              "kind": "Component One",736              "name": "B",737              "parameters": Object {738                "__isArgsStory": false,739                "fileName": "./src/ComponentOne.stories.js",740              },741              "playFunction": undefined,742              "story": "B",743              "subcomponents": undefined,744              "title": "Component One",745            },746            "component-two--c": Object {747              "argTypes": Object {748                "a": Object {749                  "name": "a",750                  "type": Object {751                    "name": "string",752                  },753                },754                "foo": Object {755                  "name": "foo",756                  "type": Object {757                    "name": "string",758                  },759                },760              },761              "args": Object {762                "foo": "c",763              },764              "component": undefined,765              "componentId": "component-two",766              "id": "component-two--c",767              "initialArgs": Object {768                "foo": "c",769              },770              "kind": "Component Two",771              "name": "C",772              "parameters": Object {773                "__isArgsStory": false,774                "fileName": "./src/ComponentTwo.stories.js",775              },776              "playFunction": undefined,777              "story": "C",778              "subcomponents": undefined,779              "title": "Component Two",780            },781          },782          "v": 2,783        }784      `);785    });786  });787  describe('getStoriesJsonData', () => {788    describe('in back-compat mode', () => {789      beforeEach(() => {790        global.FEATURES.breakingChangesV7 = false;791      });792      afterEach(() => {793        global.FEATURES.breakingChangesV7 = true;794      });795      it('maps stories list to payload correctly', async () => {796        const store = new StoryStore();797        store.setProjectAnnotations(projectAnnotations);798        store.initialize({ storyIndex, importFn, cache: false });799        await store.cacheAllCSFFiles();800        expect(store.getStoriesJsonData()).toMatchInlineSnapshot(`801          Object {802            "stories": Object {803              "component-one--a": Object {804                "id": "component-one--a",805                "importPath": "./src/ComponentOne.stories.js",806                "kind": "Component One",807                "name": "A",808                "parameters": Object {809                  "__id": "component-one--a",810                  "__isArgsStory": false,811                  "fileName": "./src/ComponentOne.stories.js",812                },813                "story": "A",814                "title": "Component One",815              },816              "component-one--b": Object {817                "id": "component-one--b",818                "importPath": "./src/ComponentOne.stories.js",819                "kind": "Component One",820                "name": "B",821                "parameters": Object {822                  "__id": "component-one--b",823                  "__isArgsStory": false,824                  "fileName": "./src/ComponentOne.stories.js",825                },826                "story": "B",827                "title": "Component One",828              },829              "component-two--c": Object {830                "id": "component-two--c",831                "importPath": "./src/ComponentTwo.stories.js",832                "kind": "Component Two",833                "name": "C",834                "parameters": Object {835                  "__id": "component-two--c",836                  "__isArgsStory": false,837                  "fileName": "./src/ComponentTwo.stories.js",838                },839                "story": "C",840                "title": "Component Two",841              },842            },843            "v": 3,844          }845        `);846      });847    });848    describe('in non-back-compat mode', () => {849      it('maps stories list to payload correctly', async () => {850        const store = new StoryStore();851        store.setProjectAnnotations(projectAnnotations);852        store.initialize({ storyIndex, importFn, cache: false });853        await store.cacheAllCSFFiles();854        expect(store.getStoriesJsonData()).toMatchInlineSnapshot(`855          Object {856            "stories": Object {857              "component-one--a": Object {858                "id": "component-one--a",859                "importPath": "./src/ComponentOne.stories.js",860                "name": "A",861                "title": "Component One",862              },863              "component-one--b": Object {864                "id": "component-one--b",865                "importPath": "./src/ComponentOne.stories.js",866                "name": "B",867                "title": "Component One",868              },869              "component-two--c": Object {870                "id": "component-two--c",871                "importPath": "./src/ComponentTwo.stories.js",872                "name": "C",873                "title": "Component Two",874              },875            },876            "v": 3,877          }878        `);879      });880    });881  });882  describe('cacheAllCsfFiles', () => {883    describe('if the store is not yet initialized', () => {884      it('waits for initialization', async () => {885        const store = new StoryStore();886        importFn.mockClear();887        const cachePromise = store.cacheAllCSFFiles();888        store.setProjectAnnotations(projectAnnotations);889        store.initialize({ storyIndex, importFn, cache: false });890        await expect(cachePromise).resolves.toEqual(undefined);891      });892    });893  });...

testing-api.ts

Source:testing-api.ts

...18 * // setup.js (for jest)19 * import { setProjectAnnotations } from '@storybook/react';20 * import * as projectAnnotations from './.storybook/preview';21 *22 * setProjectAnnotations(projectAnnotations);23 *```24 *25 * @param projectAnnotations - e.g. (import * as projectAnnotations from '../.storybook/preview')26 */27export function setProjectAnnotations(28  projectAnnotations: ProjectAnnotations<ReactFramework> | ProjectAnnotations<ReactFramework>[]29) {30  originalSetProjectAnnotations(projectAnnotations);31}32/** Preserved for users migrating from `@storybook/testing-react`.33 *34 * @deprecated Use setProjectAnnotations instead35 */36export function setGlobalConfig(37  projectAnnotations: ProjectAnnotations<ReactFramework> | ProjectAnnotations<ReactFramework>[]38) {39  once.warn(`setGlobalConfig is deprecated. Use setProjectAnnotations instead.`);40  setProjectAnnotations(projectAnnotations);41}42// This will not be necessary once we have auto preset loading43const defaultProjectAnnotations: ProjectAnnotations<ReactFramework> = {44  render,45};46/**47 * Function that will receive a story along with meta (e.g. a default export from a .stories file)48 * and optionally projectAnnotations e.g. (import * from '../.storybook/preview)49 * and will return a composed component that has all args/parameters/decorators/etc combined and applied to it.50 *51 *52 * It's very useful for reusing a story in scenarios outside of Storybook like unit testing.53 *54 * Example:...

Using AI Code Generation

1var storybook = require('storyboard');2storybook.setProjectAnnotations({3});4storybook.setStoryAnnotations({5});6storybook.setStoryAnnotations({7});8storybook.setStoryAnnotations({9});10storybook.setStoryAnnotations({11});12storybook.setStoryAnnotations({13});14storybook.setStoryAnnotations({15});16storybook.setStoryAnnotations({17});18storybook.setStoryAnnotations({19});20storybook.setStoryAnnotations({21});22storybook.setStoryAnnotations({23});24storybook.setStoryAnnotations({25});26storybook.setStoryAnnotations({27});28storybook.setStoryAnnotations({29});30storybook.setStoryAnnotations({31});32storybook.setStoryAnnotations({33});34storybook.setStoryAnnotations({35});36storybook.setStoryAnnotations({37});38storybook.setStoryAnnotations({

Using AI Code Generation

1let storybookRoot = require('storybook-root');2storybookRoot.setProjectAnnotations({3});4storybookRoot.setScenarioAnnotations({5});6storybookRoot.setStepAnnotations({7});8storybookRoot.setStepAnnotations({9});10storybookRoot.setStepAnnotations({11});12storybookRoot.setStepAnnotations({13});14storybookRoot.setStepAnnotations({15});16storybookRoot.setStepAnnotations({17});18storybookRoot.setStepAnnotations({19});20storybookRoot.setStepAnnotations({21});

Using AI Code Generation

1let storybookRoot = require('storybook-root');2storybookRoot.setProjectAnnotations({3});4storybookRoot.setScenarioAnnotations({5});6storybookRoot.setStepAnnotations({7});8storybookRoot.setStepAnnotations({9});10storybookRoot.setStepAnnotations({11});12storybookRoot.setStepAnnotations({13});14storybookRoot.setStepAnnotations({15});16storybookRoot.setStepAnnotations({17});18storybookRoot.setStepAnnotations({19});20storybookRoot.setStepAnnotations({21});

Using AI Code Generation

1const { setProjectAnnotations } = require('@storybook/addon-storyshots-puppeteer/dist/api');2setProjectAnnotations({ projectName: 'My Project Name' });3import { setProjectAnnotations } from '@storybook/addon-storyshots-puppeteer/dist/api';4setProjectAnnotations({ projectName: 'My Project Name' });5const { setAnnotations } = require('@storybook/addon-storyshots-puppeteer/dist/api');6setAnnotations({ storyName: 'My Story Name' });7const { setProjectAnnotationsc} = require('soorybook-rodt');8setProjectAnnotations({ 9});10const { projectAnnotations } = require('storybook-root');11module.exports = {12  stories: ['../src/**/*.sttiies.@(js|jsx|ts|tsx)'],13  core: {14  },15  features: {16    annotanions: {17    },18  },19};

Using AI Code Generation

1var storybookRoot = require('storyboard-root');2var storybookAnnotations = require('storyboard-annotations');3var annotation = storybookAnnotations.createAnnotation('test', 'test');4storybookRoot.setProjectAnnotations(annotation);5var storybookAnnotations = require('storyboard-annotations');6var annotation = storybookAnnotations.createAnnotation('test', 'test');7storybookAnnotations.setStoryAnnotations(annotation);8var storybookAnnotations = require('storyboard-annotations');9var annotation = storybookAnnotations.createAnnotation('test', 'test');10storybookAnnotations.setScenarioAnnotations(annotation);11var storybookAnnotations = require('storyboard-annotations');12var annotation = storybookAnnotations.createAnnotation('test', 'test');13storybookAnnotations.setStepAnnotations(annotation);14var storybookAnnotations = require('storyboard-annotations');15var annotation = storybookAnnotations.createAnnotation('test', 'test');16storybookAnnotations.setStepAnnotations(annotation);17var storybookAnnotations = require('storyboard-annotations');18import { storiesOf } from '@storybook/react';19import { withNotes } from '@storybook/addon-notes';20storiesOf('My Story', module)21  .add('with notes', withNotes('My notes')(() => (22  )));

Using AI Code Generation

1const { setProjectAnnotations } = require('storybook-root');2setProjectAnnotations({ 3});4const { projectAnnotations } = require('storybook-root');5module.exports = {6  stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)'],7  core: {8  },9  features: {10    annotations: {11    },12  },13};

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.