fix(tabs): allow right and left arrows to cycle through tabs (#10786)

Author: kbae00

src/components/tabs/js/tabsController.js

@@ -684,6 +684,9 @@ function MdTabsController ($scope, $element, $window, $mdConstant, $mdTabInkRipp
     for (newIndex = index + inc;
          ctrl.tabs[ newIndex ] && ctrl.tabs[ newIndex ].scope.disabled;
          newIndex += inc) {}
+
+    newIndex = (index + inc + ctrl.tabs.length) % ctrl.tabs.length;
+
     if (ctrl.tabs[ newIndex ]) {
       ctrl[ key ] = newIndex;
     }

src/components/tabs/tabs.spec.js

@@ -100,13 +100,18 @@ describe('<md-tabs>', function () {
                            '<md-tab ng-disabled="true"></md-tab>' +
                            '<md-tab></md-tab>' +
                            '</md-tabs>');
+      var ctrl = tabs.controller('mdTabs');
       var tabItems = tabs.find('md-tab-item');
 
       expect(tabItems.eq(0)).toBeActiveTab();
 
-      // Boundary case, do nothing
+      // Focus should move to the last tab if left arrow is pressed
       triggerKeydown(tabs.find('md-tabs-canvas').eq(0), $mdConstant.KEY_CODE.LEFT_ARROW);
-      expect(tabItems.eq(0)).toBeActiveTab();
+      expect(ctrl.getFocusedTabId()).toBe(tabItems.eq(2).attr('id'));
+
+      // Focus should move to the first tab if right arrow is pressed
+      triggerKeydown(tabs.find('md-tabs-canvas').eq(0), $mdConstant.KEY_CODE.RIGHT_ARROW);
+      expect(ctrl.getFocusedTabId()).toBe(tabItems.eq(0).attr('id'));
 
       // Tab 0 should still be active, but tab 2 focused (skip tab 1 it's disabled)
       triggerKeydown(tabs.find('md-tabs-canvas').eq(0), $mdConstant.KEY_CODE.RIGHT_ARROW);
@@ -115,10 +120,6 @@ describe('<md-tabs>', function () {
       triggerKeydown(tabs.find('md-tabs-canvas').eq(0), $mdConstant.KEY_CODE.ENTER);
       expect(tabItems.eq(2)).toBeActiveTab();
 
-      // Boundary case, do nothing
-      triggerKeydown(tabs.find('md-tabs-canvas').eq(0), $mdConstant.KEY_CODE.RIGHT_ARROW);
-      expect(tabItems.eq(2)).toBeActiveTab();
-
       triggerKeydown(tabs.find('md-tabs-canvas').eq(0), $mdConstant.KEY_CODE.ENTER);
       expect(tabItems.eq(2)).toBeActiveTab();