1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
|
import { GlBreakpointInstance as breakpointInstance } from '@gitlab/ui/dist/utils';
import * as commonUtils from '~/lib/utils/common_utils';
describe('common_utils browser specific specs', () => {
const mockOffsetHeight = (elem, offsetHeight) => {
Object.defineProperty(elem, 'offsetHeight', { value: offsetHeight });
};
const mockBoundingClientRect = (elem, rect) => {
jest.spyOn(elem, 'getBoundingClientRect').mockReturnValue(rect);
};
describe('contentTop', () => {
it('does not add height for fileTitle or compareVersionsHeader if screen is too small', () => {
jest.spyOn(breakpointInstance, 'isDesktop').mockReturnValue(false);
setFixtures(`
<div class="diff-file file-title-flex-parent">
blah blah blah
</div>
<div class="mr-version-controls">
more blah blah blah
</div>
`);
expect(commonUtils.contentTop()).toBe(0);
});
it('adds height for fileTitle and compareVersionsHeader screen is large enough', () => {
jest.spyOn(breakpointInstance, 'isDesktop').mockReturnValue(true);
setFixtures(`
<div class="diff-file file-title-flex-parent">
blah blah blah
</div>
<div class="mr-version-controls">
more blah blah blah
</div>
`);
mockOffsetHeight(document.querySelector('.diff-file'), 100);
mockOffsetHeight(document.querySelector('.mr-version-controls'), 18);
expect(commonUtils.contentTop()).toBe(18);
});
});
describe('isInViewport', () => {
let el;
beforeEach(() => {
el = document.createElement('div');
});
afterEach(() => {
document.body.removeChild(el);
});
it('returns true when provided `el` is in viewport', () => {
el.setAttribute('style', `position: absolute; right: ${window.innerWidth + 0.2};`);
mockBoundingClientRect(el, {
x: 8,
y: 8,
width: 0,
height: 0,
top: 8,
right: 8,
bottom: 8,
left: 8,
});
document.body.appendChild(el);
expect(commonUtils.isInViewport(el)).toBe(true);
});
it('returns false when provided `el` is not in viewport', () => {
el.setAttribute('style', 'position: absolute; top: -1000px; left: -1000px;');
mockBoundingClientRect(el, {
x: -1000,
y: -1000,
width: 0,
height: 0,
top: -1000,
right: -1000,
bottom: -1000,
left: -1000,
});
document.body.appendChild(el);
expect(commonUtils.isInViewport(el)).toBe(false);
});
});
});
|
