Skip to content

Commit 21bb76d

Browse files
brianCollinsUIbrianCollinsUI
authored
chore/UIDS-541 Add percy tests (#452)
Added remaining tests in Cypress
1 parent 18b6dcb commit 21bb76d

27 files changed

+703
-24
lines changed

‎.percy.yml‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
version: 2
2+
snapshot:
3+
widths:
4+
- 1280

‎cypress.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
2-
"baseUrl": "http://localhost:9009/",
2+
"baseUrl": "http://localhost:9009/?path=/story/",
33
"experimentalStudio": true
44
}

‎cypress/integration/alert_spec.js‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
const alerts = [
2+
{
3+
name: 'Success',
4+
path: 'design-system-alert--success',
5+
class: '.Alert__title',
6+
},
7+
{
8+
name: 'Info',
9+
path: 'design-system-alert--info',
10+
class: '.Alert__title',
11+
},
12+
{
13+
name: 'Announcement',
14+
path: 'design-system-alert--announcement',
15+
class: '.Alert__title',
16+
},
17+
{
18+
name: 'Error',
19+
path: 'design-system-alert--error',
20+
class: '.Alert__title',
21+
},
22+
{
23+
name: 'Warning',
24+
path: 'design-system-alert--warning',
25+
class: '.Alert__title',
26+
},
27+
{
28+
name: 'With Dismiss',
29+
path: 'design-system-alert--with-dismiss',
30+
class: '.Alert__title',
31+
match: 'Default title',
32+
},
33+
{
34+
name: 'With Call To Action',
35+
path: 'design-system-alert--with-call-to-action',
36+
class: '.Alert__title',
37+
match: 'Success title',
38+
},
39+
];
40+
41+
describe('Alert', () => {
42+
alerts.forEach((test) => {
43+
it(test.name, () => {
44+
cy.visit(test.path);
45+
const match = test.match ? test.match : test.name;
46+
cy.get('#storybook-preview-iframe').iframe().find(test.class).should('contain', match);
47+
cy.percySnapshot(test.path);
48+
});
49+
});
50+
});

‎cypress/integration/avatar_spec.js‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
const avatars = [
2+
{
3+
name: 'Small',
4+
path: 'design-system-avatar--small',
5+
class: '.Avatar__circle__initials',
6+
match: 'RR',
7+
},
8+
{
9+
name: 'Large',
10+
path: 'design-system-avatar--large',
11+
class: '.Avatar__circle__initials',
12+
match: 'RR',
13+
},
14+
{
15+
name: 'With Alert',
16+
path: 'design-system-avatar--with-alert',
17+
class: '.Avatar__circle__initials',
18+
match: 'RR',
19+
},
20+
];
21+
22+
describe('Avatar', () => {
23+
avatars.forEach((test) => {
24+
it(test.name, () => {
25+
cy.visit(test.path);
26+
cy.get('#storybook-preview-iframe').iframe().find(test.class).should('contain', test.match);
27+
cy.wait(1000);
28+
cy.percySnapshot(test.path);
29+
});
30+
});
31+
32+
it('With Image', () => {
33+
cy.visit('design-system-avatar--with-image');
34+
cy.get('#storybook-preview-iframe').iframe().find('.Avatar__circle')
35+
.find('img')
36+
.should('be.visible');
37+
cy.percySnapshot('design-system-alert--with-image');
38+
});
39+
});

‎cypress/integration/card_spec.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
describe('Card', () => {
2+
it('Default', () => {
3+
cy.visit('design-system-card--default');
4+
cy.get('#storybook-preview-iframe').iframe().find('.Card__title')
5+
.should('contain', 'Large card with title');
6+
cy.percySnapshot('design-system-card--default');
7+
});
8+
});

‎cypress/integration/checkbox_button_spec.js‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
describe('CheckboxButton', () => {
2+
it('Default', () => {
3+
cy.visit('design-system-checkboxbutton--default');
4+
cy.get('#storybook-preview-iframe').iframe().find('.checkbox').should('exist');
5+
cy.wait(1000);
6+
cy.percySnapshot('design-system-checkboxbutton--default');
7+
});
8+
9+
it('Indeterminate', () => {
10+
cy.visit('design-system-checkboxbutton--indeterminate');
11+
cy.get('#storybook-preview-iframe').iframe().find('#select-all').should('exist');
12+
cy.wait(1000);
13+
cy.percySnapshot('design-system-checkboxbutton--indeterminate');
14+
});
15+
16+
it('With Description', () => {
17+
cy.visit('design-system-checkboxbutton--with-description');
18+
cy.get('#storybook-preview-iframe').iframe().find('.FormControlLabel__label')
19+
.should('contain', 'Label 2');
20+
cy.wait(1000);
21+
cy.percySnapshot('design-system-checkboxbutton--with-description');
22+
});
23+
});

