vnTooltip test code improved
This commit is contained in:
parent
2e0d5f2bde
commit
74e234a099
|
@ -59,6 +59,7 @@ export default class Autocomplete extends Input {
|
|||
|
||||
set url(value) {
|
||||
this.dropDownAssign({url: value});
|
||||
this.refreshSelection();
|
||||
}
|
||||
|
||||
dropDownAssign(props) {
|
||||
|
@ -97,6 +98,15 @@ export default class Autocomplete extends Input {
|
|||
this.refreshDisplayed();
|
||||
}
|
||||
|
||||
get initialData() {
|
||||
return this._initialData;
|
||||
}
|
||||
|
||||
set initialData(value) {
|
||||
this._initialData = value;
|
||||
this.refreshSelection();
|
||||
}
|
||||
|
||||
selectionIsValid(selection) {
|
||||
return selection
|
||||
&& selection[this.valueField] == this._field
|
||||
|
|
|
@ -31,33 +31,31 @@ describe('Component vnAutocomplete', () => {
|
|||
});
|
||||
|
||||
describe('selection property', () => {
|
||||
beforeEach(() => {
|
||||
$ctrl.field = data.id;
|
||||
});
|
||||
|
||||
it(`should set selection finding an existing item in the initialData property`, () => {
|
||||
$ctrl.initialData = data;
|
||||
$ctrl.field = data.id;
|
||||
|
||||
expect($ctrl.selection).toEqual(data);
|
||||
});
|
||||
|
||||
it(`should set selection finding an existing item in the data property`, () => {
|
||||
$ctrl.data = [data];
|
||||
$ctrl.field = data.id;
|
||||
|
||||
expect($ctrl.selection).toEqual(data);
|
||||
});
|
||||
|
||||
it(`should perform a query if the item id isn't present in the data property`, inject($httpBackend => {
|
||||
$httpBackend.whenGET(/testUrl.*/).respond([data]);
|
||||
$ctrl.url = 'testUrl';
|
||||
|
||||
$httpBackend.whenGET(new RegExp(`testUrl.*`)).respond([data]);
|
||||
$ctrl.field = data.id;
|
||||
$httpBackend.flush();
|
||||
|
||||
expect($ctrl.selection).toEqual(data);
|
||||
}));
|
||||
|
||||
it(`should set selection to null when can't find an existing item in the data property`, () => {
|
||||
$ctrl.field = data.id;
|
||||
|
||||
expect($ctrl.selection).toEqual(null);
|
||||
});
|
||||
});
|
||||
|
|
|
@ -7,7 +7,7 @@ describe('Component vnPopover', () => {
|
|||
beforeEach(ngModule('vnCore'));
|
||||
|
||||
beforeEach(inject(($compile, $rootScope, $document) => {
|
||||
$element = $compile(`<vn-popover>Test</vn-popover>`)($rootScope);
|
||||
$element = $compile(`<vn-popover>test</vn-popover>`)($rootScope);
|
||||
$document.find('body').append($element);
|
||||
$ctrl = $element.controller('vnPopover');
|
||||
|
||||
|
@ -49,7 +49,7 @@ describe('Component vnPopover', () => {
|
|||
$ctrl.show($parent[0]);
|
||||
|
||||
let rect = $ctrl.popover.getBoundingClientRect();
|
||||
let style = window.getComputedStyle($ctrl.element);
|
||||
let style = $ctrl.window.getComputedStyle($ctrl.element);
|
||||
|
||||
expect(style.visibility).toEqual('visible');
|
||||
expect(style.display).not.toEqual('none');
|
||||
|
|
|
@ -1,55 +1,60 @@
|
|||
import './tooltip';
|
||||
import template from './tooltip.html';
|
||||
|
||||
describe('Component vnTooltip', () => {
|
||||
let $element;
|
||||
let $scope;
|
||||
let $httpBackend;
|
||||
let $timeout;
|
||||
let controller;
|
||||
let $tooltip;
|
||||
let $controller;
|
||||
let parent;
|
||||
let $ctrl;
|
||||
let $parent;
|
||||
let element;
|
||||
let window;
|
||||
|
||||
beforeEach(() => {
|
||||
angular.mock.module('client');
|
||||
});
|
||||
beforeEach(ngModule('vnCore'));
|
||||
|
||||
beforeEach(angular.mock.inject((_$componentController_, $rootScope, _$httpBackend_, _$timeout_, $compile, $document) => {
|
||||
$scope = $rootScope.$new();
|
||||
$timeout = _$timeout_;
|
||||
$element = angular.element(`<div>${template}</div>`);
|
||||
$tooltip = $compile(`<vn-tooltip class="text">test</span></vn-tooltip>`)($rootScope);
|
||||
$document.find('body').append($tooltip);
|
||||
$httpBackend = _$httpBackend_;
|
||||
$httpBackend.when('GET', /\/locale\/\w+\/[a-z]{2}\.json/).respond({});
|
||||
controller = _$componentController_('vnTooltip', {$element, $scope, $timeout, $transclude: null});
|
||||
$controller = $tooltip[0].$ctrl;
|
||||
parent = angular.element('<div/>')[0];
|
||||
beforeEach(inject(($compile, $rootScope, $document) => {
|
||||
$element = $compile(`<vn-tooltip class="text">test</span></vn-tooltip>`)($rootScope);
|
||||
$document.find('body').append($element);
|
||||
$ctrl = $element.controller('vnTooltip');
|
||||
element = $element[0];
|
||||
window = $ctrl.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);
|
||||
$ctrl.show($parent[0]);
|
||||
|
||||
let clientRect = $controller.element.getBoundingClientRect();
|
||||
let style = window.getComputedStyle($controller.element);
|
||||
let rect = element.getBoundingClientRect();
|
||||
let style = window.getComputedStyle(element);
|
||||
|
||||
expect(style.visibility).toEqual('visible');
|
||||
expect(style.display).not.toEqual('none');
|
||||
|
||||
expect(0).toBeLessThanOrEqual(clientRect.top);
|
||||
expect(0).toBeLessThanOrEqual(clientRect.left);
|
||||
expect($controller.window.innerHeight).toBeGreaterThan(clientRect.bottom);
|
||||
expect($controller.window.innerWidth).toBeGreaterThan(clientRect.right);
|
||||
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);
|
||||
$controller.hide();
|
||||
let style = window.getComputedStyle($controller.element);
|
||||
$ctrl.show($parent[0]);
|
||||
$ctrl.hide();
|
||||
let style = window.getComputedStyle(element);
|
||||
|
||||
expect(style.display).toEqual('none');
|
||||
});
|
||||
|
@ -57,62 +62,57 @@ describe('Component vnTooltip', () => {
|
|||
|
||||
describe('relocate()', () => {
|
||||
it(`should reallocate tooltip on top-left`, () => {
|
||||
let parent = {getBoundingClientRect() {
|
||||
return {top: 0, left: 0, height: 10, width: 10};
|
||||
}};
|
||||
$controller.show(parent);
|
||||
let clientRect = $controller.element.getBoundingClientRect();
|
||||
$ctrl.show($parent[0]);
|
||||
let rect = element.getBoundingClientRect();
|
||||
|
||||
expect($controller.margin).toBeLessThan(clientRect.top);
|
||||
expect($controller.margin).toEqual(clientRect.left);
|
||||
expect($ctrl.margin).toBeLessThan(rect.top);
|
||||
expect($ctrl.margin).toEqual(rect.left);
|
||||
});
|
||||
|
||||
it(`should reallocate tooltip on bottom-left`, () => {
|
||||
let parent = {
|
||||
getBoundingClientRect() {
|
||||
return {top: $controller.window.innerHeight, left: 0, height: 10, width: 10};
|
||||
}};
|
||||
$controller.show(parent);
|
||||
let clientRect = $controller.element.getBoundingClientRect();
|
||||
$parent.css({
|
||||
top: `${window.innerHeight}px`
|
||||
});
|
||||
$ctrl.show($parent[0]);
|
||||
let rect = element.getBoundingClientRect();
|
||||
|
||||
expect($controller.window.innerHeight).toBeGreaterThan(clientRect.top);
|
||||
expect($controller.margin).toEqual(clientRect.left);
|
||||
expect(window.innerHeight).toBeGreaterThan(rect.top);
|
||||
expect($ctrl.margin).toEqual(rect.left);
|
||||
});
|
||||
|
||||
it(`should reallocate tooltip on bottom-right`, () => {
|
||||
let parent = {
|
||||
getBoundingClientRect() {
|
||||
return {top: $controller.window.innerHeight, left: $controller.window.innerWidth, height: 10, width: 10};
|
||||
}};
|
||||
$controller.show(parent);
|
||||
let clientRect = $controller.element.getBoundingClientRect();
|
||||
$parent.css({
|
||||
top: `${window.innerHeight}px`,
|
||||
left: `${window.innerWidth}px`
|
||||
});
|
||||
$ctrl.show($parent[0]);
|
||||
let rect = element.getBoundingClientRect();
|
||||
|
||||
expect($controller.window.innerWidth).toBeGreaterThan(clientRect.left);
|
||||
expect($controller.window.innerWidth - $controller.margin).toEqual(clientRect.right);
|
||||
expect(window.innerWidth).toBeGreaterThan(rect.left);
|
||||
expect(window.innerWidth - $ctrl.margin).toEqual(rect.right);
|
||||
});
|
||||
|
||||
it(`should reallocate tooltip on top-right`, () => {
|
||||
let parent = {
|
||||
getBoundingClientRect() {
|
||||
return {top: 0, left: $controller.window.innerWidth, height: 10, width: 10};
|
||||
}};
|
||||
$controller.show(parent);
|
||||
let clientRect = $controller.element.getBoundingClientRect();
|
||||
$parent.css({
|
||||
left: `${window.innerWidth}px`
|
||||
});
|
||||
$ctrl.show($parent[0]);
|
||||
let rect = element.getBoundingClientRect();
|
||||
|
||||
expect($controller.margin).toBeLessThan(clientRect.top);
|
||||
expect($controller.window.innerWidth - $controller.margin).toEqual(clientRect.right);
|
||||
expect($ctrl.margin).toBeLessThan(rect.top);
|
||||
expect(window.innerWidth - $ctrl.margin).toEqual(rect.right);
|
||||
});
|
||||
|
||||
it(`should reallocate tooltip on center`, () => {
|
||||
let parent = {
|
||||
getBoundingClientRect() {
|
||||
return {top: $controller.window.innerHeight / 2, left: $controller.window.innerWidth / 2, height: 10, width: 10};
|
||||
}};
|
||||
$controller.show(parent);
|
||||
let clientRect = $controller.element.getBoundingClientRect();
|
||||
$parent.css({
|
||||
top: `${window.window.innerHeight / 2}px`,
|
||||
left: `${window.window.innerWidth / 2}px`
|
||||
});
|
||||
$ctrl.show($parent[0]);
|
||||
let rect = element.getBoundingClientRect();
|
||||
|
||||
expect($controller.window.innerHeight / 2).toBeLessThan(clientRect.top);
|
||||
expect($controller.window.innerWidth / 2).toBeGreaterThan(clientRect.left);
|
||||
expect(window.innerHeight / 2).toBeLessThan(rect.top);
|
||||
expect(window.innerWidth / 2).toBeGreaterThan(rect.left);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue