Skip to content

Commit 1a03460

Browse files
committed
feat(src): add className prop and related testing
1 parent fb65f52 commit 1a03460

File tree

3 files changed

+24
-3
lines changed

3 files changed

+24
-3
lines changed

examples/stories/example.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ class Example extends PureComponent {
1515
是否开启: {this.state.value1 ? 'YES' : 'NO'}
1616
</div>
1717
<Switch
18+
className="hello"
1819
isChecked={this.state.value1}
1920
onChange={this.handleChange('value1')}
2021
/>

src/Switch.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,10 @@ import clx from 'classnames'
22
import React, { PureComponent } from 'react'
33

44
interface Props {
5+
/**
6+
* custom className
7+
**/
8+
className?: string
59
/**
610
* whether the switch is checked or not
711
**/
@@ -15,12 +19,13 @@ interface Props {
1519

1620
export class Switch extends PureComponent<Props, {}> {
1721
render() {
18-
const isChecked = this.props.isChecked
22+
const { isChecked, className } = this.props
1923
const switchClass = clx(
2024
{
2125
'or-switch-checked': isChecked
2226
},
23-
'or-switch'
27+
'or-switch',
28+
className
2429
)
2530
return (
2631
<div className={switchClass} onClick={this.handleClick}>

tests/Switch.test.tsx

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,14 @@ import Switch from '../src'
66
const mockCallBack = jest.fn()
77
let wrapper
88
describe('src/index', () => {
9+
describe('should render properly', () => {
10+
it('#className', () => {
11+
wrapper = mount(<SwitchWrapper defaultChecked={true} className="hello" />)
12+
expect(wrapper.find('.or-switch').length).toBe(1)
13+
expect(wrapper.find('.or-switch').hasClass('hello')).toBe(true)
14+
})
15+
})
16+
917
describe('defalult checked', () => {
1018
beforeEach(() => {
1119
wrapper = mount(<SwitchWrapper defaultChecked={true} />)
@@ -65,6 +73,7 @@ describe('src/index', () => {
6573

6674
interface Props {
6775
defaultChecked: boolean
76+
className?: string
6877
}
6978

7079
class SwitchWrapper extends PureComponent<Props, {}> {
@@ -73,7 +82,13 @@ class SwitchWrapper extends PureComponent<Props, {}> {
7382
}
7483

7584
render() {
76-
return <Switch isChecked={this.state.value} onChange={this.handleChange} />
85+
return (
86+
<Switch
87+
isChecked={this.state.value}
88+
className={this.props.className}
89+
onChange={this.handleChange}
90+
/>
91+
)
7792
}
7893

7994
handleChange = isChecked => {

0 commit comments

Comments
 (0)