@@ -48,27 +48,123 @@ describe('ToggleButton', () => {
48
48
49
49
describe ( 'ToggleButtonGroup' , ( ) => {
50
50
it ( 'should render checkboxes' , ( ) => {
51
- mount (
51
+ const wrapper = mount (
52
52
< ToggleButtonGroup type = "checkbox" >
53
53
< ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
54
54
< ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
55
55
< ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
56
56
</ ToggleButtonGroup > ,
57
- )
58
- . find ( 'input[type="checkbox"]' )
59
- . length . should . equal ( 3 ) ;
57
+ ) ;
58
+
59
+ wrapper
60
+ . assertSingle ( '.btn-group.btn-group-toggle' )
61
+ . assertNone ( '.btn-group-vertical' ) ;
62
+ wrapper . find ( 'input[type="checkbox"]' ) . length . should . equal ( 3 ) ;
63
+ } ) ;
64
+
65
+ it ( 'should render checkboxes vertically' , ( ) => {
66
+ const wrapper = mount (
67
+ < ToggleButtonGroup type = "checkbox" vertical >
68
+ < ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
69
+ < ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
70
+ < ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
71
+ </ ToggleButtonGroup > ,
72
+ ) ;
73
+
74
+ wrapper
75
+ . assertSingle ( '.btn-group-vertical.btn-group-toggle' )
76
+ . assertNone ( '.btn-group' ) ;
77
+ wrapper . find ( 'input[type="checkbox"]' ) . length . should . equal ( 3 ) ;
78
+ } ) ;
79
+
80
+ it ( 'should render checkboxes vertically and small' , ( ) => {
81
+ const wrapper = mount (
82
+ < ToggleButtonGroup type = "checkbox" vertical size = "sm" >
83
+ < ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
84
+ < ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
85
+ < ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
86
+ </ ToggleButtonGroup > ,
87
+ ) ;
88
+
89
+ wrapper
90
+ . assertSingle ( '.btn-group-vertical.btn-group-sm.btn-group-toggle' )
91
+ . assertNone ( '.btn-group' ) ;
92
+ wrapper . find ( 'input[type="checkbox"]' ) . length . should . equal ( 3 ) ;
93
+ } ) ;
94
+
95
+ it ( 'should render checkboxes vertically and large' , ( ) => {
96
+ const wrapper = mount (
97
+ < ToggleButtonGroup type = "checkbox" vertical size = "lg" >
98
+ < ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
99
+ < ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
100
+ < ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
101
+ </ ToggleButtonGroup > ,
102
+ ) ;
103
+
104
+ wrapper
105
+ . assertSingle ( '.btn-group-vertical.btn-group-lg.btn-group-toggle' )
106
+ . assertNone ( '.btn-group' ) ;
107
+ wrapper . find ( 'input[type="checkbox"]' ) . length . should . equal ( 3 ) ;
60
108
} ) ;
61
109
62
110
it ( 'should render radios' , ( ) => {
63
- mount (
111
+ const wrapper = mount (
64
112
< ToggleButtonGroup type = "radio" name = "items" >
65
113
< ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
66
114
< ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
67
115
< ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
68
116
</ ToggleButtonGroup > ,
69
- )
70
- . find ( 'input[type="radio"]' )
71
- . length . should . equal ( 3 ) ;
117
+ ) ;
118
+
119
+ wrapper
120
+ . assertSingle ( '.btn-group.btn-group-toggle' )
121
+ . assertNone ( 'btn-group-vertical' ) ;
122
+ wrapper . find ( 'input[type="radio"]' ) . length . should . equal ( 3 ) ;
123
+ } ) ;
124
+
125
+ it ( 'should render radios vertically' , ( ) => {
126
+ const wrapper = mount (
127
+ < ToggleButtonGroup type = "radio" name = "items" vertical >
128
+ < ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
129
+ < ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
130
+ < ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
131
+ </ ToggleButtonGroup > ,
132
+ ) ;
133
+
134
+ wrapper
135
+ . assertSingle ( '.btn-group-vertical.btn-group-toggle' )
136
+ . assertNone ( '.btn-group' ) ;
137
+ wrapper . find ( 'input[type="radio"]' ) . length . should . equal ( 3 ) ;
138
+ } ) ;
139
+
140
+ it ( 'should render radios vertically and small' , ( ) => {
141
+ const wrapper = mount (
142
+ < ToggleButtonGroup type = "radio" name = "items" vertical size = "sm" >
143
+ < ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
144
+ < ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
145
+ < ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
146
+ </ ToggleButtonGroup > ,
147
+ ) ;
148
+
149
+ wrapper
150
+ . assertSingle ( '.btn-group-vertical.btn-group-sm.btn-group-toggle' )
151
+ . assertNone ( '.btn-group' ) ;
152
+ wrapper . find ( 'input[type="radio"]' ) . length . should . equal ( 3 ) ;
153
+ } ) ;
154
+
155
+ it ( 'should render radios vertically and large' , ( ) => {
156
+ const wrapper = mount (
157
+ < ToggleButtonGroup type = "radio" name = "items" vertical size = "lg" >
158
+ < ToggleButtonGroup . Button value = { 1 } > Option 1</ ToggleButtonGroup . Button >
159
+ < ToggleButtonGroup . Button value = { 2 } > Option 2</ ToggleButtonGroup . Button >
160
+ < ToggleButtonGroup . Button value = { 3 } > Option 3</ ToggleButtonGroup . Button >
161
+ </ ToggleButtonGroup > ,
162
+ ) ;
163
+
164
+ wrapper
165
+ . assertSingle ( '.btn-group-vertical.btn-group-lg.btn-group-toggle' )
166
+ . assertNone ( '.btn-group' ) ;
167
+ wrapper . find ( 'input[type="radio"]' ) . length . should . equal ( 3 ) ;
72
168
} ) ;
73
169
74
170
it ( 'should select initial values' , ( ) => {
0 commit comments