IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: Components: Added id, className and style property for Badge component. Added tests.

Browse Source
This commit is contained in:
Ilya Oleshko 2019-11-26 12:09:39 +03:00
parent 8918d311a9
commit 51e0aee7ff
3 changed files with 71 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
web/ASC.Web.Components/src/components/badge/README.md
View File

@ -24,14 +24,17 @@ import { Badge } from "asc-web-components";
### Properties
| Props | Type | Required | Values | Default | Description |
| ----------------- | :------: | :------: | :----: | :-------: | -------------------- |
| `number` | `number` | - | - | `0` | Number value |
| `backgroundColor` | `string` | - | - | `#ED7309` | CSS background-color |
| `color` | `string` | - | - | `#FFFFFF` | CSS color |
| `fontSize` | `string` | - | - | `11px` | CSS font-size |
| `fontWeight` | `number` | - | - | `800` | CSS font-weight |
| `borderRadius` | `string` | - | - | `11px` | CSS border-radius |
| `padding` | `string` | - | - | `0 5px` | CSS padding |
| `maxWidth` | `string` | - | - | `50px` | CSS max-width |
| `onClick` | `func` | - | - | - | onClick event |
| Props | Type | Required | Values | Default | Description |
| ----------------- | :------------: | :------: | :----: | :-------: | -------------------- |
| `backgroundColor` | `string` | - | - | `#ED7309` | CSS background-color |
| `borderRadius` | `string` | - | - | `11px` | CSS border-radius |
| `className` | `string` | - | - | - | Accepts class |
| `color` | `string` | - | - | `#FFFFFF` | CSS color |
| `fontSize` | `string` | - | - | `11px` | CSS font-size |
| `fontWeight` | `number` | - | - | `800` | CSS font-weight |
| `id` | `string` | - | - | - | Accepts id |
| `maxWidth` | `string` | - | - | `50px` | CSS max-width |
| `number` | `number` | - | - | `0` | Number value |
| `onClick` | `func` | - | - | - | onClick event |
| `padding` | `string` | - | - | `0 5px` | CSS padding |
| `style` | `obj`, `array` | - | - | - | Accepts css style |

53
web/ASC.Web.Components/src/components/badge/badge.test.js
View File

@ -10,4 +10,57 @@ describe('<Badge />', () => {
expect(wrapper).toExist();
});
it('displays number', () => {
const wrapper = mount(
<Badge number={10} />
);
expect(wrapper.prop('number')).toBe(10);
});
it('call onClick()', () => {
const onClick = jest.fn();
const wrapper = mount(
<Badge onClick={onClick} />
);
wrapper.simulate('click');
expect(onClick).toBeCalled();
});
it('call onClick() without wrapper', () => {
const wrapper = mount(
<Badge />
);
wrapper.simulate('click');
expect(wrapper).toExist();
});
it('accepts id', () => {
const wrapper = mount(
<Badge id="testId" />
);
expect(wrapper.prop('id')).toEqual('testId');
});
it('accepts className', () => {
const wrapper = mount(
<Badge className="test" />
);
expect(wrapper.prop('className')).toEqual('test');
});
it('accepts style', () => {
const wrapper = mount(
<Badge style={{ color: 'red' }} />
);
expect(wrapper.getDOMNode().style).toHaveProperty('color', 'red');
});
});

5
web/ASC.Web.Components/src/components/badge/index.js
View File

@ -40,7 +40,10 @@ Badge.propTypes = {
borderRadius: PropTypes.string,
padding: PropTypes.string,
maxWidth: PropTypes.string,
onClick: PropTypes.func
onClick: PropTypes.func,
className: PropTypes.string,
id: PropTypes.string,
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array])
};
Badge.defaultProps = {