Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Storybook] upgrade Storybook to v8 #7659

Merged
merged 4 commits into from
Apr 16, 2024
Merged

[Storybook] upgrade Storybook to v8 #7659

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
13d6d5b
build(storybook): upgrade to v8
mgadewoll Apr 8, 2024
2e6077e
docs(storybook): updat to use react-docgen-typescript
mgadewoll Apr 8, 2024
da8a53b
build(storybook): update v8 to use Babel instead of SWC as compiler
mgadewoll Apr 12, 2024
2a8f82a
Merge branch 'main' into storybook/7646-v8-upgrade
mgadewoll Apr 16, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .browserslistrc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,5 +2,7 @@ last 2 versions
not dead
not IE 11
Safari 7
# adding as part of Storybook upgrade to v8 https://github.com/babel/babel/issues/16171#issuecomment-2015227043
not op_mob >= 1

# Safari 7 for PhantomJS support
4 changes: 4 additions & 0 deletions .storybook/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ const config: StorybookConfig = {
'@storybook/addon-links',
'@storybook/addon-essentials',
'@storybook/addon-interactions',
'@storybook/addon-webpack5-compiler-babel',
],
framework: {
name: '@storybook/react-webpack5',
Expand All @@ -34,6 +35,9 @@ const config: StorybookConfig = {
docs: {
autodocs: 'tag',
},
typescript: {
reactDocgen: 'react-docgen-typescript',
},
};

export default config;
1 change: 0 additions & 1 deletion .storybook/preview.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,6 @@ const preview: Preview = {
},
},
parameters: {
actions: { argTypesRegex: '^on[A-Z].*' },
backgrounds: { disable: true }, // Use colorMode instead
options: {
showPanel: true, // default to showing the controls panel
Expand Down
19 changes: 10 additions & 9 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,7 @@
],
"dependencies": {
"@hello-pangea/dnd": "^16.6.0",
"@storybook/test": "^8.0.5",
"@types/lodash": "^4.14.202",
"@types/numeral": "^2.0.5",
"@types/react-window": "^1.8.8",
Expand Down Expand Up @@ -118,13 +119,13 @@
"@emotion/react": "^11.11.0",
"@faker-js/faker": "^8.0.2",
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
"@storybook/addon-essentials": "^7.5.2",
"@storybook/addon-interactions": "^7.5.2",
"@storybook/addon-links": "^7.5.2",
"@storybook/blocks": "^7.5.2",
"@storybook/react": "^7.5.2",
"@storybook/react-webpack5": "^7.5.2",
"@storybook/testing-library": "^0.2.2",
"@storybook/addon-essentials": "^8.0.5",
"@storybook/addon-interactions": "^8.0.5",
"@storybook/addon-links": "^8.0.5",
"@storybook/addon-webpack5-compiler-babel": "^3.0.3",
"@storybook/blocks": "^8.0.5",
"@storybook/react": "^8.0.5",
"@storybook/react-webpack5": "^8.0.5",
"@svgr/core": "8.0.0",
"@svgr/plugin-jsx": "^8.0.1",
"@svgr/plugin-svgo": "^8.0.1",
Expand Down Expand Up @@ -188,7 +189,7 @@
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.32.2",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-storybook": "^0.6.15",
"eslint-plugin-storybook": "^0.8.0",
"expose-gc": "^1.0.0",
"file-loader": "^6.1.0",
"findup": "^0.1.5",
Expand Down Expand Up @@ -233,7 +234,7 @@
"sass-loader": "^13.2.0",
"shelljs": "^0.8.4",
"start-server-and-test": "^1.11.3",
"storybook": "^7.5.2",
"storybook": "^8.0.5",
"style-loader": "^3.3.1",
"stylelint": "^15.7.0",
"stylelint-config-prettier-scss": "^1.0.0",
Expand Down
6 changes: 3 additions & 3 deletions src/components/selectable/selectable_templates/selectable_template_sitewide.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
*/

import React from 'react';
import { fireEvent } from '@testing-library/react';
import { fireEvent, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { render, waitForEuiPopoverOpen } from '../../../test/rtl';
import { shouldRenderCustomStyles } from '../../../test/internal';
Expand Down Expand Up @@ -170,7 +170,7 @@ describe('EuiSelectableTemplateSitewide', () => {
).not.toBeInTheDocument();
});

test('toggles the selectable popover for keyboard users', () => {
test('toggles the selectable popover for keyboard users', async () => {
const { getByTestSubject } = render(
<EuiSelectableTemplateSitewide
options={options}
Expand All @@ -179,7 +179,7 @@ describe('EuiSelectableTemplateSitewide', () => {
);
// fireEvent doesn't seem to work: https://github.com/testing-library/user-event/issues/179#issuecomment-1125146667
getByTestSubject('mobilePopoverButton').focus();
userEvent.keyboard('{enter}');
await waitFor(() => userEvent.keyboard('{enter}'));
mgadewoll marked this conversation as resolved.
Show resolved Hide resolved
waitForEuiPopoverOpen();

expect(getByTestSubject('euiSelectableList')).toBeInTheDocument();
Expand Down
Loading
Loading