From 3f2bf36f6a96c376307319fa1cc5f02586b81e23 Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Wed, 1 Apr 2020 11:29:33 -0300 Subject: [PATCH] Add additional prop validation to Tabs component (#8267) The Tabs component expects the `children` prop to be either a single Tab component or an array of Tab components, and the internal tab index should always map onto one of these components. However, if an invalid tab index was set, it was just returning the first tab contents. Instead it will now validate that the tab being asked for does exist, and throw an error otherwise. --- ui/app/components/ui/tabs/tabs.component.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/ui/app/components/ui/tabs/tabs.component.js b/ui/app/components/ui/tabs/tabs.component.js index 539e56563..9f27dbd2c 100644 --- a/ui/app/components/ui/tabs/tabs.component.js +++ b/ui/app/components/ui/tabs/tabs.component.js @@ -42,6 +42,13 @@ export default class Tabs extends Component { const { children } = this.props const { activeTabIndex } = this.state + if ( + (Array.isArray(children) && !children[activeTabIndex]) || + (!Array.isArray(children) && activeTabIndex !== 0) + ) { + throw new Error(`Tab at index '${activeTabIndex}' does not exist`) + } + return children[activeTabIndex] ? children[activeTabIndex].props.children : children.props.children