@zohodesk/dot
Version:
In this Library, we Provide Some Basic Components to Build Your Application
83 lines • 4.03 kB
JavaScript
import React from 'react';
import { render } from '@testing-library/react';
import Separator from "../Separator";
describe('Separator', () => {
const PALETTE = ['default', 'primary', 'secondary'];
const TYPE = ['dot', 'slash', 'arrow', 'comma', 'none'];
const ALIGN_DIRECTION = ['row', 'column', 'row-reverse', 'column-reverse'];
const WRAP = ['wrap', 'wrap-reverse', 'nowrap'];
test('rendering the default props', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, null, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test.each(PALETTE)('rendering the palette of - %s', palette => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, {
palette: palette
}, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test.each(TYPE)('rendering the type of - %s', type => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, {
type: type
}, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test('rendering with customSeparatorType props', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, {
customSeparatorType: "#"
}, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test.each(ALIGN_DIRECTION)('rendering the aligndirection of - %s', aligndirection => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, {
aligndirection: aligndirection
}, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test.each(WRAP)('rendering the wrap of - %s', wrap => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, {
wrap: wrap
}, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test('rendering the customClass props', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, {
customClass: {
customWrapper: 'customWrapperStyle',
customSeparator: 'customSeparatorStyle',
customChildren: 'customChildrenStyle'
}
}, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test('rendering the shrink props with true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, {
shrink: true
}, /*#__PURE__*/React.createElement("div", null, "Desk"), /*#__PURE__*/React.createElement("div", null, "CRM"), /*#__PURE__*/React.createElement("div", null, "Creator")));
expect(asFragment()).toMatchSnapshot();
});
test('rendering the all types of children data', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Separator, null, ['Desk', undefined, /*#__PURE__*/React.createElement("div", {
key: "1"
}, "CRM"), null, '']));
expect(asFragment()).toMatchSnapshot();
});
});