test: added @media at-rules test (#818)

webpack-contrib · Aug 31, 2021 · 1527b06 · 1527b06
1 parent f813b4c
commit 1527b06
Show file tree

Hide file tree

Showing 31 changed files with 118 additions and 0 deletions.
diff --git a/test/cases/at-import-in-entry/a.css → test/cases/at-import-in-the-entry/a.css b/test/cases/at-import-in-entry/a.css → test/cases/at-import-in-the-entry/a.css
diff --git a/test/cases/at-import-in-entry/b.css → test/cases/at-import-in-the-entry/b.css b/test/cases/at-import-in-entry/b.css → test/cases/at-import-in-the-entry/b.css
diff --git a/...ases/at-import-in-entry/expected/main.css → .../at-import-in-the-entry/expected/main.css b/...ases/at-import-in-entry/expected/main.css → .../at-import-in-the-entry/expected/main.css
diff --git a/...ases/at-import-in-entry/webpack.config.js → .../at-import-in-the-entry/webpack.config.js b/...ases/at-import-in-entry/webpack.config.js → .../at-import-in-the-entry/webpack.config.js
diff --git a/test/cases/css-import/a.css → test/cases/at-import-in-the-middle/a.css b/test/cases/css-import/a.css → test/cases/at-import-in-the-middle/a.css
diff --git a/test/cases/css-import/b.css → test/cases/at-import-in-the-middle/b.css b/test/cases/css-import/b.css → test/cases/at-import-in-the-middle/b.css
diff --git a/test/cases/css-import/c.css → test/cases/at-import-in-the-middle/c.css b/test/cases/css-import/c.css → test/cases/at-import-in-the-middle/c.css
diff --git a/test/cases/css-import/expected/main.css → ...at-import-in-the-middle/expected/main.css b/test/cases/css-import/expected/main.css → ...at-import-in-the-middle/expected/main.css
diff --git a/test/cases/css-import/index.css → test/cases/at-import-in-the-middle/index.css b/test/cases/css-import/index.css → test/cases/at-import-in-the-middle/index.css
diff --git a/test/cases/css-import/webpack.config.js → ...at-import-in-the-middle/webpack.config.js b/test/cases/css-import/webpack.config.js → ...at-import-in-the-middle/webpack.config.js
diff --git a/test/cases/at-media/a.css b/test/cases/at-media/a.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 24px;
+}
diff --git a/test/cases/at-media/b.css b/test/cases/at-media/b.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 32px;
+}
diff --git a/test/cases/at-media/c.css b/test/cases/at-media/c.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 64px;
+}
diff --git a/test/cases/at-media/d.css b/test/cases/at-media/d.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 128px;
+}
diff --git a/test/cases/at-media/e.css b/test/cases/at-media/e.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 256px;
+}
diff --git a/test/cases/at-media/expected/main.css b/test/cases/at-media/expected/main.css
@@ -0,0 +1,40 @@
+body {
+  font-size: 24px;
+}
+
+@media screen and (orientation: landscape) {
+body {
+  font-size: 32px;
+}
+
+}
+/*@import url("./c.css") supports(display: flex);*/
+/*@import url("./d.css") supports(display: flex) screen and (min-width: 400px);*/
+/*@import url("./e.css")    supports(   display   :    flex   )    screen    and    (   min-width   :    400px   )   ;*/
+/*@import url("./f.css") supports(not (display: flex));*/
+/*@import url("./g.css") SUPPORTS(NOT (DISPLAY: FLEX));*/
+
+div {
+  color: blue;
+}
+
+@media {
+  div {
+    color: red;
+  }
+}
+
+@media screen and (min-width: 900px) {
+  article {
+    padding: 1rem 3rem;
+  }
+}
+
+@supports (display: flex) {
+  @media screen and (min-width: 900px) {
+    article {
+      display: flex;
+    }
+  }
+}
+
diff --git a/test/cases/at-media/f.css b/test/cases/at-media/f.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 512px;
+}
diff --git a/test/cases/at-media/g.css b/test/cases/at-media/g.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 1024px;
+}
diff --git a/test/cases/at-media/index.js b/test/cases/at-media/index.js
@@ -0,0 +1 @@
+import "./style.css";
diff --git a/test/cases/at-media/style.css b/test/cases/at-media/style.css
@@ -0,0 +1,31 @@
+@import url("./a.css");
+@import url("./b.css") screen and (orientation: landscape);
+/*@import url("./c.css") supports(display: flex);*/
+/*@import url("./d.css") supports(display: flex) screen and (min-width: 400px);*/
+/*@import url("./e.css")    supports(   display   :    flex   )    screen    and    (   min-width   :    400px   )   ;*/
+/*@import url("./f.css") supports(not (display: flex));*/
+/*@import url("./g.css") SUPPORTS(NOT (DISPLAY: FLEX));*/
+
+div {
+  color: blue;
+}
+
+@media {
+  div {
+    color: red;
+  }
+}
+
+@media screen and (min-width: 900px) {
+  article {
+    padding: 1rem 3rem;
+  }
+}
+
+@supports (display: flex) {
+  @media screen and (min-width: 900px) {
+    article {
+      display: flex;
+    }
+  }
+}
diff --git a/test/cases/at-media/webpack.config.js b/test/cases/at-media/webpack.config.js
@@ -0,0 +1,25 @@
+import Self from "../../../src";
+
+module.exports = {
+  entry: "./index.js",
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [
+          {
+            loader: Self.loader,
+          },
+          {
+            loader: "css-loader",
+          },
+        ],
+      },
+    ],
+  },
+  plugins: [
+    new Self({
+      filename: "[name].css",
+    }),
+  ],
+};
diff --git a/...uxiliaryAssets-815babffe97b00a1f30b.woff2 → ...uxiliaryAssets-815babffe97b00a1f30b.woff2 b/...uxiliaryAssets-815babffe97b00a1f30b.woff2 → ...uxiliaryAssets-815babffe97b00a1f30b.woff2
diff --git a/.../auxiliaryAssets-a0de923c946d4ccb38b0.ttf → .../auxiliaryAssets-a0de923c946d4ccb38b0.ttf b/.../auxiliaryAssets-a0de923c946d4ccb38b0.ttf → .../auxiliaryAssets-a0de923c946d4ccb38b0.ttf
diff --git a/...auxiliaryAssets-d4c409dfe110747b1763.woff → ...auxiliaryAssets-d4c409dfe110747b1763.woff b/...auxiliaryAssets-d4c409dfe110747b1763.woff → ...auxiliaryAssets-d4c409dfe110747b1763.woff
diff --git a/test/cases/auxiliaryAssets/fonts.css → test/cases/auxiliary-assets/fonts.css b/test/cases/auxiliaryAssets/fonts.css → test/cases/auxiliary-assets/fonts.css
diff --git a/...iaryAssets/fonts/roboto-v18-latin-300.ttf → ...ary-assets/fonts/roboto-v18-latin-300.ttf b/...iaryAssets/fonts/roboto-v18-latin-300.ttf → ...ary-assets/fonts/roboto-v18-latin-300.ttf
diff --git a/...aryAssets/fonts/roboto-v18-latin-300.woff → ...ry-assets/fonts/roboto-v18-latin-300.woff b/...aryAssets/fonts/roboto-v18-latin-300.woff → ...ry-assets/fonts/roboto-v18-latin-300.woff
diff --git a/...ryAssets/fonts/roboto-v18-latin-300.woff2 → ...y-assets/fonts/roboto-v18-latin-300.woff2 b/...ryAssets/fonts/roboto-v18-latin-300.woff2 → ...y-assets/fonts/roboto-v18-latin-300.woff2
diff --git a/test/cases/auxiliaryAssets/index.js → test/cases/auxiliary-assets/index.js b/test/cases/auxiliaryAssets/index.js → test/cases/auxiliary-assets/index.js
diff --git a/test/cases/auxiliaryAssets/test.filter.js → test/cases/auxiliary-assets/test.filter.js b/test/cases/auxiliaryAssets/test.filter.js → test/cases/auxiliary-assets/test.filter.js
diff --git a/test/cases/auxiliaryAssets/webpack.config.js → .../cases/auxiliary-assets/webpack.config.js b/test/cases/auxiliaryAssets/webpack.config.js → .../cases/auxiliary-assets/webpack.config.js