salix/front/core/components/tooltip/tooltip.spec.js

119 lines
3.8 KiB
JavaScript

import './tooltip';
describe('Component vnTooltip', () => {
let $element;
let controller;
let $parent;
let element;
let window;
beforeEach(ngModule('vnCore'));
beforeEach(inject(($compile, $rootScope, $document) => {
$element = $compile(`<vn-tooltip class="text">test</span></vn-tooltip>`)($rootScope);
$document.find('body').append($element);
controller = $element.controller('vnTooltip');
element = $element[0];
window = controller.window;
$parent = angular.element('<div/>');
$parent.css({
backgroundColor: 'red',
position: 'absolute',
width: '10px',
height: '10px',
top: '0',
left: '0'
});
$document.find('body').append($parent);
}));
afterEach(() => {
$element.remove();
$parent.remove();
});
describe('show()', () => {
it(`should check that tooltip is visible into the screen`, () => {
controller.show($parent[0]);
let rect = element.getBoundingClientRect();
let style = window.getComputedStyle(element);
expect(style.visibility).toEqual('visible');
expect(style.display).not.toEqual('none');
expect(0).toBeLessThanOrEqual(rect.top);
expect(0).toBeLessThanOrEqual(rect.left);
expect(window.innerHeight).toBeGreaterThan(rect.bottom);
expect(window.innerWidth).toBeGreaterThan(rect.right);
});
});
describe('hide()', () => {
it(`should check that tooltip is not visible`, () => {
controller.show($parent[0]);
controller.hide();
let style = window.getComputedStyle(element);
expect(style.display).toEqual('none');
});
});
describe('relocate()', () => {
it(`should reallocate tooltip on top-left`, () => {
controller.show($parent[0]);
let rect = element.getBoundingClientRect();
expect(controller.margin).toBeLessThan(rect.top);
expect(controller.margin).toEqual(rect.left);
});
it(`should reallocate tooltip on bottom-left`, () => {
$parent.css({
top: `${window.innerHeight}px`
});
controller.show($parent[0]);
let rect = element.getBoundingClientRect();
expect(window.innerHeight).toBeGreaterThan(rect.top);
expect(controller.margin).toEqual(rect.left);
});
it(`should reallocate tooltip on bottom-right`, () => {
$parent.css({
top: `${window.innerHeight}px`,
left: `${window.innerWidth}px`
});
controller.show($parent[0]);
let rect = element.getBoundingClientRect();
expect(window.innerWidth).toBeGreaterThan(rect.left);
expect(window.innerWidth - controller.margin).toEqual(rect.right);
});
it(`should reallocate tooltip on top-right`, () => {
$parent.css({
left: `${window.innerWidth}px`
});
controller.show($parent[0]);
let rect = element.getBoundingClientRect();
expect(controller.margin).toBeLessThan(rect.top);
expect(window.innerWidth - controller.margin).toEqual(rect.right);
});
it(`should reallocate tooltip on center`, () => {
$parent.css({
top: `${window.window.innerHeight / 2}px`,
left: `${window.window.innerWidth / 2}px`
});
controller.show($parent[0]);
let rect = element.getBoundingClientRect();
expect(window.innerHeight / 2).toBeLessThan(rect.top);
expect(window.innerWidth / 2).toBeGreaterThan(rect.left);
});
});
});