@@ -242,3 +242,118 @@ it(`mixed #1. desktop-first`, () => {
242
242
243
243
expect ( received ) . toBe ( expected )
244
244
} )
245
+
246
+ it ( `multiline #1. mobile-first` , ( ) => {
247
+ const receivedOrder = [
248
+ `@media (min-width: 48em)
249
+ and (max-width: 59.999em)` ,
250
+ `@media (min-width: 40em)
251
+ and (max-width: 47.999em)` ,
252
+ `@media (min-width: 15em)
253
+ and (max-width: 47.999em)` ,
254
+ `@media (min-width: 2em)
255
+ and (max-width: 47.999em)` ,
256
+ `@media (min-width: 20em)
257
+ and (max-width: 47.999em)` ,
258
+ `@media (min-width: 3em)
259
+ and (max-width: 48.999em)` ,
260
+ `@media (min-width: 31em)
261
+ and (max-width: 48.999em)`
262
+ ]
263
+
264
+ const expectedOrder = [
265
+ `@media (min-width: 2em)
266
+ and (max-width: 47.999em)` ,
267
+ `@media (min-width: 3em)
268
+ and (max-width: 48.999em)` ,
269
+ `@media (min-width: 15em)
270
+ and (max-width: 47.999em)` ,
271
+ `@media (min-width: 20em)
272
+ and (max-width: 47.999em)` ,
273
+ `@media (min-width: 31em)
274
+ and (max-width: 48.999em)` ,
275
+ `@media (min-width: 40em)
276
+ and (max-width: 47.999em)` ,
277
+ `@media (min-width: 48em)
278
+ and (max-width: 59.999em)`
279
+ ]
280
+
281
+ const expected = expectedOrder . join ( '\n' )
282
+ const received = receivedOrder . sort ( sortCSSmq ) . join ( '\n' )
283
+
284
+ expect ( received ) . toBe ( expected )
285
+ } )
286
+
287
+ it ( `multiline #2. mobile-first` , ( ) => {
288
+ // Edge cases
289
+ const receivedOrder = [
290
+ `
291
+
292
+ @media (min-width: 48em)
293
+
294
+
295
+ and (max-width: 59.999em)
296
+
297
+ ` ,
298
+ `
299
+
300
+
301
+ @media (min-width: 40em)
302
+
303
+ and (max-width: 47.999em)
304
+
305
+
306
+ ` ,
307
+ `
308
+
309
+
310
+
311
+ @media (min-width: 15em)
312
+
313
+
314
+
315
+ and (max-width: 47.999em)
316
+
317
+
318
+
319
+ `
320
+ ]
321
+
322
+ const expectedOrder = [
323
+ `
324
+
325
+
326
+
327
+ @media (min-width: 15em)
328
+
329
+
330
+
331
+ and (max-width: 47.999em)
332
+
333
+
334
+
335
+ ` ,
336
+ `
337
+
338
+
339
+ @media (min-width: 40em)
340
+
341
+ and (max-width: 47.999em)
342
+
343
+
344
+ ` ,
345
+ `
346
+
347
+ @media (min-width: 48em)
348
+
349
+
350
+ and (max-width: 59.999em)
351
+
352
+ `
353
+ ]
354
+
355
+ const expected = expectedOrder . join ( '\n' )
356
+ const received = receivedOrder . sort ( sortCSSmq ) . join ( '\n' )
357
+
358
+ expect ( received ) . toBe ( expected )
359
+ } )
0 commit comments