@zohodesk/dot
Version:
In this Library, we Provide Some Basic Components to Build Your Application
369 lines • 12.3 kB
JavaScript
import React from 'react';
import { render, cleanup } from '@testing-library/react';
import '@testing-library/jest-dom';
import { setGlobalId } from '@zohodesk/components/es/Provider/IdProvider';
import ActionButton from "../ActionButton";
beforeEach(() => {
setGlobalId(0);
});
afterEach(() => {
cleanup();
});
describe('ActionButton', () => {
const palettes = ['primaryFilled', 'primary'];
const sizes = ['small', 'medium', 'large'];
const iconProps = [{
iconName: 'ZD-replyall',
iconSize: '9'
}];
test('renders with default props', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, null));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isLoading set to true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isLoading: true,
text: "Loading..."
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with text', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
text: "Not Loading - Main Text"
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with subText', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isLoading: false,
subText: "Not Loading - Sub Text"
}));
expect(asFragment()).toMatchSnapshot();
});
test.each(iconProps)('renders with iconName: %s and iconSize: %s', _ref => {
let {
iconName,
iconSize
} = _ref;
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isLoading: false,
iconName: iconName,
iconSize: iconSize,
text: "Not Loading - Main Text",
subText: "Not Loading - Sub Text"
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with onClick prop and validates class', () => {
const mockOnClick = jest.fn();
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isLoading: false,
iconName: "ZD-replyall",
iconSize: "9",
text: "Not Loading - Main Text onClick",
subText: "Not Loading - Sub Text onClick",
onClick: mockOnClick
}));
expect(asFragment()).toMatchSnapshot();
});
test.each(sizes)('renders with size - %s', size => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
size: size
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dataId prop', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
dataId: "testDataId"
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders dataId prop with isLoading set to true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isLoading: true,
dataId: "testDataId"
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with disabled state true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isDisabled: true
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dropBoxClassProps - case 1', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isPopupOpen: true,
dropBoxClass: "custom-dropbox-class",
isBoxPaddingNeed: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dropBoxClassProps - case 2', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isPopupOpen: false,
dropBoxClass: "",
isBoxPaddingNeed: false
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dropBoxClassProps - case 3', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isPopupOpen: true,
dropBoxClass: "custom-dropbox-class",
isBoxPaddingNeed: false
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dropBoxClassProps - case 4', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isPopupOpen: true,
dropBoxClass: "",
isBoxPaddingNeed: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dataSelectorId and children props', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
dataSelectorId: "testSelectorId"
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with custom className', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
className: "custom-class"
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dataTitle', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
dataTitle: "Test Data Title"
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with innerClassName set to custom-class', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
innerClassName: "custom-class"
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with innerClassName set to empty string', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
innerClassName: ""
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with innerClassName set to undefined', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
innerClassName: undefined
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with arrowBoxSize small and isPopupOpen true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
arrowBoxSize: "small",
isPopupOpen: true
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with arrowBoxSize medium and isPopupOpen false', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
arrowBoxSize: "medium",
isPopupOpen: false
}));
expect(asFragment()).toMatchSnapshot();
});
test.each(palettes)('renders with palette - %s', palette => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
palette: palette
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with children prop', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, null, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with dataId, children, and popup open', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
dataId: "testDataId",
isPopupOpen: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isArrow true and popup open', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isArrow: true,
isPopupOpen: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isArrow false and popup open', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isArrow: false,
isPopupOpen: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with children and tooltip enabled', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
removeChildrenTooltip: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with children and tooltip disabled', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
removeChildrenTooltip: null
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with arrowBoxSize small and children', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
arrowBoxSize: "small"
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with arrowBoxSize medium and children', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
arrowBoxSize: "medium"
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test.each(palettes)('renders with palette - %s and loading', palette => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
palette: palette,
isLoading: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test.each(palettes)('renders with palette - %s and children', palette => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
palette: palette
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isPopupOpen true and children', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isPopupOpen: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isPopupOpen false and children', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isPopupOpen: false
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with removeClose set to a function', () => {
const mockRemoveClose = jest.fn();
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
removeClose: mockRemoveClose
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isAbsolutePositioningNeeded set to true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isAbsolutePositioningNeeded: true
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isRestrictScroll set to true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isRestrictScroll: true
}));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isAbsolutePositioningNeeded set to true and isPopupOpen true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isAbsolutePositioningNeeded: true,
isPopupOpen: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
test('renders with isRestrictScroll set to true and isPopupOpen true', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(ActionButton, {
isRestrictScroll: true,
isPopupOpen: true
}, /*#__PURE__*/React.createElement("div", null, "Child Content")));
expect(asFragment()).toMatchSnapshot();
});
});