Merge 2c1f7fa into 354a228

react-component · Sep 24, 2019 · 6121eba · 6121eba
2 parents 354a228 + 2c1f7fa
commit 6121eba
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 0 deletions.
diff --git a/src/TabBarTabsNode.js b/src/TabBarTabsNode.js
@@ -52,6 +52,7 @@ export default class TabBarTabsNode extends React.Component {
           key={key}
           style={ style }
           {...ref}
+          {...(typeof child.props.tab === 'string' ? {'data-tab': child.props.tab}: {})}
         >
           {child.props.tab}
         </div>

diff --git a/tests/__snapshots__/index.spec.js.snap b/tests/__snapshots__/index.spec.js.snap
@@ -42,6 +42,7 @@ exports[`rc-tabs should render Tabs with correct DOM structure 1`] = `
                 aria-disabled="false"
                 aria-selected="false"
                 class=" rc-tabs-tab"
+                data-tab="tab 1"
                 role="tab"
               >
                 tab 1
@@ -50,6 +51,7 @@ exports[`rc-tabs should render Tabs with correct DOM structure 1`] = `
                 aria-disabled="false"
                 aria-selected="true"
                 class="rc-tabs-tab-active rc-tabs-tab"
+                data-tab="tab 2"
                 role="tab"
               >
                 tab 2
@@ -58,6 +60,7 @@ exports[`rc-tabs should render Tabs with correct DOM structure 1`] = `
                 aria-disabled="false"
                 aria-selected="false"
                 class=" rc-tabs-tab"
+                data-tab="tab 3"
                 role="tab"
               >
                 tab 3

diff --git a/tests/index.spec.js b/tests/index.spec.js
@@ -268,4 +268,21 @@ describe('rc-tabs', () => {
       done();
     }, 1000);
   });
+
+  it('string type tab should have [data-tab] attribute', () => {
+    const wrapper = mount(
+      <Tabs
+        defaultActiveKey="2"
+        renderTabBar={() => <ScrollableInkTabBar/>}
+        renderTabContent={() => <TabContent/>}
+      >
+        <TabPane tab="tab 1" key="1">first</TabPane>
+        <TabPane tab="tab 2" key="2">second</TabPane>
+        <TabPane tab="tab 3" key="3">third</TabPane>
+        <TabPane tab={<div>tab 4</div>} key="4">fourth</TabPane>
+      </Tabs>
+    );
+
+    expect(wrapper.find('[data-tab]').length).toBe(3);
+  })
 });