Skip to content

Commit 4e72026

Browse files
committed
Add a cancel option to tab change event handler (#73)
1 parent 5025d44 commit 4e72026

File tree

2 files changed

+21
-3
lines changed

2 files changed

+21
-3
lines changed

src/components/Tabs.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -76,12 +76,17 @@ module.exports = React.createClass({
7676
// Keep reference to last index for event handler
7777
const last = this.state.selectedIndex;
7878

79-
// Update selected index
80-
this.setState({ selectedIndex: index, focus: focus === true });
79+
// Check if the change event handler cancels the tab change
80+
let cancel = false;
8181

8282
// Call change event handler
8383
if (typeof this.props.onSelect === 'function') {
84-
this.props.onSelect(index, last);
84+
cancel = this.props.onSelect(index, last) === false;
85+
}
86+
87+
if (!cancel) {
88+
// Update selected index
89+
this.setState({ selectedIndex: index, focus: focus === true });
8590
}
8691
},
8792

src/components/__tests__/Tabs-test.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -282,4 +282,17 @@ describe('react-tabs', () => {
282282

283283
expect(wrapper.prop('selectedIndex')).toBe(undefined);
284284
});
285+
286+
it('should cancel if event handler returns false', () => {
287+
const wrapper = mount(createTabs({ onSelect: () => false }));
288+
289+
assertTabSelected(wrapper, 0);
290+
291+
wrapper.childAt(0).childAt(1).simulate('click');
292+
assertTabSelected(wrapper, 0);
293+
294+
wrapper.childAt(0).childAt(2).simulate('click');
295+
assertTabSelected(wrapper, 0);
296+
297+
});
285298
});

0 commit comments

Comments
 (0)