wix-style-react
Version:
wix-style-react
120 lines • 4.21 kB
JavaScript
import { createModifiers } from './modifiers';
describe('createModifiers', () => {
const defaultProps = {
width: undefined,
moveBy: undefined,
minWidth: undefined,
dynamicWidth: undefined,
appendTo: undefined,
shouldAnimate: false,
flip: true,
fixed: false,
placement: 'bottom',
isTestEnv: false,
};
it('should match default modifiers', async () => {
const modifiers = createModifiers({
...defaultProps,
});
expect(modifiers).toEqual({
offset: {
offset: '0px, 0px',
},
computeStyle: {
gpuAcceleration: true,
},
flip: {
enabled: true,
},
preventOverflow: {
enabled: true,
},
hide: {
enabled: true,
},
});
});
it('should calculate the offset properly using moveBy for the top placement', async () => {
const modifiers = createModifiers({
...defaultProps,
moveBy: { x: 5, y: 10 },
placement: 'top',
});
expect(modifiers?.offset?.offset).toEqual('5px, 10px');
});
it('should calculate the offset properly using moveBy for the right placement', async () => {
const modifiers = createModifiers({
...defaultProps,
moveBy: { x: 5, y: 10 },
placement: 'right',
});
expect(modifiers?.offset?.offset).toEqual('10px, 5px');
});
it('should disable gpuAcceleration when animation is enabled', async () => {
const modifiers = createModifiers({
...defaultProps,
shouldAnimate: true,
});
expect(modifiers?.computeStyle?.gpuAcceleration).toEqual(false);
});
it('should disable the flip modifier if moveBy was provided', async () => {
const modifiers = createModifiers({
...defaultProps,
moveBy: { x: 5, y: 10 },
flip: undefined,
});
expect(modifiers?.flip?.enabled).toEqual(false);
});
it('should enabled the flip modifier is set explicitly regardless of moveBy', async () => {
const modifiers = createModifiers({
...defaultProps,
moveBy: { x: 5, y: 10 },
flip: true,
});
expect(modifiers?.flip?.enabled).toEqual(true);
});
it('should disable the flip modifier when set explicitly', async () => {
const modifiers = createModifiers({
...defaultProps,
flip: false,
});
expect(modifiers?.flip?.enabled).toEqual(false);
});
it('should disable `preventOverflow` and `hide` when fixed set to `true`', async () => {
const modifiers = createModifiers({
...defaultProps,
fixed: true,
});
expect(modifiers?.preventOverflow?.enabled).toEqual(false);
expect(modifiers?.hide?.enabled).toEqual(false);
});
it('should disable computeStyle when isTestEnv is set to `true`', async () => {
const modifiers = createModifiers({
...defaultProps,
isTestEnv: true,
});
expect(modifiers?.computeStyle?.enabled).toEqual(false);
});
it('should set boundariesElement when appendTo is provided', async () => {
const modifiers = createModifiers({
...defaultProps,
appendTo: 'viewport',
});
expect(modifiers?.preventOverflow?.boundariesElement).toEqual('viewport');
});
it('should enable setPopperWidth [when] given minWidth ', async () => {
const modifiers = createModifiers({
...defaultProps,
minWidth: '500px',
});
expect(modifiers?.setPopperWidth?.enabled).toEqual(true);
});
it('should enable setPopperWidth [when] given dynamicWidth ', async () => {
const modifiers = createModifiers({
...defaultProps,
dynamicWidth: true,
});
expect(modifiers?.setPopperWidth?.enabled).toEqual(true);
});
});
//# sourceMappingURL=modifiers.spec.js.map