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 Playground and Stackblitz #18250

Merged
merged 10 commits into from
Jan 2, 2025
Merged

Storybook Playground and Stackblitz #18250

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
3f33d6a
feat: converted all stories from Playground to Default
guidari Dec 4, 2024
455fc30
feat: added @stackblitz/sdk
guidari Dec 11, 2024
fe58a53
fix: removed unsed stuff
guidari Dec 11, 2024
ebdc0cb
feat: added new replace and new prop to codePreview
guidari Dec 11, 2024
5145b00
feat: added final stack/sdk code
guidari Dec 12, 2024
dd5f17b
Merge branch 'main' into 16816-storybook
guidari Dec 12, 2024
9cfde66
fix: fixed Tooltip storybook
guidari Dec 12, 2024
abeff3f
fix: fixed stackblitz/sdk package
guidari Dec 12, 2024
e8b5f23
test: fixed avt tests
guidari Dec 13, 2024
60b4f31
fix: changed last playground stories
guidari Dec 13, 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
Binary file added .yarn/cache/@stackblitz-sdk-npm-1.11.0-a3cab8fa5d-351647b818.zip
View file
Open in desktop
Binary file not shown.
2 changes: 1 addition & 1 deletion e2e/components/Accordion/Accordion-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ test.describe('@avt Accordion', () => {
test('@avt-advanced-states disabled', async ({ page }) => {
await visitStory(page, {
component: 'Accordion',
id: 'components-accordion--playground',
id: 'components-accordion--default',
globals: {
theme: 'white',
},
Expand Down
8 changes: 0 additions & 8 deletions e2e/components/ContainedList/ContainedList-test.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,14 +78,6 @@ test.describe('ContainedList', () => {
});
});

test('playground @vrt', async ({ page }) => {
await snapshotStory(page, {
component: 'ContainedList',
id: 'components-containedlist--playground',
theme,
});
});

test('with-expandable-search @vrt', async ({ page }) => {
await snapshotStory(page, {
component: 'ContainedList',
Expand Down
15 changes: 0 additions & 15 deletions e2e/components/DataTable/DataTable-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -276,21 +276,6 @@ test.describe('@avt DataTable', () => {
'components-datatable-selection--default'
);
});
test.skip('@avt-advanced-states with-radio-expansion', async ({ page }) => {
await visitStory(page, {
component: 'DataTable',
id: 'components-datatable-dynamic--playground',
globals: {
theme: 'white',
},
args: {
radio: true,
},
});
await expect(page).toHaveNoACViolations(
'components-datatable-with-radio-expansion'
);
});
test('@avt-advanced-states with-selection-and-sorting', async ({
page,
}) => {
Expand Down
4 changes: 2 additions & 2 deletions e2e/components/DatePicker/DatePicker-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ test.describe('@avt DatePicker', () => {
test('@avt-advanced-states disabled', async ({ page }) => {
await visitStory(page, {
component: 'DatePicker',
id: 'components-datepicker--playground',
id: 'components-datepicker--default',
globals: {
theme: 'white',
},
Expand Down Expand Up @@ -65,7 +65,7 @@ test.describe('@avt DatePicker', () => {
test.skip('@avt-advanced-states open', async ({ page }) => {
await visitStory(page, {
component: 'DatePicker',
id: 'components-datepicker--playground',
id: 'components-datepicker--default',
globals: {
theme: 'white',
},
Expand Down
2 changes: 1 addition & 1 deletion e2e/components/FileUploader/FileUploader-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ test.describe('@avt FileUploader', () => {
test('@avt-advanced-states with upload', async ({ page }) => {
await visitStory(page, {
component: 'FileUploader',
id: 'components-fileuploader--playground',
id: 'components-fileuploader--default',
globals: {
theme: 'white',
},
Expand Down
4 changes: 2 additions & 2 deletions e2e/components/Menu/Menu-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ test.describe('@avt Menu', () => {
test('@avt-default-state', async ({ page }) => {
await visitStory(page, {
component: 'Menu',
id: 'components-menu--playground',
id: 'components-menu--default',
globals: {
theme: 'white',
},
Expand All @@ -25,7 +25,7 @@ test.describe('@avt Menu', () => {
test.fixme('@avt-keyboard-nav Menu', async ({ page }) => {
await visitStory(page, {
component: 'Menu',
id: 'components-menu--playground',
id: 'components-menu--default',
globals: {
theme: 'white',
},
Expand Down
2 changes: 1 addition & 1 deletion e2e/components/Menu/Menu-test.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ test.describe('Menu', () => {
test('menu @vrt', async ({ page }) => {
await snapshotStory(page, {
component: 'Menu',
id: 'components-menu--playground',
id: 'components-menu--default',
theme,
});
});
Expand Down
20 changes: 10 additions & 10 deletions e2e/components/Notifications/Notifications-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ test.describe('@avt Notifications', () => {
test('@avt-advanced-states actionable info', async ({ page }) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -84,7 +84,7 @@ test.describe('@avt Notifications', () => {
test('@avt-advanced-states actionable info-square', async ({ page }) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -100,7 +100,7 @@ test.describe('@avt Notifications', () => {
test('@avt-advanced-states actionable success', async ({ page }) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -114,7 +114,7 @@ test.describe('@avt Notifications', () => {
test('@avt-advanced-states actionable warning', async ({ page }) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -128,7 +128,7 @@ test.describe('@avt Notifications', () => {
test('@avt-advanced-states actionable warning-alt', async ({ page }) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -146,7 +146,7 @@ test.describe('@avt Notifications', () => {
}) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -165,7 +165,7 @@ test.describe('@avt Notifications', () => {
}) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -184,7 +184,7 @@ test.describe('@avt Notifications', () => {
}) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -203,7 +203,7 @@ test.describe('@avt Notifications', () => {
}) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand All @@ -222,7 +222,7 @@ test.describe('@avt Notifications', () => {
}) => {
await visitStory(page, {
component: 'Notifications',
id: 'components-notifications-actionable--playground',
id: 'components-notifications-actionable--default',
globals: {
theme: 'white',
args: {
Expand Down
2 changes: 1 addition & 1 deletion e2e/components/Popover/Popover-test.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ test.describe('Popover', () => {
test('Popover @vrt', async ({ page }) => {
await snapshotStory(page, {
component: 'Popover',
id: 'components-popover--playground',
id: 'components-popover--default',
theme,
});
});
Expand Down
8 changes: 4 additions & 4 deletions e2e/components/RadioButton/RadioButton-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ test.describe('@avt RadioButton', () => {
test('@avt-advanced-states - invalid state', async ({ page }) => {
await visitStory(page, {
component: 'RadioButton',
id: 'components-radiobutton--playground',
id: 'components-radiobutton--default',
globals: {
theme: 'white',
},
Expand All @@ -79,7 +79,7 @@ test.describe('@avt RadioButton', () => {
test('@avt-advanced-states - warn state', async ({ page }) => {
await visitStory(page, {
component: 'RadioButton',
id: 'components-radiobutton--playground',
id: 'components-radiobutton--default',
globals: {
theme: 'white',
},
Expand All @@ -96,7 +96,7 @@ test.describe('@avt RadioButton', () => {
test('@avt-advanced-states - disabled state', async ({ page }) => {
await visitStory(page, {
component: 'RadioButton',
id: 'components-radiobutton--playground',
id: 'components-radiobutton--default',
globals: {
theme: 'white',
},
Expand All @@ -112,7 +112,7 @@ test.describe('@avt RadioButton', () => {
test('@avt-advanced-states - read only state', async ({ page }) => {
await visitStory(page, {
component: 'RadioButton',
id: 'components-radiobutton--playground',
id: 'components-radiobutton--default',
globals: {
theme: 'white',
},
Expand Down
6 changes: 3 additions & 3 deletions e2e/components/TextArea/TextArea-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ test.describe('@avt TextArea', () => {
test('@avt-advanced-states invalid', async ({ page }) => {
await visitStory(page, {
component: 'TextArea',
id: 'components-textarea--playground',
id: 'components-textarea--default',
globals: {
theme: 'white',
},
Expand All @@ -39,7 +39,7 @@ test.describe('@avt TextArea', () => {
test('@avt-advanced-states warn', async ({ page }) => {
await visitStory(page, {
component: 'TextArea',
id: 'components-textarea--playground',
id: 'components-textarea--default',
globals: {
theme: 'white',
},
Expand All @@ -64,7 +64,7 @@ test.describe('@avt TextArea', () => {
test('@avt-keyboard-nav TextArea keyboard counter', async ({ page }) => {
await visitStory(page, {
component: 'TextArea',
id: 'components-textarea--playground',
id: 'components-textarea--default',
globals: {
theme: 'white',
},
Expand Down
2 changes: 1 addition & 1 deletion e2e/components/TextInput/TextInput-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ test.describe('@avt TextInput', () => {
test('@avt-advanced-states - disabled', async ({ page }) => {
await visitStory(page, {
component: 'TextInput',
id: 'components-textinput--playground',
id: 'components-textinput--default',
globals: {
theme: 'white',
},
Expand Down
10 changes: 0 additions & 10 deletions e2e/components/Toggletip/Toggletip-test.avt.e2e.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,6 @@ test.describe('@avt Toggletip', () => {
},
});

// Checking if the defaultOpen is working
await expect(page.locator('.cds--popover--open')).toBeVisible();

// Checking first Toggletip interaction
await page.keyboard.press('Tab');
await expect(page.getByLabel('Show information').first()).toBeFocused();
Expand All @@ -46,12 +43,5 @@ test.describe('@avt Toggletip', () => {
await expect(page.getByRole('button', { name: 'Button' })).toBeFocused();
await page.keyboard.press('Tab');
await expect(page.locator('.cds--popover--open')).toBeHidden();

// Checking second Toggletip interaction and close on Escape key
await expect(page.getByLabel('Show information').last()).toBeFocused();
await page.keyboard.press('Enter');
await expect(page.locator('.cds--popover--open')).toBeVisible();
await page.keyboard.press('Escape');
await expect(page.locator('.cds--popover--open')).toBeHidden();
});
});
1 change: 1 addition & 0 deletions packages/react/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@
"@rollup/plugin-commonjs": "^28.0.0",
"@rollup/plugin-node-resolve": "^15.0.0",
"@rollup/plugin-typescript": "^11.0.0",
"@stackblitz/sdk": "^1.11.0",
"@storybook/addon-a11y": "^8.4.5",
"@storybook/addon-actions": "^8.4.5",
"@storybook/addon-docs": "^8.4.5",
Expand Down
Loading
Loading