diff --git a/components/lib/badge/Badge.spec.js b/components/lib/badge/Badge.spec.js
index 2986b9991c..217c5bce6b 100644
--- a/components/lib/badge/Badge.spec.js
+++ b/components/lib/badge/Badge.spec.js
@@ -2,82 +2,19 @@ import '@testing-library/jest-dom';
import { render } from '@testing-library/react';
import { Badge } from './Badge';
-describe('Badge', () => {
- test('when value is not property it returns with dot class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge-dot').length).toBe(1);
- });
-
- test('when value is property it returns with class', () => {
- // Arrange
- const { container } = render();
- const badge = container.getElementsByClassName('p-badge p-component')[0].textContent;
-
- // Act + Assert
- expect(badge).toBe('22');
- });
-
- test('when size as property it returns with class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge p-component p-badge-lg').length).toBe(1);
- });
- test('when size as property it returns with class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge p-component p-badge-xl').length).toBe(1);
- });
-
- test('when value of size property is invalid it returns with default class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
+const snapshot = (props, name) => expect(render().container).toMatchSnapshot(name);
- expect(container.getElementsByClassName('p-badge p-component').length).toBe(1);
- });
-
- test('when severity as property it returns with class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge p-component p-badge-success').length).toBe(1);
- });
- test('when severity as property it returns with class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge p-component p-badge-info').length).toBe(1);
- });
- test('when severity as property it returns with class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge p-component p-badge-warning').length).toBe(1);
- });
- test('when severity as property it returns with class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge p-component p-badge-danger').length).toBe(1);
- });
-
- test('when value of severity property is invalid it returns with class that has property additional class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- expect(container.getElementsByClassName('p-badge p-component p-badge-invalid').length).toBe(1);
+describe('Badge', () => {
+ test('check snapshots', () => {
+ snapshot({}, 'default');
+ snapshot({ value: 22 }, 'value');
+ snapshot({ size: 'large' }, 'size large');
+ snapshot({ size: 'xlarge' }, 'size xlarge');
+ snapshot({ size: 'invalid' }, 'size invalid');
+ snapshot({ severity: 'success' }, 'severity success');
+ snapshot({ severity: 'info' }, 'severity info');
+ snapshot({ severity: 'warning' }, 'severity warning');
+ snapshot({ severity: 'danger' }, 'severity danger');
+ snapshot({ severity: 'invalid' }, 'severity invalid');
});
});
diff --git a/components/lib/badge/__snapshots__/Badge.spec.js.snap b/components/lib/badge/__snapshots__/Badge.spec.js.snap
new file mode 100644
index 0000000000..5cc7fffc06
--- /dev/null
+++ b/components/lib/badge/__snapshots__/Badge.spec.js.snap
@@ -0,0 +1,83 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Badge check snapshots: default 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: severity danger 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: severity info 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: severity invalid 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: severity success 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: severity warning 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: size invalid 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: size large 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: size xlarge 1`] = `
+
+
+
+`;
+
+exports[`Badge check snapshots: value 1`] = `
+
+
+ 22
+
+
+`;
diff --git a/components/lib/chip/Chip.spec.js b/components/lib/chip/Chip.spec.js
index f26e00073f..288f15999a 100644
--- a/components/lib/chip/Chip.spec.js
+++ b/components/lib/chip/Chip.spec.js
@@ -1,8 +1,17 @@
import '@testing-library/jest-dom';
-import { fireEvent, render, within } from '@testing-library/react';
+import { fireEvent, render } from '@testing-library/react';
import { Chip } from './Chip';
+const snapshot = (props, name) => expect(render().container).toMatchSnapshot(name);
+
describe('Chip', () => {
+ test('check snapshots', () => {
+ snapshot({}, 'default');
+ snapshot({ image: 'http://google.com/my.png' }, 'image');
+ snapshot({ image: 'http://google.com/my.png', imageAlt: 'jest' }, 'image and alt');
+ snapshot({ icon: 'pi pi-check' }, 'icon');
+ snapshot({ label: 'jest' }, 'label');
+ });
test('when removable is true it returns with remove icon', () => {
// Arrange
const removeOn = jest.fn();
@@ -16,7 +25,6 @@ describe('Chip', () => {
expect(container.getElementsByClassName('p-chip-remove-icon pi pi-times-circle').length).toBe(0);
expect(removeOn).toHaveBeenCalledTimes(1);
});
-
test('when removable is true the chip is removed when ENTER is pressed', () => {
// Arrange
const removeOn = jest.fn();
@@ -30,48 +38,4 @@ describe('Chip', () => {
expect(container.getElementsByClassName('p-chip-remove-icon pi pi-times-circle').length).toBe(0);
expect(removeOn).toHaveBeenCalledTimes(1);
});
-
- test('when image is property it returns with image class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- const wrapper = container.getElementsByClassName('p-chip p-component p-chip-image');
- const chipImage = within(wrapper[0]).getByRole('img');
-
- expect(chipImage.getAttribute('alt')).toBe('chip');
- });
-
- test('when imageAlt property is set the alt is set', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- const wrapper = container.getElementsByClassName('p-chip p-component p-chip-image');
- const chipImage = within(wrapper[0]).getByRole('img');
-
- expect(chipImage.getAttribute('alt')).toBe('jest');
- });
-
- test('when icon is property it returns with icon class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- const icon = container.getElementsByClassName('p-chip-icon');
- const iconClass = icon[0].getAttribute('class');
-
- expect(iconClass).toBe('p-chip-icon pi pi-check');
- });
-
- test('when label is property it returns with label class', () => {
- // Arrange
- const { container } = render();
-
- // Act + Assert
- const label = container.getElementsByClassName('p-chip-text');
- const spanTextContent = label[0].textContent;
-
- expect(spanTextContent).toBe('test');
- });
});
diff --git a/components/lib/chip/__snapshots__/Chip.spec.js.snap b/components/lib/chip/__snapshots__/Chip.spec.js.snap
new file mode 100644
index 0000000000..870ee3ccfc
--- /dev/null
+++ b/components/lib/chip/__snapshots__/Chip.spec.js.snap
@@ -0,0 +1,61 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Chip check snapshots: default 1`] = `
+
+`;
+
+exports[`Chip check snapshots: icon 1`] = `
+
+`;
+
+exports[`Chip check snapshots: image 1`] = `
+
+
+
+
+
+
+
+
+