diff --git a/src/Tabs/TabIndicator.js b/src/Tabs/TabIndicator.js index 50568150a5a0bd..b9ca648b4ae6dc 100644 --- a/src/Tabs/TabIndicator.js +++ b/src/Tabs/TabIndicator.js @@ -23,8 +23,8 @@ export const styles = (theme: Object) => ({ }); export type IndicatorStyle = { - left: number, - width: number, + left?: number, + width?: number, }; export type ProvidedProps = { diff --git a/src/Tabs/Tabs.js b/src/Tabs/Tabs.js index 179196110e6b7b..f5ffa392c2cda1 100644 --- a/src/Tabs/Tabs.js +++ b/src/Tabs/Tabs.js @@ -161,10 +161,7 @@ class Tabs extends React.Component { }; state = { - indicatorStyle: { - left: 0, - width: 0, - }, + indicatorStyle: {}, scrollerStyle: { marginBottom: 0, }, diff --git a/src/Tabs/Tabs.spec.js b/src/Tabs/Tabs.spec.js index 5592e496355ae2..0c15b375ddeaf8 100644 --- a/src/Tabs/Tabs.spec.js +++ b/src/Tabs/Tabs.spec.js @@ -4,6 +4,7 @@ import React from 'react'; import { assert } from 'chai'; import { spy, stub, useFakeTimers } from 'sinon'; import scroll from 'scroll'; +import { ShallowWrapper } from 'enzyme'; import { createShallow, createMount, getClasses, unwrap } from '../test-utils'; import consoleErrorMock from '../../test/utils/consoleErrorMock'; import Tabs from './Tabs'; @@ -162,6 +163,24 @@ describe('', () => { assert.strictEqual(wrapper2.find(TabIndicator).props().style.width, 0); }); + it('should work server-side', () => { + const wrapper2 = shallow( + + + + , + { disableLifecycleMethods: true }, + ); + const indicator = new ShallowWrapper( + wrapper2 + .find(Tab) + .at(1) + .props().indicator, + wrapper2, + ); + assert.deepEqual(indicator.props().style, {}); + }); + it('should let the selected render the indicator', () => { const wrapper2 = shallow( @@ -246,7 +265,7 @@ describe('', () => { , ); - assert.strictEqual(consoleErrorMock.callCount(), 2); + assert.strictEqual(consoleErrorMock.callCount(), 3); assert.strictEqual( consoleErrorMock.args()[0][0], 'Warning: Material-Next: the value provided `2` is invalid',