‎cypress/integration/copy_to_clipboard_button_spec.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
describe('Copy to Clipboard Button', () => {
2+
it('Default', () => {
3+
cy.visit('design-system-copy-to-clipboard-button--default');
4+
cy.get('#storybook-preview-iframe').iframe().find('.CopyToClipboardButton').should('exist');
5+
cy.percySnapshot('design-system-copy-to-clipboard-button--default');
6+
});
7+
8+
it('Secondary', () => {
9+
cy.visit('design-system-copy-to-clipboard-button--secondary');
10+
cy.get('#storybook-preview-iframe').iframe().find('.CopyToClipboardButton').should('exist');
11+
cy.percySnapshot('design-system-copy-to-clipboard-button--secondary');
12+
});
13+
});

‎cypress/integration/copy_to_clipboard_spec.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
describe('Copy to Clipboard', () => {
2+
it('Default', () => {
3+
cy.visit('design-system-copy-to-clipboard--default');
4+
cy.get('#storybook-preview-iframe').iframe().find('.CopyToClipboard').should('exist');
5+
cy.percySnapshot('design-system-copy-to-clipboard--default');
6+
});
7+
});

‎cypress/integration/form_elements/checkbox_button_group_spec.js‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
const checkboxButtonGroups = [
2+
{
3+
name: 'Default',
4+
path: 'design-system-form-elements-checkboxbuttongroup--default',
5+
class: '.InputLabel',
6+
},
7+
{
8+
name: 'Default Row',
9+
path: 'design-system-form-elements-checkboxbuttongroup--default-row',
10+
class: '.InputLabel',
11+
},
12+
{
13+
name: 'Bordered Row',
14+
path: 'design-system-form-elements-checkboxbuttongroup--bordered-row',
15+
class: '.InputLabel',
16+
},
17+
{
18+
name: 'Description',
19+
path: 'design-system-form-elements-checkboxbuttongroup--description',
20+
class: '.InputLabel',
21+
},
22+
{
23+
name: 'Description Row',
24+
path: 'design-system-form-elements-checkboxbuttongroup--description-row',
25+
class: '.InputLabel',
26+
},
27+
];
28+
29+
describe('Form Elements -> CheckboxButtonGroup', () => {
30+
checkboxButtonGroups.forEach((test) => {
31+
it(test.name, () => {
32+
cy.visit(test.path);
33+
cy.get('#storybook-preview-iframe').iframe().find(test.class).should('contain', 'Label');
34+
cy.wait(1000);
35+
cy.percySnapshot(test.path);
36+
});
37+
});
38+
});

‎cypress/integration/form_elements/form_control_label_spec.js‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
const formControlLabels = [
2+
{
3+
name: 'Checkbox',
4+
path: 'design-system-form-elements-form-control-label--checkbox',
5+
class: '.FormControlLabel',
6+
},
7+
{
8+
name: 'Default Row',
9+
path: 'design-system-form-elements-form-control-label--checkbox-with-children',
10+
class: '.FormControlLabel',
11+
},
12+
{
13+
name: 'Radio',
14+
path: 'design-system-form-elements-form-control-label--radio',
15+
class: '.FormControlLabel',
16+
},
17+
{
18+
name: 'Radio With Children',
19+
path: 'design-system-form-elements-form-control-label--radio-with-children',
20+
class: '.FormControlLabel',
21+
},
22+
];
23+
24+
describe('Form Elements -> Form Control Label', () => {
25+
formControlLabels.forEach((test) => {
26+
it(test.name, () => {
27+
cy.visit(test.path);
28+
cy.get('#storybook-preview-iframe').iframe().find(test.class).should('contain', 'Label');
29+
cy.wait(1000);
30+
cy.percySnapshot(test.path);
31+
});
32+
});
33+
});

0 commit comments

Comments
 (0)