diff --git a/.size-limit.js b/.size-limit.js
index dcaea700d375c9..b55df1ec040fa6 100644
--- a/.size-limit.js
+++ b/.size-limit.js
@@ -27,7 +27,7 @@ module.exports = [
name: 'The size of all the modules of material-ui.',
webpack: true,
path: 'packages/material-ui/build/index.js',
- limit: '94.8 KB',
+ limit: '94.9 KB',
},
{
name: 'The main bundle of the docs',
diff --git a/packages/material-ui/src/Tabs/Tabs.js b/packages/material-ui/src/Tabs/Tabs.js
index 553eec39bee9dc..40af221f796247 100644
--- a/packages/material-ui/src/Tabs/Tabs.js
+++ b/packages/material-ui/src/Tabs/Tabs.js
@@ -7,6 +7,8 @@ import classNames from 'classnames';
import EventListener from 'react-event-listener';
import debounce from 'debounce'; // < 1kb payload overhead when lodash/debounce is > 3kb.
import { getNormalizedScrollLeft, detectScrollType } from 'normalize-scroll-left';
+// TODO: should we fork it?
+// https://github.com/michaelrhodes/scroll/issues/10
import scroll from 'scroll';
import ScrollbarSize from './ScrollbarSize';
import withStyles from '../styles/withStyles';
@@ -94,11 +96,10 @@ class Tabs extends React.Component {
}
componentDidUpdate(prevProps, prevState) {
- this.updateScrollButtonState();
-
// The index might have changed at the same time.
// We need to check again the right indicator position.
this.updateIndicatorState(this.props);
+ this.updateScrollButtonState();
if (this.state.indicatorStyle !== prevState.indicatorStyle) {
this.scrollSelectedIntoView();
@@ -176,15 +177,11 @@ class Tabs extends React.Component {
};
handleLeftScrollClick = () => {
- if (this.tabsRef) {
- this.moveTabsScroll(-this.tabsRef.clientWidth);
- }
+ this.moveTabsScroll(-this.tabsRef.clientWidth);
};
handleRightScrollClick = () => {
- if (this.tabsRef) {
- this.moveTabsScroll(this.tabsRef.clientWidth);
- }
+ this.moveTabsScroll(this.tabsRef.clientWidth);
};
handleScrollbarSizeChange = ({ scrollbarHeight }) => {
@@ -198,13 +195,11 @@ class Tabs extends React.Component {
moveTabsScroll = delta => {
const { theme } = this.props;
- if (this.tabsRef) {
- const multiplier = theme.direction === 'rtl' ? -1 : 1;
- const nextScrollLeft = this.tabsRef.scrollLeft + delta * multiplier;
- // Fix for Edge
- const invert = theme.direction === 'rtl' && detectScrollType() === 'reverse' ? -1 : 1;
- scroll.left(this.tabsRef, invert * nextScrollLeft);
- }
+ const multiplier = theme.direction === 'rtl' ? -1 : 1;
+ const nextScrollLeft = this.tabsRef.scrollLeft + delta * multiplier;
+ // Fix for Edge
+ const invert = theme.direction === 'rtl' && detectScrollType() === 'reverse' ? -1 : 1;
+ scroll.left(this.tabsRef, invert * nextScrollLeft);
};
scrollSelectedIntoView = () => {
@@ -229,7 +224,7 @@ class Tabs extends React.Component {
updateScrollButtonState = () => {
const { scrollable, scrollButtons, theme } = this.props;
- if (this.tabsRef && scrollable && scrollButtons !== 'off') {
+ if (scrollable && scrollButtons !== 'off') {
const { scrollWidth, clientWidth } = this.tabsRef;
const scrollLeft = getNormalizedScrollLeft(this.tabsRef, theme.direction);
diff --git a/packages/material-ui/src/Tabs/Tabs.test.js b/packages/material-ui/src/Tabs/Tabs.test.js
index a86f319f9a549f..8e4692319a6df9 100644
--- a/packages/material-ui/src/Tabs/Tabs.test.js
+++ b/packages/material-ui/src/Tabs/Tabs.test.js
@@ -30,7 +30,7 @@ describe('', () => {
};
before(() => {
- shallow = createShallow({ untilSelector: 'Tabs' });
+ shallow = createShallow({ untilSelector: 'Tabs', disableLifecycleMethods: true });
classes = getClasses();
mount = createMount();
});
@@ -627,6 +627,7 @@ describe('', () => {
,
);
+ wrapper.setState({ mounted: true });
assert.strictEqual(wrapper.find(TabIndicator).props().style.backgroundColor, 'green');
});
});