@@ -156,6 +156,27 @@ test('it can generate first-child variants', () => {
156156 } )
157157} )
158158
159+ test ( 'it can generate odd variants' , ( ) => {
160+ const input = `
161+ @variants odd {
162+ .banana { color: yellow; }
163+ .chocolate { color: brown; }
164+ }
165+ `
166+
167+ const output = `
168+ .banana { color: yellow; }
169+ .chocolate { color: brown; }
170+ .odd\\:banana:nth-child(odd) { color: yellow; }
171+ .odd\\:chocolate:nth-child(odd) { color: brown; }
172+ `
173+
174+ return run ( input ) . then ( result => {
175+ expect ( result . css ) . toMatchCss ( output )
176+ expect ( result . warnings ( ) . length ) . toBe ( 0 )
177+ } )
178+ } )
179+
159180test ( 'it can generate last-child variants' , ( ) => {
160181 const input = `
161182 @variants last {
@@ -177,6 +198,27 @@ test('it can generate last-child variants', () => {
177198 } )
178199} )
179200
201+ test ( 'it can generate even variants' , ( ) => {
202+ const input = `
203+ @variants even {
204+ .banana { color: yellow; }
205+ .chocolate { color: brown; }
206+ }
207+ `
208+
209+ const output = `
210+ .banana { color: yellow; }
211+ .chocolate { color: brown; }
212+ .even\\:banana:nth-child(even) { color: yellow; }
213+ .even\\:chocolate:nth-child(even) { color: brown; }
214+ `
215+
216+ return run ( input ) . then ( result => {
217+ expect ( result . css ) . toMatchCss ( output )
218+ expect ( result . warnings ( ) . length ) . toBe ( 0 )
219+ } )
220+ } )
221+
180222test ( 'it can generate group-hover variants' , ( ) => {
181223 const input = `
182224 @variants group-hover {
0 commit comments