Skip to content

Commit e3af012

Browse files
yannbfyannbf
authored
Merge pull request #29700 from storybookjs/version-non-patch-from-8.5.0-alpha.10
Release: Prerelease 8.5.0-alpha.11
2 parents 8214559 + 3f34b80 commit e3af012

File tree

45 files changed

+966
-537
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+966
-537
lines changed

‎.circleci/config.yml‎

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -165,17 +165,15 @@ jobs:
165165
root: .
166166
paths:
167167
- code/node_modules
168+
- code/addons
168169
- scripts/node_modules
169170
- code/bench
170171
- code/examples
171-
- code/node_modules
172-
- code/addons
173172
- code/frameworks
174173
- code/deprecated
175174
- code/lib
176175
- code/core
177176
- code/builders
178-
- code/ui
179177
- code/renderers
180178
- code/presets
181179
- .verdaccio-cache
@@ -269,16 +267,30 @@ jobs:
269267
steps:
270268
- git-shallow-clone/checkout_advanced:
271269
clone_options: "--depth 1 --verbose"
272-
- attach_workspace:
273-
at: .
274270
- nx/set-shas:
275271
main-branch-name: "next"
276272
workflow-name: << pipeline.parameters.workflow >>
273+
- run:
274+
name: install in scripts
275+
command: |
276+
cd scripts
277+
yarn install
278+
- run:
279+
name: install in code
280+
command: |
281+
cd code
282+
yarn install
283+
- run:
284+
name: Compile
285+
command: |
286+
yarn task --task compile --start-from=compile --no-link --debug
277287
- run:
278288
name: Check
279289
command: |
280-
yarn task --task compile --start-from=auto --no-link --debug
281-
yarn task --task check --start-from=auto --no-link --debug
290+
yarn task --task check --start-from=check --no-link --debug
291+
- run:
292+
name: Ensure no changes pending
293+
command: |
282294
git diff --exit-code
283295
- report-workflow-on-failure
284296
- cancel-workflow-on-failure
@@ -807,9 +819,7 @@ workflows:
807819
- bench-packages:
808820
requires:
809821
- build
810-
- check:
811-
requires:
812-
- build
822+
- check
813823
- unit-tests:
814824
requires:
815825
- build
@@ -885,9 +895,7 @@ workflows:
885895
- bench-packages:
886896
requires:
887897
- build
888-
- check:
889-
requires:
890-
- build
898+
- check
891899
- unit-tests:
892900
requires:
893901
- build
@@ -964,9 +972,7 @@ workflows:
964972
- bench-packages:
965973
requires:
966974
- build
967-
- check:
968-
requires:
969-
- build
975+
- check
970976
- unit-tests:
971977
requires:
972978
- build

