Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

fix(util): body overflow-x breaking disableScrollAround #9864

Merged
merged 1 commit into from
Oct 21, 2016
Merged

fix(util): body overflow-x breaking disableScrollAround #9864

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 9 additions & 4 deletions src/core/util/util.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -283,22 +283,27 @@ function UtilFactory($document, $timeout, $compile, $rootScope, $$mdAnimate, $in

var viewportTop = $mdUtil.getViewportTop();
var clientWidth = body.clientWidth;
var hasVerticalScrollbar = body.scrollHeight > body.clientHeight + 1;

if (body.scrollHeight > body.clientHeight + 1) {

if (hasVerticalScrollbar) {
angular.element(body).css({
position: 'fixed',
width: '100%',
top: -viewportTop + 'px'
});

documentElement.style.overflowY = 'scroll';
}

if (body.clientWidth < clientWidth) {
body.style.overflow = 'hidden';
}

// This should be applied after the manipulation to the body, because
// adding a scrollbar can potentially resize it, causing the measurement
// to change.
if (hasVerticalScrollbar) {
documentElement.style.overflowY = 'scroll';
}

return function restoreScroll() {
// Reset the inline style CSS to the previous.
body.style.cssText = prevBodyStyle;
Expand Down
25 changes: 23 additions & 2 deletions src/core/util/util.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ describe('util', function() {
};

expect(function() {
$mdUtil.getModelOption(ngModelCtrl, 'Unknown')
$mdUtil.getModelOption(ngModelCtrl, 'Unknown');
}).not.toThrow();
}));

Expand Down Expand Up @@ -268,7 +268,7 @@ describe('util', function() {
element.remove();
}));

it('should not remove the element when being use as scorll mask', inject(function($mdUtil) {
it('should not remove the element when being use as scroll mask', inject(function($mdUtil) {
var element = angular.element('<div>');

document.body.appendChild(element[0]);
Expand All @@ -285,6 +285,27 @@ describe('util', function() {
element.remove();
}));

it('should not get thrown off by the scrollbar on the <html> node',
inject(function($mdUtil) {
var element = angular.element('<div style="height: 2000px">');

document.body.appendChild(element[0]);
document.body.style.overflowX = 'hidden';

window.scrollTo(0, 1000);

var enableScrolling = $mdUtil.disableScrollAround(element);

expect(document.body.style.overflow).not.toBe('hidden');

// Restore the scrolling.
enableScrolling();
window.scrollTo(0, 0);
document.body.style.overflowX = '';

element.remove();
})
);
});

describe('getViewportTop', function() {
Expand Down