2018-10-15 14:42:47 +05:30
|
|
|
import $ from 'jquery';
|
2018-12-13 13:39:08 +05:30
|
|
|
import { togglePopover, mouseleave, mouseenter } from '~/shared/popover';
|
2018-10-15 14:42:47 +05:30
|
|
|
|
|
|
|
describe('popover', () => {
|
|
|
|
describe('togglePopover', () => {
|
|
|
|
describe('togglePopover(true)', () => {
|
|
|
|
it('returns true when popover is shown', () => {
|
|
|
|
const context = {
|
|
|
|
hasClass: () => false,
|
|
|
|
popover: () => {},
|
|
|
|
toggleClass: () => {},
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(togglePopover.call(context, true)).toEqual(true);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns false when popover is already shown', () => {
|
|
|
|
const context = {
|
|
|
|
hasClass: () => true,
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(togglePopover.call(context, true)).toEqual(false);
|
|
|
|
});
|
|
|
|
|
2018-12-13 13:39:08 +05:30
|
|
|
it('shows popover', done => {
|
2018-10-15 14:42:47 +05:30
|
|
|
const context = {
|
|
|
|
hasClass: () => false,
|
|
|
|
popover: () => {},
|
|
|
|
toggleClass: () => {},
|
|
|
|
};
|
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
jest.spyOn(context, 'popover').mockImplementation(method => {
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(method).toEqual('show');
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
|
|
|
|
togglePopover.call(context, true);
|
|
|
|
});
|
|
|
|
|
2018-12-13 13:39:08 +05:30
|
|
|
it('adds disable-animation and js-popover-show class', done => {
|
2018-10-15 14:42:47 +05:30
|
|
|
const context = {
|
|
|
|
hasClass: () => false,
|
|
|
|
popover: () => {},
|
|
|
|
toggleClass: () => {},
|
|
|
|
};
|
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
jest.spyOn(context, 'toggleClass').mockImplementation((classNames, show) => {
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(classNames).toEqual('disable-animation js-popover-show');
|
|
|
|
expect(show).toEqual(true);
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
|
|
|
|
togglePopover.call(context, true);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('togglePopover(false)', () => {
|
|
|
|
it('returns true when popover is hidden', () => {
|
|
|
|
const context = {
|
|
|
|
hasClass: () => true,
|
|
|
|
popover: () => {},
|
|
|
|
toggleClass: () => {},
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(togglePopover.call(context, false)).toEqual(true);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns false when popover is already hidden', () => {
|
|
|
|
const context = {
|
|
|
|
hasClass: () => false,
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(togglePopover.call(context, false)).toEqual(false);
|
|
|
|
});
|
|
|
|
|
2018-12-13 13:39:08 +05:30
|
|
|
it('hides popover', done => {
|
2018-10-15 14:42:47 +05:30
|
|
|
const context = {
|
|
|
|
hasClass: () => true,
|
|
|
|
popover: () => {},
|
|
|
|
toggleClass: () => {},
|
|
|
|
};
|
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
jest.spyOn(context, 'popover').mockImplementation(method => {
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(method).toEqual('hide');
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
|
|
|
|
togglePopover.call(context, false);
|
|
|
|
});
|
|
|
|
|
2018-12-13 13:39:08 +05:30
|
|
|
it('removes disable-animation and js-popover-show class', done => {
|
2018-10-15 14:42:47 +05:30
|
|
|
const context = {
|
|
|
|
hasClass: () => true,
|
|
|
|
popover: () => {},
|
|
|
|
toggleClass: () => {},
|
|
|
|
};
|
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
jest.spyOn(context, 'toggleClass').mockImplementation((classNames, show) => {
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(classNames).toEqual('disable-animation js-popover-show');
|
|
|
|
expect(show).toEqual(false);
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
|
|
|
|
togglePopover.call(context, false);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('mouseleave', () => {
|
|
|
|
it('calls hide popover if .popover:hover is false', () => {
|
|
|
|
const fakeJquery = {
|
|
|
|
length: 0,
|
|
|
|
};
|
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
jest
|
|
|
|
.spyOn($.fn, 'init')
|
|
|
|
.mockImplementation(selector => (selector === '.popover:hover' ? fakeJquery : $.fn));
|
|
|
|
jest.spyOn(togglePopover, 'call').mockImplementation(() => {});
|
2018-10-15 14:42:47 +05:30
|
|
|
mouseleave();
|
2018-12-13 13:39:08 +05:30
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
expect(togglePopover.call).toHaveBeenCalledWith(expect.any(Object), false);
|
2018-10-15 14:42:47 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('does not call hide popover if .popover:hover is true', () => {
|
|
|
|
const fakeJquery = {
|
|
|
|
length: 1,
|
|
|
|
};
|
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
jest
|
|
|
|
.spyOn($.fn, 'init')
|
|
|
|
.mockImplementation(selector => (selector === '.popover:hover' ? fakeJquery : $.fn));
|
|
|
|
jest.spyOn(togglePopover, 'call').mockImplementation(() => {});
|
2018-10-15 14:42:47 +05:30
|
|
|
mouseleave();
|
2018-12-13 13:39:08 +05:30
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(togglePopover.call).not.toHaveBeenCalledWith(false);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('mouseenter', () => {
|
|
|
|
const context = {};
|
|
|
|
|
|
|
|
it('shows popover', () => {
|
2020-03-09 13:42:32 +05:30
|
|
|
jest.spyOn(togglePopover, 'call').mockReturnValue(false);
|
2018-10-15 14:42:47 +05:30
|
|
|
mouseenter.call(context);
|
2018-12-13 13:39:08 +05:30
|
|
|
|
2020-03-09 13:42:32 +05:30
|
|
|
expect(togglePopover.call).toHaveBeenCalledWith(expect.any(Object), true);
|
2018-10-15 14:42:47 +05:30
|
|
|
});
|
|
|
|
|
2018-12-13 13:39:08 +05:30
|
|
|
it('registers mouseleave event if popover is showed', done => {
|
2020-03-09 13:42:32 +05:30
|
|
|
jest.spyOn(togglePopover, 'call').mockReturnValue(true);
|
|
|
|
jest.spyOn($.fn, 'on').mockImplementation(eventName => {
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(eventName).toEqual('mouseleave');
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
mouseenter.call(context);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('does not register mouseleave event if popover is not showed', () => {
|
2020-03-09 13:42:32 +05:30
|
|
|
jest.spyOn(togglePopover, 'call').mockReturnValue(false);
|
|
|
|
const spy = jest.spyOn($.fn, 'on').mockImplementation(() => {});
|
2018-10-15 14:42:47 +05:30
|
|
|
mouseenter.call(context);
|
2018-12-13 13:39:08 +05:30
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(spy).not.toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|