‎CHANGELOG.prerelease.md‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
1+
## 8.5.0-alpha.11
2+
3+
- Core + Addon Test: Refactor test API and fix total test count - [#29656](https://github.com/storybookjs/storybook/pull/29656), thanks @ghengeveld!
4+
- Core: Emit deprecated `TESTING_MODULE_RUN_ALL_REQUEST` for backward compatibility - [#29711](https://github.com/storybookjs/storybook/pull/29711), thanks @ghengeveld!
5+
- Frameworks: Add Vite 6 support - [#29710](https://github.com/storybookjs/storybook/pull/29710), thanks @yannbf!
6+
- TestAddon: Refactor UI & add config options - [#29662](https://github.com/storybookjs/storybook/pull/29662), thanks @ndelangen!
7+
- Vue: Fix `vue-component-meta` docgen HMR not working - [#29518](https://github.com/storybookjs/storybook/pull/29518), thanks @IonianPlayboy!
8+
19
## 8.5.0-alpha.10
210

311
- Addon Test: Use pathe for better windows support - [#29676](https://github.com/storybookjs/storybook/pull/29676), thanks @yannbf!

‎code/addons/test/src/components/ContextMenuItem.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import React, {
77
useState,
88
} from 'react';
99

10-
import { Button, type ListItem } from 'storybook/internal/components';
10+
import { Button, ListItem } from 'storybook/internal/components';
1111
import { useStorybookApi } from 'storybook/internal/manager-api';
1212
import { useTheme } from 'storybook/internal/theming';
1313
import { type API_HashEntry, type Addon_TestProviderState } from 'storybook/internal/types';
@@ -23,8 +23,7 @@ export const ContextMenuItem: FC<{
2323
state: Addon_TestProviderState<{
2424
testResults: TestResult[];
2525
}>;
26-
ListItem: typeof ListItem;
27-
}> = ({ context, state, ListItem }) => {
26+
}> = ({ context, state }) => {
2827
const api = useStorybookApi();
2928
const [isDisabled, setDisabled] = useState(false);
3029

‎code/addons/test/src/components/Description.tsx‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import React from 'react';
2+
3+
import { Link as LinkComponent } from 'storybook/internal/components';
4+
import { type TestProviderConfig, type TestProviderState } from 'storybook/internal/core-events';
5+
import { styled } from 'storybook/internal/theming';
6+
7+
import { RelativeTime } from './RelativeTime';
8+
9+
export const DescriptionStyle = styled.div(({ theme }) => ({
10+
fontSize: theme.typography.size.s1,
11+
color: theme.barTextColor,
12+
}));
13+
14+
export function Description({
15+
errorMessage,
16+
setIsModalOpen,
17+
state,
18+
}: {
19+
state: TestProviderConfig & TestProviderState;
20+
errorMessage: string;
21+
setIsModalOpen: React.Dispatch<React.SetStateAction<boolean>>;
22+
}) {
23+
let description: string | React.ReactNode = 'Not run';
24+
25+
if (state.running) {
26+
description = state.progress
27+
? `Testing... ${state.progress.numPassedTests}/${state.progress.numTotalTests}`
28+
: 'Starting...';
29+
} else if (state.failed && !errorMessage) {
30+
description = '';
31+
} else if (state.crashed || (state.failed && errorMessage)) {
32+
description = (
33+
<>
34+
<LinkComponent
35+
isButton
36+
onClick={() => {
37+
setIsModalOpen(true);
38+
}}
39+
>
40+
{state.error?.name || 'View full error'}
41+
</LinkComponent>
42+
</>
43+
);
44+
} else if (state.progress?.finishedAt) {
45+
description = (
46+
<RelativeTime
47+
timestamp={new Date(state.progress.finishedAt)}
48+
testCount={state.progress.numTotalTests}
49+
/>
50+
);
51+
} else if (state.watching) {
52+
description = 'Watching for file changes';
53+
}
54+
return <DescriptionStyle id="testing-module-description">{description}</DescriptionStyle>;
55+
}

‎code/addons/test/src/components/RelativeTime.tsx‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,23 @@
11
import { useEffect, useState } from 'react';
22

3-
import { getRelativeTimeString } from '../manager';
3+
export function getRelativeTimeString(date: Date): string {
4+
const delta = Math.round((date.getTime() - Date.now()) / 1000);
5+
const cutoffs = [60, 3600, 86400, 86400 * 7, 86400 * 30, 86400 * 365, Infinity];
6+
const units: Intl.RelativeTimeFormatUnit[] = [
7+
'second',
8+
'minute',
9+
'hour',
10+
'day',
11+
'week',
12+
'month',
13+
'year',
14+
];
15+
16+
const unitIndex = cutoffs.findIndex((cutoff) => cutoff > Math.abs(delta));
17+
const divisor = unitIndex ? cutoffs[unitIndex - 1] : 1;
18+
const rtf = new Intl.RelativeTimeFormat('en', { numeric: 'auto' });
19+
return rtf.format(Math.floor(delta / divisor), units[unitIndex]);
20+
}
421

522
export const RelativeTime = ({ timestamp, testCount }: { timestamp: Date; testCount: number }) => {
623
const [relativeTimeString, setRelativeTimeString] = useState(null);

‎code/addons/test/src/components/Subnav.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ const StyledSubnav = styled.nav(({ theme }) => ({
4141
paddingLeft: 15,
4242
}));
4343

44-
export interface SubnavProps {
44+
interface SubnavProps {
4545
controls: Controls;
4646
controlStates: ControlStates;
4747
status: Call['status'];
@@ -64,7 +64,7 @@ const Note = styled(TooltipNote)(({ theme }) => ({
6464
fontFamily: theme.typography.fonts.base,
6565
}));
6666

67-
export const StyledIconButton = styled(IconButton as any)(({ theme }) => ({
67+
const StyledIconButton = styled(IconButton)(({ theme }) => ({
6868
color: theme.textMutedColor,
6969
margin: '0 3px',
7070
}));

‎code/addons/test/src/components/TestProviderRender.stories.tsx‎

Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
import React from 'react';
2+
3+
import type { TestProviderConfig, TestProviderState } from 'storybook/internal/core-events';
4+
import { ManagerContext } from 'storybook/internal/manager-api';
5+
import { styled } from 'storybook/internal/theming';
6+
import { Addon_TypesEnum } from 'storybook/internal/types';
7+
8+
import type { Meta, StoryObj } from '@storybook/react';
9+
import { fn, within } from '@storybook/test';
10+
11+
import type { Config, Details } from '../constants';
12+
import { TestProviderRender } from './TestProviderRender';
13+
14+
type Story = StoryObj<typeof TestProviderRender>;
15+
const managerContext: any = {
16+
state: {
17+
testProviders: {
18+
'test-provider-id': {
19+
id: 'test-provider-id',
20+
name: 'Test Provider',
21+
type: Addon_TypesEnum.experimental_TEST_PROVIDER,
22+
},
23+
},
24+
},
25+
api: {
26+
getDocsUrl: fn().mockName('api::getDocsUrl'),
27+
emit: fn().mockName('api::emit'),
28+
updateTestProviderState: fn().mockName('api::updateTestProviderState'),
29+
},
30+
};
31+
32+
const config: TestProviderConfig = {
33+
id: 'test-provider-id',
34+
name: 'Test Provider',
35+
type: Addon_TypesEnum.experimental_TEST_PROVIDER,
36+
runnable: true,
37+
watchable: true,
38+
};
39+
40+
const baseState: TestProviderState<Details, Config> = {
41+
cancellable: true,
42+
cancelling: false,
43+
crashed: false,
44+
error: null,
45+
failed: false,
46+
running: false,
47+
watching: false,
48+
config: {
49+
a11y: false,
50+
coverage: false,
51+
},
52+
details: {
53+
testResults: [
54+
{
55+
endTime: 0,
56+
startTime: 0,
57+
status: 'passed',
58+
message: 'All tests passed',
59+
results: [
60+
{
61+
storyId: 'story-id',
62+
status: 'success',
63+
duration: 100,
64+
testRunId: 'test-run-id',
65+
},
66+
],
67+
},
68+
],
69+
},
70+
};
71+
72+
const Content = styled.div({
73+
padding: '12px 6px',
74+
display: 'flex',
75+
flexDirection: 'column',
76+
gap: '12px',
77+
});
78+
79+
export default {
80+
title: 'TestProviderRender',
81+
component: TestProviderRender,
82+
args: {
83+
state: {
84+
...config,
85+
...baseState,
86+
},
87+
api: managerContext.api,
88+
},
89+
decorators: [
90+
(StoryFn) => (
91+
<Content>
92+
<StoryFn />
93+
</Content>
94+
),
95+
(StoryFn) => (
96+
<ManagerContext.Provider value={managerContext}>
97+
<StoryFn />
98+
</ManagerContext.Provider>
99+
),
100+
],
101+
} as Meta<typeof TestProviderRender>;
102+
103+
export const Default: Story = {
104+
args: {
105+
state: {
106+
...config,
107+
...baseState,
108+
},
109+
},
110+
};
111+
112+
export const Running: Story = {
113+
args: {
114+
state: {
115+
...config,
116+
...baseState,
117+
running: true,
118+
},
119+
},
120+
};
121+
122+
export const EnableA11y: Story = {
123+
args: {
124+
state: {
125+
...config,
126+
...baseState,
127+
details: {
128+
testResults: [],
129+
},
130+
config: {
131+
a11y: true,
132+
coverage: false,
133+
},
134+
},
135+
},
136+
};
137+
138+
export const EnableEditing: Story = {
139+
args: {
140+
state: {
141+
...config,
142+
...baseState,
143+
config: {
144+
a11y: true,
145+
coverage: false,
146+
},
147+
details: {
148+
testResults: [],
149+
},
150+
},
151+
},
152+
153+
play: async ({ canvasElement }) => {
154+
const screen = within(canvasElement);
155+
156+
screen.getByLabelText('Edit').click();
157+
},
158+
};

0 commit comments

Comments
 (0)