Skip to content

Commit fbbb72a

Browse files
crisbetocrisbeto
committed
fix(): disable problematic tests in iOS
1 parent 9e6ebe1 commit fbbb72a

File tree

1 file changed

+69
-14
lines changed

1 file changed

+69
-14
lines changed

‎src/lib/core/overlay/disable-body-scroll.spec.ts‎

Lines changed: 69 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,67 @@
1+
import {TestBed, async, inject} from '@angular/core/testing';
2+
import {OverlayModule} from './overlay-directives';
13
import {DisableBodyScroll} from './disable-body-scroll';
24

35

46
describe('DisableBodyScroll', () => {
57
let service: DisableBodyScroll;
6-
let forceScrollElement: HTMLElement;
8+
let startingWindowHeight = window.innerHeight;
9+
let forceScrollElement: HTMLElement = document.createElement('div');
710

8-
beforeEach(() => {
9-
forceScrollElement = document.createElement('div');
10-
forceScrollElement.style.height = '3000px';
11-
document.body.appendChild(forceScrollElement);
12-
service = new DisableBodyScroll();
13-
});
11+
forceScrollElement.style.height = '3000px';
12+
forceScrollElement.style.width = '100px';
13+
14+
beforeEach(async(() => {
15+
TestBed.configureTestingModule({
16+
imports: [OverlayModule.forRoot()]
17+
});
18+
}));
19+
20+
beforeEach(inject([DisableBodyScroll], (disableBodyScroll: DisableBodyScroll) => {
21+
service = disableBodyScroll;
22+
}));
1423

1524
afterEach(() => {
16-
forceScrollElement.parentNode.removeChild(forceScrollElement);
17-
forceScrollElement = null;
25+
if (forceScrollElement.parentNode) {
26+
forceScrollElement.parentNode.removeChild(forceScrollElement);
27+
}
28+
1829
service.deactivate();
1930
});
2031

2132
it('should prevent scrolling', () => {
22-
window.scroll(0, 0);
33+
document.body.appendChild(forceScrollElement);
34+
window.scrollTo(0, 0);
35+
36+
// In the iOS simulator (BrowserStack & SauceLabs), adding the content to the
37+
// body causes karma's iframe for the test to stretch to fit that content once we attempt to
38+
// scroll the page. Setting width / height / maxWidth / maxHeight on the iframe does not
39+
// successfully constrain its size. As such, skip assertions in environments where the
40+
// window size has changed since the start of the test.
41+
if (window.innerHeight > startingWindowHeight) {
42+
return;
43+
}
2344

2445
service.activate();
2546

26-
window.scroll(0, 500);
47+
window.scrollTo(0, 500);
2748

2849
expect(window.pageYOffset).toBe(0);
2950
});
3051

3152
it('should toggle the isActive property', () => {
53+
document.body.appendChild(forceScrollElement);
54+
window.scrollTo(0, 100);
55+
56+
// In the iOS simulator (BrowserStack & SauceLabs), adding the content to the
57+
// body causes karma's iframe for the test to stretch to fit that content once we attempt to
58+
// scroll the page. Setting width / height / maxWidth / maxHeight on the iframe does not
59+
// successfully constrain its size. As such, skip assertions in environments where the
60+
// window size has changed since the start of the test.
61+
if (window.innerHeight > startingWindowHeight) {
62+
return;
63+
}
64+
3265
service.activate();
3366
expect(service.isActive).toBe(true);
3467

@@ -37,16 +70,26 @@ describe('DisableBodyScroll', () => {
3770
});
3871

3972
it('should not disable scrolling if the content is shorter than the viewport height', () => {
40-
forceScrollElement.style.height = '0';
4173
service.activate();
4274
expect(service.isActive).toBe(false);
4375
});
4476

4577
it('should add the proper inline styles to the <body> and <html> nodes', () => {
78+
document.body.appendChild(forceScrollElement);
79+
window.scrollTo(0, 500);
80+
81+
// In the iOS simulator (BrowserStack & SauceLabs), adding the content to the
82+
// body causes karma's iframe for the test to stretch to fit that content once we attempt to
83+
// scroll the page. Setting width / height / maxWidth / maxHeight on the iframe does not
84+
// successfully constrain its size. As such, skip assertions in environments where the
85+
// window size has changed since the start of the test.
86+
if (window.innerHeight > startingWindowHeight) {
87+
return;
88+
}
89+
4690
let bodyCSS = document.body.style;
4791
let htmlCSS = document.documentElement.style;
4892

49-
window.scroll(0, 500);
5093
service.activate();
5194

5295
expect(bodyCSS.position).toBe('fixed');
@@ -60,6 +103,8 @@ describe('DisableBodyScroll', () => {
60103
let bodyCSS = document.body.style;
61104
let htmlCSS = document.documentElement.style;
62105

106+
document.body.appendChild(forceScrollElement);
107+
63108
bodyCSS.position = 'static';
64109
bodyCSS.width = '1000px';
65110
htmlCSS.overflowY = 'hidden';
@@ -76,7 +121,17 @@ describe('DisableBodyScroll', () => {
76121
});
77122

78123
it('should restore the scroll position when enabling scrolling', () => {
79-
window.scroll(0, 1000);
124+
document.body.appendChild(forceScrollElement);
125+
window.scrollTo(0, 1000);
126+
127+
// In the iOS simulator (BrowserStack & SauceLabs), adding the content to the
128+
// body causes karma's iframe for the test to stretch to fit that content once we attempt to
129+
// scroll the page. Setting width / height / maxWidth / maxHeight on the iframe does not
130+
// successfully constrain its size. As such, skip assertions in environments where the
131+
// window size has changed since the start of the test.
132+
if (window.innerHeight > startingWindowHeight) {
133+
return;
134+
}
80135

81136
service.activate();
82137
service.deactivate();

0 commit comments

Comments
 (0)