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

Commit 562b1c9

Browse files
authored
fix(tabs): fix long tab content not scrolling (#10586)
1 parent 90b64fe commit 562b1c9

File tree

3 files changed

+32
-4
lines changed

3 files changed

+32
-4
lines changed

src/components/swipe/swipe.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -82,9 +82,10 @@ function getDirective(name) {
8282

8383
/* @ngInject */
8484
function DirectiveFactory($parse) {
85-
return { restrict: 'A', link: postLink };
86-
function postLink(scope, element, attr) {
87-
element.css('touch-action', 'none');
85+
return {restrict: 'A', link: postLink};
86+
87+
function postLink(scope, element, attr) {
88+
element.css('touch-action', attr['mdSwipeTouchAction'] || 'none');
8889

8990
var fn = $parse(attr[directiveName]);
9091
element.on(eventName, function(ev) {

src/components/swipe/swipe.spec.js

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
describe('swipe', function() {
2+
var $compile, pageScope;
3+
4+
beforeEach(module('material.components.swipe'));
5+
6+
beforeEach(inject(function($injector) {
7+
$compile = $injector.get('$compile');
8+
pageScope = $injector.get('$rootScope').$new();
9+
}));
10+
11+
it('should apply the specified touch-action to the swipe element', function() {
12+
var template = '<div md-swipe-left="dummy = 1" md-swipe-touch-action="pan-y"></div>';
13+
var element = $compile(template)(pageScope);
14+
pageScope.$apply();
15+
16+
expect(element[0].style.touchAction).toBe('pan-y');
17+
});
18+
19+
it('should apply touch-action: none when no touch-action is specified', function() {
20+
var template = '<div md-swipe-left="dummy = 1"></div>';
21+
var element = $compile(template)(pageScope);
22+
pageScope.$apply();
23+
24+
expect(element[0].style.touchAction).toBe('none');
25+
});
26+
});

src/components/tabs/js/tabsDirective.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -158,7 +158,7 @@ function MdTabs ($$mdSvgRegistry) {
158158
'\'md-disabled\': tab.scope.disabled ' +
159159
'}" ' +
160160
'ng-disabled="tab.scope.disabled" ' +
161-
'md-swipe-left="$mdTabsCtrl.nextPage()" ' +
161+
'md-swipe-left="$mdTabsCtrl.nextPage()" md-swipe-touch-action="pan-y" ' +
162162
'md-swipe-right="$mdTabsCtrl.previousPage()" ' +
163163
'md-tabs-template="::tab.label" ' +
164164
'md-scope="::tab.parent"></md-tab-item> ' +
@@ -188,6 +188,7 @@ function MdTabs ($$mdSvgRegistry) {
188188
'aria-labelledby="tab-item-{{::tab.id}}" ' +
189189
'md-swipe-left="$mdTabsCtrl.swipeContent && $mdTabsCtrl.incrementIndex(1)" ' +
190190
'md-swipe-right="$mdTabsCtrl.swipeContent && $mdTabsCtrl.incrementIndex(-1)" ' +
191+
'md-swipe-touch-action="pan-y" ' +
191192
'ng-if="tab.hasContent" ' +
192193
'ng-repeat="(index, tab) in $mdTabsCtrl.tabs" ' +
193194
'ng-class="{ ' +

0 commit comments

Comments
 (0)