Finished scroll_helper tests
This commit is contained in:
parent
99193d824f
commit
5e4b18eef7
2 changed files with 44 additions and 4 deletions
|
@ -9,10 +9,11 @@ const ScrollHelper = {
|
||||||
});
|
});
|
||||||
|
|
||||||
const $ruler = $('<div>').css({
|
const $ruler = $('<div>').css({
|
||||||
width: '100%',
|
width: 100,
|
||||||
});
|
});
|
||||||
|
|
||||||
$ruler.appendTo($rulerContainer);
|
$ruler.appendTo($rulerContainer);
|
||||||
|
|
||||||
$rulerContainer.appendTo('body');
|
$rulerContainer.appendTo('body');
|
||||||
|
|
||||||
const scrollWidth = $ruler.outerWidth();
|
const scrollWidth = $ruler.outerWidth();
|
||||||
|
|
|
@ -2,17 +2,56 @@ import $ from 'jquery';
|
||||||
import ScrollHelper from '~/helpers/scroll_helper';
|
import ScrollHelper from '~/helpers/scroll_helper';
|
||||||
|
|
||||||
describe('ScrollHelper', () => {
|
describe('ScrollHelper', () => {
|
||||||
|
const width = 10;
|
||||||
|
|
||||||
|
describe('getScrollWidth', () => {
|
||||||
|
const parent = jasmine.createSpyObj('parent', ['css', 'appendTo', 'remove']);
|
||||||
|
const child = jasmine.createSpyObj('child', ['css', 'appendTo', 'outerWidth']);
|
||||||
|
let scrollWidth;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
spyOn($.fn, 'init').and.returnValues(parent, child);
|
||||||
|
spyOn(jasmine.Fixtures.prototype, 'cleanUp'); // disable jasmine-jquery cleanup, we dont want it but its imported in test_bundle :(
|
||||||
|
|
||||||
|
parent.css.and.returnValue(parent);
|
||||||
|
child.css.and.returnValue(child);
|
||||||
|
child.outerWidth.and.returnValue(width);
|
||||||
|
|
||||||
|
scrollWidth = ScrollHelper.getScrollWidth();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('inserts 2 nested hidden scrollable divs, calls parents outerWidth, removes parent and returns the width', () => {
|
||||||
|
const initArgs = $.fn.init.calls.allArgs();
|
||||||
|
|
||||||
|
expect(initArgs[0][0]).toEqual('<div>');
|
||||||
|
expect(initArgs[1][0]).toEqual('<div>');
|
||||||
|
expect(parent.css).toHaveBeenCalledWith({
|
||||||
|
visibility: 'hidden',
|
||||||
|
width: 100,
|
||||||
|
overflow: 'scroll',
|
||||||
|
});
|
||||||
|
expect(child.css).toHaveBeenCalledWith({
|
||||||
|
width: 100,
|
||||||
|
});
|
||||||
|
expect(child.appendTo).toHaveBeenCalledWith(parent);
|
||||||
|
expect(parent.appendTo).toHaveBeenCalledWith('body');
|
||||||
|
expect(child.outerWidth).toHaveBeenCalled();
|
||||||
|
expect(parent.remove).toHaveBeenCalled();
|
||||||
|
expect(scrollWidth).toEqual(100 - width);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe('setScrollWidth', () => {
|
describe('setScrollWidth', () => {
|
||||||
it('calls getScrollWidth and sets data-scroll-width', () => {
|
it('calls getScrollWidth and sets data-scroll-width', () => {
|
||||||
const width = 10;
|
spyOn($.fn, 'find').and.callThrough();
|
||||||
|
|
||||||
spyOn($.fn, 'attr');
|
spyOn($.fn, 'attr');
|
||||||
spyOn(ScrollHelper, 'getScrollWidth').and.returnValue(width);
|
spyOn(ScrollHelper, 'getScrollWidth').and.returnValue(width);
|
||||||
|
|
||||||
ScrollHelper.setScrollWidth();
|
ScrollHelper.setScrollWidth();
|
||||||
|
|
||||||
expect(ScrollHelper.getScrollWidth).toHaveBeenCalled();
|
expect($.fn.find).toHaveBeenCalledWith('body');
|
||||||
expect($.fn.attr).toHaveBeenCalledWith('data-scroll-width', width);
|
expect($.fn.attr).toHaveBeenCalledWith('data-scroll-width', width);
|
||||||
|
expect(ScrollHelper.getScrollWidth).toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue