Skip to content

Commit 9bdbff5

Browse files
shilmanstorybook-bot
authored andcommitted
Merge pull request #27358 from storybookjs/shilman/27352-fix-tags-composition
Tags: Fix composition with older storybooks (cherry picked from commit fc915d6)
1 parent 1db3454 commit 9bdbff5

File tree

16 files changed

+278
-125
lines changed

16 files changed

+278
-125
lines changed

code/e2e-tests/composition.spec.ts

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import { test, expect } from '@playwright/test';
2+
import { SbPage } from './util';
3+
4+
const storybookUrl = process.env.STORYBOOK_URL || 'http://localhost:6006';
5+
6+
// This is a slow test, and (presumably) framework independent, so only run it on one sandbox
7+
const skipTest = process.env.STORYBOOK_TEMPLATE_NAME !== 'react-vite/default-ts';
8+
9+
test.describe('composition', () => {
10+
test.beforeEach(async ({ page }) => {
11+
if (skipTest) return;
12+
await page.goto(storybookUrl);
13+
await new SbPage(page).waitUntilLoaded();
14+
});
15+
16+
test('should correctly filter composed stories', async ({ page }) => {
17+
if (skipTest) return;
18+
19+
// Expect that composed Storybooks are visible
20+
await expect(await page.getByTitle('Storybook 8.0.0')).toBeVisible();
21+
await expect(await page.getByTitle('Storybook 7.6.18')).toBeVisible();
22+
23+
// Expect composed stories to be available in the sidebar
24+
await page.locator('[id="storybook\\@8\\.0\\.0_components-badge"]').click();
25+
await expect(
26+
await page.locator('[id="storybook\\@8\\.0\\.0_components-badge--default"]')
27+
).toBeVisible();
28+
29+
await page.locator('[id="storybook\\@7\\.6\\.18_components-badge"]').click();
30+
await expect(
31+
await page.locator('[id="storybook\\@7\\.6\\.18_components-badge--default"]')
32+
).toBeVisible();
33+
34+
// Expect composed stories `to be available in the search
35+
await page.getByPlaceholder('Find components').fill('Button');
36+
await expect(
37+
await page.getByRole('option', { name: 'Button Storybook 8.0.0 / @blocks / examples' })
38+
).toBeVisible();
39+
await expect(
40+
await page.getByRole('option', { name: 'Button Storybook 7.6.18 / @blocks / examples' })
41+
).toBeVisible();
42+
});
43+
});

code/lib/core-server/src/utils/StoryIndexGenerator.test.ts

+16-16
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@ describe('StoryIndexGenerator', () => {
8888
"type": "story",
8989
},
9090
},
91-
"v": 4,
91+
"v": 5,
9292
}
9393
`);
9494
});
@@ -119,7 +119,7 @@ describe('StoryIndexGenerator', () => {
119119
"type": "story",
120120
},
121121
},
122-
"v": 4,
122+
"v": 5,
123123
}
124124
`);
125125
});
@@ -150,7 +150,7 @@ describe('StoryIndexGenerator', () => {
150150
"type": "story",
151151
},
152152
},
153-
"v": 4,
153+
"v": 5,
154154
}
155155
`);
156156
});
@@ -192,7 +192,7 @@ describe('StoryIndexGenerator', () => {
192192
"type": "story",
193193
},
194194
},
195-
"v": 4,
195+
"v": 5,
196196
}
197197
`);
198198
});
@@ -294,7 +294,7 @@ describe('StoryIndexGenerator', () => {
294294
"type": "story",
295295
},
296296
},
297-
"v": 4,
297+
"v": 5,
298298
}
299299
`);
300300
});
@@ -440,7 +440,7 @@ describe('StoryIndexGenerator', () => {
440440
"type": "story",
441441
},
442442
},
443-
"v": 4,
443+
"v": 5,
444444
}
445445
`);
446446
});
@@ -593,7 +593,7 @@ describe('StoryIndexGenerator', () => {
593593
"type": "story",
594594
},
595595
},
596-
"v": 4,
596+
"v": 5,
597597
}
598598
`);
599599
});
@@ -656,7 +656,7 @@ describe('StoryIndexGenerator', () => {
656656
"type": "story",
657657
},
658658
},
659-
"v": 4,
659+
"v": 5,
660660
}
661661
`);
662662
});
@@ -714,7 +714,7 @@ describe('StoryIndexGenerator', () => {
714714
"type": "story",
715715
},
716716
},
717-
"v": 4,
717+
"v": 5,
718718
}
719719
`);
720720
});
@@ -771,7 +771,7 @@ describe('StoryIndexGenerator', () => {
771771
"type": "story",
772772
},
773773
},
774-
"v": 4,
774+
"v": 5,
775775
}
776776
`);
777777
});
@@ -789,7 +789,7 @@ describe('StoryIndexGenerator', () => {
789789
expect(await generator.getIndex()).toMatchInlineSnapshot(`
790790
{
791791
"entries": {},
792-
"v": 4,
792+
"v": 5,
793793
}
794794
`);
795795
});
@@ -832,7 +832,7 @@ describe('StoryIndexGenerator', () => {
832832
"type": "story",
833833
},
834834
},
835-
"v": 4,
835+
"v": 5,
836836
}
837837
`);
838838
});
@@ -933,7 +933,7 @@ describe('StoryIndexGenerator', () => {
933933
"type": "docs",
934934
},
935935
},
936-
"v": 4,
936+
"v": 5,
937937
}
938938
`);
939939
});
@@ -1066,7 +1066,7 @@ describe('StoryIndexGenerator', () => {
10661066
"type": "docs",
10671067
},
10681068
},
1069-
"v": 4,
1069+
"v": 5,
10701070
}
10711071
`);
10721072
});
@@ -1127,7 +1127,7 @@ describe('StoryIndexGenerator', () => {
11271127
"type": "docs",
11281128
},
11291129
},
1130-
"v": 4,
1130+
"v": 5,
11311131
}
11321132
`);
11331133
});
@@ -1176,7 +1176,7 @@ describe('StoryIndexGenerator', () => {
11761176
"type": "story",
11771177
},
11781178
},
1179-
"v": 4,
1179+
"v": 5,
11801180
}
11811181
`);
11821182
});

code/lib/core-server/src/utils/StoryIndexGenerator.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -592,7 +592,7 @@ export class StoryIndexGenerator {
592592
);
593593

594594
this.lastIndex = {
595-
v: 4,
595+
v: 5,
596596
entries: sorted,
597597
};
598598

code/lib/core-server/src/utils/stories-json.test.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -263,7 +263,7 @@ describe('useStoriesJson', () => {
263263
"type": "story",
264264
},
265265
},
266-
"v": 4,
266+
"v": 5,
267267
}
268268
`);
269269
}, 20_000);

