[core] Polish Stack test to closer CSS injection order

mui · Jul 29, 2023 · a0d2b0d · a0d2b0d
1 parent fd73f71
commit a0d2b0d
Showing 1 changed file with 42 additions and 42 deletions.
diff --git a/packages/mui-system/src/Stack/Stack.test.js b/packages/mui-system/src/Stack/Stack.test.js
@@ -29,30 +29,30 @@ describe('<Stack />', () => {
       }),
     ).to.deep.equal({
       '@media (min-width:0px)': {
-        '& > :not(style) ~ :not(style)': {
-          marginTop: '8px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginTop: '8px',
+        },
         flexDirection: 'column',
       },
       [`@media (min-width:${theme.breakpoints.values.sm}px)`]: {
-        '& > :not(style) ~ :not(style)': {
-          marginLeft: '16px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginLeft: '16px',
+        },
         flexDirection: 'row',
       },
       [`@media (min-width:${theme.breakpoints.values.md}px)`]: {
-        '& > :not(style) ~ :not(style)': {
-          marginLeft: '32px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginLeft: '32px',
+        },
       },
       display: 'flex',
       flexDirection: 'column',
@@ -70,21 +70,21 @@ describe('<Stack />', () => {
       }),
     ).to.deep.equal({
       [`@media (min-width:${theme.breakpoints.values.sm}px)`]: {
-        '& > :not(style) ~ :not(style)': {
-          marginTop: '16px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginTop: '16px',
+        },
         flexDirection: 'column',
       },
       [`@media (min-width:${theme.breakpoints.values.md}px)`]: {
-        '& > :not(style) ~ :not(style)': {
-          marginLeft: '16px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginLeft: '16px',
+        },
         flexDirection: 'row',
       },
       display: 'flex',
@@ -103,20 +103,20 @@ describe('<Stack />', () => {
       }),
     ).to.deep.equal({
       [`@media (min-width:${theme.breakpoints.values.sm}px)`]: {
+        '& > :not(style):not(style)': {
+          margin: 0,
+        },
         '& > :not(style) ~ :not(style)': {
           marginTop: '16px',
         },
+      },
+      [`@media (min-width:${theme.breakpoints.values.md}px)`]: {
         '& > :not(style):not(style)': {
           margin: 0,
         },
-      },
-      [`@media (min-width:${theme.breakpoints.values.md}px)`]: {
         '& > :not(style) ~ :not(style)': {
           marginTop: '32px',
         },
-        '& > :not(style):not(style)': {
-          margin: 0,
-        },
       },
       display: 'flex',
       flexDirection: 'column',
@@ -134,28 +134,28 @@ describe('<Stack />', () => {
       }),
     ).to.deep.equal({
       [`@media (min-width:${theme.breakpoints.values.sm}px)`]: {
+        '& > :not(style):not(style)': {
+          margin: 0,
+        },
         '& > :not(style) ~ :not(style)': {
           marginTop: '16px',
         },
+      },
+      [`@media (min-width:${theme.breakpoints.values.md}px)`]: {
         '& > :not(style):not(style)': {
           margin: 0,
         },
-      },
-      [`@media (min-width:${theme.breakpoints.values.md}px)`]: {
         '& > :not(style) ~ :not(style)': {
           marginTop: '0px',
         },
+      },
+      [`@media (min-width:${theme.breakpoints.values.lg}px)`]: {
         '& > :not(style):not(style)': {
           margin: 0,
         },
-      },
-      [`@media (min-width:${theme.breakpoints.values.lg}px)`]: {
         '& > :not(style) ~ :not(style)': {
           marginTop: '32px',
         },
-        '& > :not(style):not(style)': {
-          margin: 0,
-        },
       },
       display: 'flex',
       flexDirection: 'column',
@@ -172,12 +172,12 @@ describe('<Stack />', () => {
         theme,
       }),
     ).to.deep.equal({
-      '& > :not(style) ~ :not(style)': {
-        marginLeft: '24px',
-      },
       '& > :not(style):not(style)': {
         margin: 0,
       },
+      '& > :not(style) ~ :not(style)': {
+        marginLeft: '24px',
+      },
       display: 'flex',
       flexDirection: 'row',
     });
@@ -194,21 +194,21 @@ describe('<Stack />', () => {
       }),
     ).to.deep.equal({
       '@media (min-width:0px)': {
-        '& > :not(style) ~ :not(style)': {
-          marginTop: '8px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginTop: '8px',
+        },
         flexDirection: 'column',
       },
       [`@media (min-width:${theme.breakpoints.values.lg}px)`]: {
-        '& > :not(style) ~ :not(style)': {
-          marginTop: '16px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginTop: '16px',
+        },
       },
       display: 'flex',
       flexDirection: 'column',
@@ -226,12 +226,12 @@ describe('<Stack />', () => {
           theme,
         }),
       ).to.deep.equal({
-        '& > :not(style) ~ :not(style)': {
-          marginBottom: '8px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginBottom: '8px',
+        },
         display: 'flex',
         flexDirection: 'column-reverse',
       });
@@ -461,12 +461,12 @@ describe('<Stack />', () => {
           theme: customTheme,
         }),
       ).to.deep.equal({
-        '& > :not(style) ~ :not(style)': {
-          marginTop: '32px',
-        },
         '& > :not(style):not(style)': {
           margin: 0,
         },
+        '& > :not(style) ~ :not(style)': {
+          marginTop: '32px',
+        },
         display: 'flex',
         flexDirection: 'column',
       });