From 4dde2c09208a3f311f09766188cfa365daf2cfde Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 31 Aug 2021 16:57:55 +0300 Subject: [PATCH 1/2] test: added `@media` at-rules test --- .../a.css | 0 .../b.css | 0 .../expected/main.css | 0 .../webpack.config.js | 0 .../a.css | 0 .../b.css | 0 .../c.css | 0 .../expected/main.css | 0 .../index.css | 0 .../webpack.config.js | 0 test/cases/at-media/a.css | 3 ++ test/cases/at-media/b.css | 3 ++ test/cases/at-media/c.css | 3 ++ test/cases/at-media/d.css | 3 ++ test/cases/at-media/e.css | 3 ++ test/cases/at-media/expected/main.css | 40 ++++++++++++++++++ test/cases/at-media/f.css | 3 ++ test/cases/at-media/g.css | 3 ++ test/cases/at-media/index.js | 1 + test/cases/at-media/style.css | 31 ++++++++++++++ test/cases/at-media/webpack.config.js | 25 +++++++++++ ...auxiliaryAssets-815babffe97b00a1f30b.woff2 | 0 .../auxiliaryAssets-a0de923c946d4ccb38b0.ttf | 0 .../auxiliaryAssets-d4c409dfe110747b1763.woff | 0 .../fonts.css | 0 .../fonts/roboto-v18-latin-300.ttf | Bin .../fonts/roboto-v18-latin-300.woff | Bin .../fonts/roboto-v18-latin-300.woff2 | Bin .../index.js | 0 .../test.filter.js | 0 .../webpack.config.js | 0 31 files changed, 118 insertions(+) rename test/cases/{at-import-in-entry => at-import-in-the-entry}/a.css (100%) rename test/cases/{at-import-in-entry => at-import-in-the-entry}/b.css (100%) rename test/cases/{at-import-in-entry => at-import-in-the-entry}/expected/main.css (100%) rename test/cases/{at-import-in-entry => at-import-in-the-entry}/webpack.config.js (100%) rename test/cases/{css-import => at-import-in-the-middle}/a.css (100%) rename test/cases/{css-import => at-import-in-the-middle}/b.css (100%) rename test/cases/{css-import => at-import-in-the-middle}/c.css (100%) rename test/cases/{css-import => at-import-in-the-middle}/expected/main.css (100%) rename test/cases/{css-import => at-import-in-the-middle}/index.css (100%) rename test/cases/{css-import => at-import-in-the-middle}/webpack.config.js (100%) create mode 100644 test/cases/at-media/a.css create mode 100644 test/cases/at-media/b.css create mode 100644 test/cases/at-media/c.css create mode 100644 test/cases/at-media/d.css create mode 100644 test/cases/at-media/e.css create mode 100644 test/cases/at-media/expected/main.css create mode 100644 test/cases/at-media/f.css create mode 100644 test/cases/at-media/g.css create mode 100644 test/cases/at-media/index.js create mode 100644 test/cases/at-media/style.css create mode 100644 test/cases/at-media/webpack.config.js rename test/cases/{auxiliaryAssets => auxiliary-assets}/expected/auxiliaryAssets-815babffe97b00a1f30b.woff2 (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/expected/auxiliaryAssets-a0de923c946d4ccb38b0.ttf (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/expected/auxiliaryAssets-d4c409dfe110747b1763.woff (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/fonts.css (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/fonts/roboto-v18-latin-300.ttf (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/fonts/roboto-v18-latin-300.woff (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/fonts/roboto-v18-latin-300.woff2 (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/index.js (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/test.filter.js (100%) rename test/cases/{auxiliaryAssets => auxiliary-assets}/webpack.config.js (100%) diff --git a/test/cases/at-import-in-entry/a.css b/test/cases/at-import-in-the-entry/a.css similarity index 100% rename from test/cases/at-import-in-entry/a.css rename to test/cases/at-import-in-the-entry/a.css diff --git a/test/cases/at-import-in-entry/b.css b/test/cases/at-import-in-the-entry/b.css similarity index 100% rename from test/cases/at-import-in-entry/b.css rename to test/cases/at-import-in-the-entry/b.css diff --git a/test/cases/at-import-in-entry/expected/main.css b/test/cases/at-import-in-the-entry/expected/main.css similarity index 100% rename from test/cases/at-import-in-entry/expected/main.css rename to test/cases/at-import-in-the-entry/expected/main.css diff --git a/test/cases/at-import-in-entry/webpack.config.js b/test/cases/at-import-in-the-entry/webpack.config.js similarity index 100% rename from test/cases/at-import-in-entry/webpack.config.js rename to test/cases/at-import-in-the-entry/webpack.config.js diff --git a/test/cases/css-import/a.css b/test/cases/at-import-in-the-middle/a.css similarity index 100% rename from test/cases/css-import/a.css rename to test/cases/at-import-in-the-middle/a.css diff --git a/test/cases/css-import/b.css b/test/cases/at-import-in-the-middle/b.css similarity index 100% rename from test/cases/css-import/b.css rename to test/cases/at-import-in-the-middle/b.css diff --git a/test/cases/css-import/c.css b/test/cases/at-import-in-the-middle/c.css similarity index 100% rename from test/cases/css-import/c.css rename to test/cases/at-import-in-the-middle/c.css diff --git a/test/cases/css-import/expected/main.css b/test/cases/at-import-in-the-middle/expected/main.css similarity index 100% rename from test/cases/css-import/expected/main.css rename to test/cases/at-import-in-the-middle/expected/main.css diff --git a/test/cases/css-import/index.css b/test/cases/at-import-in-the-middle/index.css similarity index 100% rename from test/cases/css-import/index.css rename to test/cases/at-import-in-the-middle/index.css diff --git a/test/cases/css-import/webpack.config.js b/test/cases/at-import-in-the-middle/webpack.config.js similarity index 100% rename from test/cases/css-import/webpack.config.js rename to test/cases/at-import-in-the-middle/webpack.config.js diff --git a/test/cases/at-media/a.css b/test/cases/at-media/a.css new file mode 100644 index 00000000..88a63b4b --- /dev/null +++ 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 new file mode 100644 index 00000000..006df2e2 --- /dev/null +++ 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 new file mode 100644 index 00000000..a0b43b87 --- /dev/null +++ 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 new file mode 100644 index 00000000..a809c529 --- /dev/null +++ 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 new file mode 100644 index 00000000..51aa94f5 --- /dev/null +++ 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 new file mode 100644 index 00000000..e1bef8db --- /dev/null +++ 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 new file mode 100644 index 00000000..4dd03532 --- /dev/null +++ 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 new file mode 100644 index 00000000..96b5b801 --- /dev/null +++ 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 new file mode 100644 index 00000000..4fe51c72 --- /dev/null +++ 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 new file mode 100644 index 00000000..9bd27193 --- /dev/null +++ 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 new file mode 100644 index 00000000..f4931bb5 --- /dev/null +++ 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/test/cases/auxiliaryAssets/expected/auxiliaryAssets-815babffe97b00a1f30b.woff2 b/test/cases/auxiliary-assets/expected/auxiliaryAssets-815babffe97b00a1f30b.woff2 similarity index 100% rename from test/cases/auxiliaryAssets/expected/auxiliaryAssets-815babffe97b00a1f30b.woff2 rename to test/cases/auxiliary-assets/expected/auxiliaryAssets-815babffe97b00a1f30b.woff2 diff --git a/test/cases/auxiliaryAssets/expected/auxiliaryAssets-a0de923c946d4ccb38b0.ttf b/test/cases/auxiliary-assets/expected/auxiliaryAssets-a0de923c946d4ccb38b0.ttf similarity index 100% rename from test/cases/auxiliaryAssets/expected/auxiliaryAssets-a0de923c946d4ccb38b0.ttf rename to test/cases/auxiliary-assets/expected/auxiliaryAssets-a0de923c946d4ccb38b0.ttf diff --git a/test/cases/auxiliaryAssets/expected/auxiliaryAssets-d4c409dfe110747b1763.woff b/test/cases/auxiliary-assets/expected/auxiliaryAssets-d4c409dfe110747b1763.woff similarity index 100% rename from test/cases/auxiliaryAssets/expected/auxiliaryAssets-d4c409dfe110747b1763.woff rename to test/cases/auxiliary-assets/expected/auxiliaryAssets-d4c409dfe110747b1763.woff diff --git a/test/cases/auxiliaryAssets/fonts.css b/test/cases/auxiliary-assets/fonts.css similarity index 100% rename from test/cases/auxiliaryAssets/fonts.css rename to test/cases/auxiliary-assets/fonts.css diff --git a/test/cases/auxiliaryAssets/fonts/roboto-v18-latin-300.ttf b/test/cases/auxiliary-assets/fonts/roboto-v18-latin-300.ttf similarity index 100% rename from test/cases/auxiliaryAssets/fonts/roboto-v18-latin-300.ttf rename to test/cases/auxiliary-assets/fonts/roboto-v18-latin-300.ttf diff --git a/test/cases/auxiliaryAssets/fonts/roboto-v18-latin-300.woff b/test/cases/auxiliary-assets/fonts/roboto-v18-latin-300.woff similarity index 100% rename from test/cases/auxiliaryAssets/fonts/roboto-v18-latin-300.woff rename to test/cases/auxiliary-assets/fonts/roboto-v18-latin-300.woff diff --git a/test/cases/auxiliaryAssets/fonts/roboto-v18-latin-300.woff2 b/test/cases/auxiliary-assets/fonts/roboto-v18-latin-300.woff2 similarity index 100% rename from test/cases/auxiliaryAssets/fonts/roboto-v18-latin-300.woff2 rename to test/cases/auxiliary-assets/fonts/roboto-v18-latin-300.woff2 diff --git a/test/cases/auxiliaryAssets/index.js b/test/cases/auxiliary-assets/index.js similarity index 100% rename from test/cases/auxiliaryAssets/index.js rename to test/cases/auxiliary-assets/index.js diff --git a/test/cases/auxiliaryAssets/test.filter.js b/test/cases/auxiliary-assets/test.filter.js similarity index 100% rename from test/cases/auxiliaryAssets/test.filter.js rename to test/cases/auxiliary-assets/test.filter.js diff --git a/test/cases/auxiliaryAssets/webpack.config.js b/test/cases/auxiliary-assets/webpack.config.js similarity index 100% rename from test/cases/auxiliaryAssets/webpack.config.js rename to test/cases/auxiliary-assets/webpack.config.js From e230cd785df7228e4151ecae5bb134269392ab1b Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 31 Aug 2021 17:01:41 +0300 Subject: [PATCH 2/2] test: fix --- test/cases/at-media/expected/main.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/test/cases/at-media/expected/main.css b/test/cases/at-media/expected/main.css index e1bef8db..ac12f826 100644 --- a/test/cases/at-media/expected/main.css +++ b/test/cases/at-media/expected/main.css @@ -1,10 +1,10 @@ body { - font-size: 24px; + font-size: 24px; } @media screen and (orientation: landscape) { body { - font-size: 32px; + font-size: 32px; } }