code/lib/core-server/src/utils/summarizeIndex.test.ts

+14-14
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ describe('summarizeIndex', () => {
3838
it('example stories', () => {
3939
expect(
4040
summarizeIndex({
41-
v: 4,
41+
v: 5,
4242
entries: {
4343
'example-introduction--docs': {
4444
id: 'example-introduction--docs',
@@ -146,14 +146,14 @@ describe('summarizeIndex', () => {
146146
"playStoryCount": 0,
147147
"storiesMdxCount": 0,
148148
"storyCount": 0,
149-
"version": 4,
149+
"version": 5,
150150
}
151151
`);
152152
});
153153
it('onboarding stories', () => {
154154
expect(
155155
summarizeIndex({
156-
v: 4,
156+
v: 5,
157157
entries: {
158158
'example-introduction--docs': {
159159
id: 'example-introduction--docs',
@@ -204,14 +204,14 @@ describe('summarizeIndex', () => {
204204
"playStoryCount": 0,
205205
"storiesMdxCount": 0,
206206
"storyCount": 0,
207-
"version": 4,
207+
"version": 5,
208208
}
209209
`);
210210
});
211211
it('user stories', () => {
212212
expect(
213213
summarizeIndex({
214-
v: 4,
214+
v: 5,
215215
entries: {
216216
'stories-renderers-react-errors--story-contains-unrenderable': {
217217
id: 'stories-renderers-react-errors--story-contains-unrenderable',
@@ -260,14 +260,14 @@ describe('summarizeIndex', () => {
260260
"playStoryCount": 0,
261261
"storiesMdxCount": 0,
262262
"storyCount": 4,
263-
"version": 4,
263+
"version": 5,
264264
}
265265
`);
266266
});
267267
it('pages', () => {
268268
expect(
269269
summarizeIndex({
270-
v: 4,
270+
v: 5,
271271
entries: {
272272
'example-page--logged-out': {
273273
id: 'example-page--logged-out',
@@ -317,14 +317,14 @@ describe('summarizeIndex', () => {
317317
"playStoryCount": 1,
318318
"storiesMdxCount": 0,
319319
"storyCount": 1,
320-
"version": 4,
320+
"version": 5,
321321
}
322322
`);
323323
});
324324
it('storiesMdx', () => {
325325
expect(
326326
summarizeIndex({
327-
v: 4,
327+
v: 5,
328328
entries: {
329329
'stories-renderers-react-react-mdx--docs': {
330330
id: 'stories-renderers-react-react-mdx--docs',
@@ -374,14 +374,14 @@ describe('summarizeIndex', () => {
374374
"playStoryCount": 0,
375375
"storiesMdxCount": 1,
376376
"storyCount": 3,
377-
"version": 4,
377+
"version": 5,
378378
}
379379
`);
380380
});
381381
it('autodocs', () => {
382382
expect(
383383
summarizeIndex({
384-
v: 4,
384+
v: 5,
385385
entries: {
386386
'example-button--docs': {
387387
id: 'example-button--docs',
@@ -432,14 +432,14 @@ describe('summarizeIndex', () => {
432432
"playStoryCount": 0,
433433
"storiesMdxCount": 0,
434434
"storyCount": 0,
435-
"version": 4,
435+
"version": 5,
436436
}
437437
`);
438438
});
439439
it('mdx', () => {
440440
expect(
441441
summarizeIndex({
442-
v: 4,
442+
v: 5,
443443
entries: {
444444
'example-introduction--docs': {
445445
id: 'example-introduction--docs',
@@ -483,7 +483,7 @@ describe('summarizeIndex', () => {
483483
"playStoryCount": 0,
484484
"storiesMdxCount": 0,
485485
"storyCount": 0,
486-
"version": 4,
486+
"version": 5,
487487
}
488488
`);
489489
});

0 commit comments

Comments
 (0)