diff --git a/src/badge/index.jsx b/src/badge/component.jsx
similarity index 84%
rename from src/badge/index.jsx
rename to src/badge/component.jsx
index 809f718a..40c7a539 100644
--- a/src/badge/index.jsx
+++ b/src/badge/component.jsx
@@ -1,10 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
-import Radium from 'radium';
-import compose from 'recompose/compose';
import isNumber from 'lodash/isNumber';
import getStyles from './get-styles';
-import themeable from '../themeable';
/** Used for displaying a (notification) counter */
const Badge = ({ value, maxValue, inverted, style, color, ...custom }) => {
@@ -43,9 +40,4 @@ Badge.defaultProps = {
maxValue: null
};
-const enhance = compose(
- themeable(),
- Radium
-);
-
-export default enhance(Badge);
+export default Badge;
diff --git a/src/badge/index.js b/src/badge/index.js
new file mode 100644
index 00000000..1dae9f21
--- /dev/null
+++ b/src/badge/index.js
@@ -0,0 +1,11 @@
+import Radium from 'radium';
+import compose from 'recompose/compose';
+import themeable from '../themeable';
+import Badge from './component';
+
+const enhance = compose(
+ themeable(),
+ Radium
+);
+
+export default enhance(Badge);
diff --git a/test/badge/get-styles.test.js b/test/badge/get-styles.test.js
index f517daf1..7271d867 100644
--- a/test/badge/get-styles.test.js
+++ b/test/badge/get-styles.test.js
@@ -27,6 +27,7 @@ describe('Badge.getStyles', () => {
const style = getStyles.root('red', true);
expect(style).to.have.property('backgroundColor', '#FEFEFE');
+ expect(style).to.have.property('color', 'red');
});
});
});
diff --git a/test/badge/index.test.js b/test/badge/index.test.js
index 8bb156e3..10bcae3b 100644
--- a/test/badge/index.test.js
+++ b/test/badge/index.test.js
@@ -5,7 +5,7 @@ import chai, { expect } from 'chai';
import { shallow } from 'enzyme';
import sinon from 'sinon';
import sinonChai from 'sinon-chai';
-import Badge from '../../src/badge';
+import Badge from '../../src/badge/component';
import getStyles from '../../src/badge/get-styles';
chai.use(sinonChai);
@@ -27,30 +27,33 @@ describe('Badge', () => {
global.navigator = undefined;
});
- it('should always render a span element', () => {
- const wrapper = shallow().dive();
+ it('should render a span element', () => {
+ const component = shallow();
- expect(wrapper.find('span')).to.have.length(1);
+ expect(component.find('span')).to.have.length(1);
});
- it('should pass the content prop to the span element if the value prop is not greater than the maxValue prop', () => {
- const wrapper = shallow().dive();
+ it('should render content element', () => {
+ const component = shallow();
- expect(wrapper.containsMatchingElement({1})).to.equal(true);
+ expect(component.find('span').containsMatchingElement(1)).to.equal(true);
});
- it('should pass the content prop to the span element if the value prop is greater than the maxValue prop', () => {
- props.value = 3;
- const wrapper = shallow().dive();
+ it('should render maxValue+ element', () => {
+ const combinedProps = {
+ ...props,
+ value: 3
+ };
- expect(wrapper.containsMatchingElement(2+)).to.equal(true);
- props.value = 1;
+ const component = shallow();
+
+ expect(component.find('span').containsMatchingElement('2+')).to.equal(true);
});
it('should get root styles', () => {
const spy = sinon.spy(getStyles, 'root');
- shallow().dive();
+ shallow();
expect(spy).to.have.been.calledWith(
props.color, props.inverted, props.style
);