Merge pull request react-bootstrap#601 from apkiernan/listGroupItemID

[fixed] react-bootstrap#597 able to set ID on ListGroup
lithiumtech · May 1, 2015 · 6b130f5 · 6b130f5
2 parents c508699 + fef8984
commit 6b130f5
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 3 deletions.
diff --git a/src/ListGroup.js b/src/ListGroup.js
@@ -46,23 +46,28 @@ class ListGroup extends React.Component {
     );
 
     return (
-      <ul className={classNames(this.props.className, 'list-group')}>
+      <ul
+        {...this.props}
+        className={classNames(this.props.className, 'list-group')}>
         {listItems}
       </ul>
     );
   }
 
   renderDiv(items) {
     return (
-      <div className={classNames(this.props.className, 'list-group')}>
+      <div
+        {...this.props}
+        className={classNames(this.props.className, 'list-group')}>
         {items}
       </div>
     );
   }
 }
 
 ListGroup.propTypes = {
-  className: React.PropTypes.string
+  className: React.PropTypes.string,
+  id: React.PropTypes.string
 };
 
 export default ListGroup;
diff --git a/test/ListGroupSpec.js b/test/ListGroupSpec.js
@@ -136,4 +136,15 @@ describe('ListGroup', function () {
     assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'list-group'));
   });
 
+  it('Should support an element id through "id" prop', function () {
+    let instance = ReactTestUtils.renderIntoDocument(
+      <ListGroup id="testItem">
+        <ListGroupItem>Child</ListGroupItem>
+      </ListGroup>
+    );
+    assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'list-group'));
+    assert.equal(React.findDOMNode(instance).nodeName, 'UL');
+    assert.equal(React.findDOMNode(instance).id, 'testItem');
+  });
+
 });