fix(a11y): Adds uniqueid to Dropdowns.

Fixes jasmine tests to have ids.

Signed-off-by: Kenny Wang <[email protected]>

package.json

@@ -74,7 +74,7 @@
  "pui-cursor": "^1.3.2",
  "react": "0.13.3",
  "react-a11y": "pivotal-cf/react-a11y#separator-fix-dist",
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25",
+ "react-bootstrap": "0.25.1",
  "react-fa": "^3.0.0",
  "require-dir": "^0.3.0",
  "rimraf": "^2.4.3",

spec/pivotal-ui-react/overlay-trigger/overlay-trigger_spec.js

@@ -11,7 +11,7 @@ describe('OverlayTrigger', function() {
  describe('hovering over the launcher', function() {
  beforeEach(function() {
  var tooltip = (
- <Tooltip className="tooltip-text"> Hello World </Tooltip>
+ <Tooltip className="tooltip-text" id="1"> Hello World </Tooltip>
  );
  var launcher = (<span className="launcher">Hover For Tooltip</span>);
 
@@ -34,10 +34,10 @@ describe('OverlayTrigger', function() {
  describe('when no id is provided', function() {
  beforeEach(function() {
  var tooltip = (
- <Tooltip className="tooltip-text"> Hello World </Tooltip>
+ <Tooltip className="tooltip-text" id="tooltip1"> Hello World </Tooltip>
  );
  var tooltip2 = (
- <Tooltip className="tooltip-text">Hello World2 </Tooltip>
+ <Tooltip className="tooltip-text" id="tooltip2">Hello World2 </Tooltip>
  );
  var launcher = (<div className="launcher">Hover For Tooltip</div>);
 
@@ -90,7 +90,7 @@ describe('OverlayTrigger', function() {
  describe('accessibility', function() {
  it('passes ADT', function() {
  var tooltip = (
- <Tooltip className="tooltip-text">Hello World</Tooltip>
+ <Tooltip className="tooltip-text" id="tooltip3">Hello World</Tooltip>
  );
  var launcher = (<span className="launcher">Hover For Tooltip</span>);
 

src/pivotal-ui-react/alerts/package.json

@@ -3,7 +3,7 @@
  "description": "React components to display flash messages to the user",
  "homepage": "https://styleguide.pivotal.io/react.html#alerts_react",
  "dependencies": {
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25-rc",
+ "react-bootstrap": "0.25.1",
  "pui-css-alerts": "2.0.0-alpha.3",
  "pui-css-iconography": "2.0.0-alpha.3",
  "pui-react-media": "2.0.0-alpha.3"

src/pivotal-ui-react/collapse/package.json

@@ -3,7 +3,7 @@
  "description": "React components providing accordions for showing and hiding content",
  "homepage": "https://styleguide.pivotal.io/react.html#collapse_react",
  "dependencies": {
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25-rc",
+ "react-bootstrap": "0.25.1",
  "classnames": "^1.2.0",
  "pui-css-collapse": "2.0.0-alpha.3",
  "pui-css-iconography": "2.0.0-alpha.3",

src/pivotal-ui-react/dropdowns/dropdowns.js

@@ -1,5 +1,6 @@
 var React = require('react');
 import classnames from 'classnames';
+import uniqueid from 'lodash.uniqueid';
 
 /**
  * @component Dropdown
@@ -39,12 +40,16 @@ function defDropdown(props) {
  },
  render: function render() {
  const {buttonClassName, style, title, children, border, ...others} = this.props;
+ let {id} = others;
  const {buttonClassName: defaultBtnClassName, bsStyle} = props;
 
  const btnClass = classnames(buttonClassName, defaultBtnClassName);
  const borderClass = border ? 'dropdown-border' : null;
+ if (!id) {
+ id = uniqueid('dropdown');
+ }
  return (
- <BsDropdown {...others}>
+ <BsDropdown {...others} id={id}>
  <BsDropdown.Toggle className={btnClass} bsStyle={bsStyle} style={style}>
  {title}
  </BsDropdown.Toggle>

src/pivotal-ui-react/expander/package.json

@@ -3,7 +3,7 @@
  "description": "A React component that provides an accordion for showing and hiding content where the toggle and the content can be in separate places",
  "homepage": "https://styleguide.pivotal.io/react.html#expander_react",
  "dependencies": {
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25-rc",
+ "react-bootstrap": "0.25.1",
  "pui-css-bootstrap": "2.0.0-alpha.3"
  }
 }

src/pivotal-ui-react/grids/package.json

@@ -5,6 +5,6 @@
  "dependencies": {
  "pui-css-grids": "2.0.0-alpha.3",
  "classnames": "^1.2.0",
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25-rc"
+ "react-bootstrap": "0.25.1"
  }
 }

src/pivotal-ui-react/overlay-trigger/package.json

@@ -2,8 +2,8 @@
  "version": "2.0.0-alpha.3",
  "description": "A React component for displaying a tooltip or popover on user action",
  "dependencies": {
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25-rc",
- "lodash.uniqueid": "3.0.0"
+ "lodash.uniqueid": "3.0.0",
+ "react-bootstrap": "0.25.1"
  },
  "homepage": "https://styleguide.pivotal.io/react.html#tooltips_react"
 }

src/pivotal-ui-react/tabs/package.json

@@ -3,7 +3,7 @@
  "description": "React components for tab-based content toggling",
  "homepage": "https://styleguide.pivotal.io/react.html#tabs_react",
  "dependencies": {
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25-rc",
+ "react-bootstrap": "0.25.1",
  "pui-css-collapse": "2.0.0-alpha.3",
  "pui-css-tabs": "2.0.0-alpha.3",
  "lodash.uniqueid": "^3.0.0",

src/pivotal-ui-react/tooltip/package.json

@@ -3,7 +3,7 @@
  "description": "A React component that provides styled tooltips",
  "homepage": "https://styleguide.pivotal.io/react.html#tooltips_react",
  "dependencies": {
- "react-bootstrap": "pivotal-cf/react-bootstrap#distv0.25-rc",
+ "react-bootstrap": "0.25.1",
  "pui-css-tooltips": "2.0.0-alpha.3"
  }
 }