@@ -2,6 +2,7 @@ import { mount } from '@vue/test-utils';
22import { asyncExpect } from '@/tests/utils' ;
33import Radio from '../Radio' ;
44import RadioGroup from '../Group' ;
5+ import RadioButton from '../radioButton' ;
56
67describe ( 'Radio' , ( ) => {
78 function createRadioGroup ( props , listeners = { } ) {
@@ -50,10 +51,16 @@ describe('Radio', () => {
5051 } ,
5152 } ) ;
5253
53- wrapper . trigger ( 'mouseenter' ) ;
54+ wrapper
55+ . findAll ( 'div' )
56+ . at ( 0 )
57+ . trigger ( 'mouseenter' ) ;
5458 expect ( onMouseEnter ) . toHaveBeenCalled ( ) ;
5559
56- wrapper . trigger ( 'mouseleave' ) ;
60+ wrapper
61+ . findAll ( 'div' )
62+ . at ( 0 )
63+ . trigger ( 'mouseleave' ) ;
5764 expect ( onMouseLeave ) . toHaveBeenCalled ( ) ;
5865 } ) ;
5966
@@ -89,6 +96,80 @@ describe('Radio', () => {
8996 } ) ;
9097 } ) ;
9198
99+ it ( 'both of radio and radioGroup will trigger onchange event when they exists' , async ( ) => {
100+ const onChange = jest . fn ( ) ;
101+ const onChangeRadioGroup = jest . fn ( ) ;
102+
103+ const wrapper = mount (
104+ {
105+ props : [ 'value' ] ,
106+ render ( ) {
107+ const groupProps = { } ;
108+ if ( this . value !== undefined ) {
109+ groupProps . value = this . value ;
110+ }
111+ return (
112+ < RadioGroup ref = "radioGroup" { ...groupProps } onChange = { onChangeRadioGroup } >
113+ < Radio value = "A" onChange = { onChange } >
114+ A
115+ </ Radio >
116+ < Radio value = "B" onChange = { onChange } >
117+ B
118+ </ Radio >
119+ < Radio value = "C" onChange = { onChange } >
120+ C
121+ </ Radio >
122+ </ RadioGroup >
123+ ) ;
124+ } ,
125+ } ,
126+ { sync : false } ,
127+ ) ;
128+ const radios = wrapper . findAll ( 'input' ) ;
129+
130+ // uncontrolled component
131+ wrapper . vm . $refs . radioGroup . stateValue = 'B' ;
132+ radios . at ( 0 ) . trigger ( 'change' ) ;
133+ expect ( onChange . mock . calls . length ) . toBe ( 1 ) ;
134+ expect ( onChangeRadioGroup . mock . calls . length ) . toBe ( 1 ) ;
135+
136+ // controlled component
137+ wrapper . setProps ( { value : 'A' } ) ;
138+ radios . at ( 1 ) . trigger ( 'change' ) ;
139+ expect ( onChange . mock . calls . length ) . toBe ( 2 ) ;
140+ } ) ;
141+
142+ it ( 'Trigger onChange when both of radioButton and radioGroup exists' , ( ) => {
143+ const onChange = jest . fn ( ) ;
144+ const props = { } ;
145+ const wrapper = mount (
146+ createRadioGroup ( props , {
147+ change : onChange ,
148+ } ) ,
149+ { sync : false } ,
150+ ) ;
151+ const radios = wrapper . findAll ( 'input' ) ;
152+
153+ // uncontrolled component
154+ wrapper . vm . $refs . radioGroup . stateValue = 'B' ;
155+ radios . at ( 0 ) . trigger ( 'change' ) ;
156+ expect ( onChange . mock . calls . length ) . toBe ( 1 ) ;
157+
158+ // controlled component
159+ wrapper . setProps ( { value : 'A' } ) ;
160+ radios . at ( 1 ) . trigger ( 'change' ) ;
161+ expect ( onChange . mock . calls . length ) . toBe ( 2 ) ;
162+ } ) ;
163+
164+ // it('should only trigger once when in group with options', () => {
165+ // const onChange = jest.fn();
166+ // const options = [{ label: 'Bamboo', value: 'Bamboo' }];
167+ // const wrapper = mount(<RadioGroup options={options} onChange={onChange} />);
168+
169+ // wrapper.find('input').trigger('change');
170+ // expect(onChange).toHaveBeenCalledTimes(1);
171+ // });
172+
92173 // it('won\'t fire change events when value not changes', async () => {
93174 // const onChange = jest.fn()
94175
0 commit comments