From e78d23d193585bb088f71602a33340d0a1ed1601 Mon Sep 17 00:00:00 2001 From: Alexander Akait <4567934+alexander-akait@users.noreply.github.com> Date: Wed, 20 Jul 2022 06:12:40 +0300 Subject: [PATCH] feat(css/prefixer): Implement `preset-env` (#5247) --- Cargo.lock | 4 + crates/swc_css_prefixer/Cargo.toml | 6 +- .../data/prefixes_and_browsers.json | 2093 +++++++++++++++++ crates/swc_css_prefixer/src/lib.rs | 1 + crates/swc_css_prefixer/src/options.rs | 15 + crates/swc_css_prefixer/src/prefixer.rs | 774 +++--- .../output.defaults-not-ie-11.css | 12 + .../animation/output.defaults-not-ie-11.css | 28 + .../any-link/output.defaults-not-ie-11.css | 9 + .../appearance/output.defaults-not-ie-11.css | 8 + .../autofill/output.defaults-not-ie-11.css | 12 + .../output.defaults-not-ie-11.css | 4 + .../backdrop/output.defaults-not-ie-11.css | 9 + .../output.defaults-not-ie-11.css | 4 + .../output.defaults-not-ie-11.css | 7 + .../output.defaults-not-ie-11.css | 12 + .../output.defaults-not-ie-11.css | 12 + .../background/output.defaults-not-ie-11.css | 23 + .../basic/output.defaults-not-ie-11.css | 18 + .../output.defaults-not-ie-11.css | 6 + .../output.defaults-not-ie-11.css | 7 + .../output.defaults-not-ie-11.css | 4 + .../box-shadow/output.defaults-not-ie-11.css | 3 + .../box-sizing/output.defaults-not-ie-11.css | 3 + .../calc/output.defaults-not-ie-11.css | 18 + .../output.defaults-not-ie-11.css | 8 + .../check-down/output.defaults-not-ie-11.css | 4 + .../clip-path/output.defaults-not-ie-11.css | 4 + .../output.defaults-not-ie-11.css | 8 + .../color/output.defaults-not-ie-11.css | 3 + .../columns/output.defaults-not-ie-11.css | 30 + .../cross-fade/output.defaults-not-ie-11.css | 45 + .../css-regions/output.defaults-not-ie-11.css | 9 + .../cursor/output.defaults-not-ie-11.css | 47 + .../display/output.defaults-not-ie-11.css | 44 + .../output.defaults-not-ie-11.css | 24 + .../element/output.defaults-not-ie-11.css | 13 + .../output.defaults-not-ie-11.css | 7 + .../output.defaults-not-ie-11.css | 18 + .../filter/output.defaults-not-ie-11.css | 20 + .../flex/output.defaults-not-ie-11.css | 387 +++ .../output.defaults-not-ie-11.css | 9 + .../output.defaults-not-ie-11.css | 3 + .../output.defaults-not-ie-11.css | 4 + .../fullscreen/output.defaults-not-ie-11.css | 12 + .../gradient/output.defaults-not-ie-11.css | 231 ++ .../output.defaults-not-ie-11.css | 89 + .../hyphens/output.defaults-not-ie-11.css | 4 + .../output.defaults-not-ie-11.css | 23 + .../image-set/output.defaults-not-ie-11.css | 42 + .../important/output.defaults-not-ie-11.css | 3 + .../output.defaults-not-ie-11.css | 18 + .../keyframes/output.defaults-not-ie-11.css | 109 + .../output.defaults-not-ie-11.css | 39 + .../mask/output.defaults-not-ie-11.css | 79 + .../min-zoom/output.defaults-not-ie-11.css | 3 + .../multicolumn/output.defaults-not-ie-11.css | 46 + .../nested/output.defaults-not-ie-11.css | 215 ++ .../object-fit/output.defaults-not-ie-11.css | 6 + .../overflow/output.defaults-not-ie-11.css | 3 + .../output.defaults-not-ie-11.css | 12 + .../perspective/output.defaults-not-ie-11.css | 6 + .../output.defaults-not-ie-11.css | 9 + .../placeholder/output.defaults-not-ie-11.css | 82 + .../position/output.defaults-not-ie-11.css | 7 + .../prefixed/output.defaults-not-ie-11.css | 101 + .../output.defaults-not-ie-11.css | 10 + .../read-only/output.defaults-not-ie-11.css | 6 + .../read-write/output.defaults-not-ie-11.css | 14 + .../recovery/output.defaults-not-ie-11.css | 32 + .../resolution/output.defaults-not-ie-11.css | 76 + .../selection/output.defaults-not-ie-11.css | 18 + .../output.defaults-not-ie-11.css | 3 + .../output.defaults-not-ie-11.css | 3 + .../shapes/output.defaults-not-ie-11.css | 9 + .../snappoints/output.defaults-not-ie-11.css | 15 + .../style-block/output.defaults-not-ie-11.css | 36 + .../tab-size/output.defaults-not-ie-11.css | 3 + .../output.defaults-not-ie-11.css | 3 + .../output.defaults-not-ie-11.css | 32 + .../tests/fixture/text-emphasis/output.css | 3 +- .../output.defaults-not-ie-11.css | 36 + .../output.defaults-not-ie-11.css | 6 + .../output.defaults-not-ie-11.css | 9 + .../output.defaults-not-ie-11.css | 3 + .../output.defaults-not-ie-11.css | 6 + .../transform/output.defaults-not-ie-11.css | 43 + .../transition/output.defaults-not-ie-11.css | 147 ++ .../user-select/output.defaults-not-ie-11.css | 17 + .../viewport/output.defaults-not-ie-11.css | 12 + .../width-size/output.defaults-not-ie-11.css | 109 + .../width/output.defaults-not-ie-11.css | 96 + .../output.defaults-not-ie-11.css | 110 + crates/swc_css_prefixer/tests/prefixer.rs | 32 +- 94 files changed, 5467 insertions(+), 340 deletions(-) create mode 100644 crates/swc_css_prefixer/data/prefixes_and_browsers.json create mode 100644 crates/swc_css_prefixer/src/options.rs create mode 100644 crates/swc_css_prefixer/tests/fixture/advanced-filter/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/animation/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/any-link/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/appearance/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/autofill/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/backdrop-filter/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/backdrop/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/backface-visibility/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/background-clip/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/background-img-opts/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/background-size/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/background/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/basic/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/border-image/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/border-radius/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/box-decoration-break/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/box-shadow/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/box-sizing/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/calc/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/case-insensivity/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/check-down/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/clip-path/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/color-adjust/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/color/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/columns/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/cross-fade/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/css-regions/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/cursor/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/display/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/duplicate-at-rule/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/element/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/error-recovery/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/file-selector-button/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/filter/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/flex/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/font-feature/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/font-kerning/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/forced-color-adjust/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/fullscreen/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/gradient/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/grouping-rule/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/hyphens/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/image-rendering/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/image-set/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/important/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/isolate-override/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/keyframes/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/margid-border-padding-logical/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/mask/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/min-zoom/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/multicolumn/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/nested/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/object-fit/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/overflow/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/overscroll-behavior/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/perspective/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/placeholder-shown/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/placeholder/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/position/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/prefixed/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/print-color-adjust/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/read-only/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/read-write/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/recovery/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/resolution/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/selection/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/selector-list-2/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/selector-list/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/shapes/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/snappoints/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/style-block/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/tab-size/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/text-align-last/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/text-decoration/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/text-emphasis/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/text-orientation/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/text-size-adjust/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/text-spacing/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/touch-action/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/transform/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/transition/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/user-select/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/viewport/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/width-size/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/width/output.defaults-not-ie-11.css create mode 100644 crates/swc_css_prefixer/tests/fixture/writing-mode/output.defaults-not-ie-11.css diff --git a/Cargo.lock b/Cargo.lock index 01f0587bcbe..fe985bfb5b3 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -3251,6 +3251,10 @@ dependencies = [ name = "swc_css_prefixer" version = "0.109.0" dependencies = [ + "once_cell", + "preset_env_base", + "serde", + "serde_json", "swc_atoms", "swc_common", "swc_css_ast", diff --git a/crates/swc_css_prefixer/Cargo.toml b/crates/swc_css_prefixer/Cargo.toml index 249190335ac..92455101d4a 100644 --- a/crates/swc_css_prefixer/Cargo.toml +++ b/crates/swc_css_prefixer/Cargo.toml @@ -3,7 +3,7 @@ authors = ["강동윤 "] description = "Port of stylis" documentation = "https://rustdoc.swc.rs/swc_stylis/" edition = "2021" -include = ["Cargo.toml", "src/**/*.rs"] +include = ["Cargo.toml", "src/**/*.rs", "src/**/*.json"] license = "Apache-2.0" name = "swc_css_prefixer" repository = "https://github.com/swc-project/swc.git" @@ -13,6 +13,10 @@ version = "0.109.0" bench = false [dependencies] +once_cell = "1.10.0" +preset_env_base = { version = "0.2.0", path = "../preset_env_base" } +serde = { version = "1.0.118", features = ["derive"] } +serde_json = "1.0.61" swc_atoms = { version = "0.2.7", path = "../swc_atoms" } swc_common = { version = "0.24.0", path = "../swc_common" } swc_css_ast = { version = "0.100.0", path = "../swc_css_ast" } diff --git a/crates/swc_css_prefixer/data/prefixes_and_browsers.json b/crates/swc_css_prefixer/data/prefixes_and_browsers.json new file mode 100644 index 00000000000..16ad08b089b --- /dev/null +++ b/crates/swc_css_prefixer/data/prefixes_and_browsers.json @@ -0,0 +1,2093 @@ +{ + "-webkit-appearance": [ + { + "android": "2.2", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "14.7", + "opera": "72", + "safari": "15", + "samsung": "14.0" + } + ], + "-moz-appearance": [ + { + "firefox": "2" + }, + { + "firefox": "79" + } + ], + "-ms-appearance": [ + { + "edge": "12" + }, + { + "edge": "18" + } + ], + + "-webkit-animation": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-name": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-name": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-name": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-duration": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-duration": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-duration": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-delay": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-delay": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-delay": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-direction": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-direction": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-direction": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-fill-mode": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-fill-mode": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-fill-mode": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-iteration-count": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-iteration-count": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-iteration-count": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-play-state": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-play-state": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-play-state": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + "-webkit-animation-timing-function": [ + { + "android": "2.1", + "chrome": "42", + "edge": "79", + "ios": "3.2", + "safari": "5" + }, + { + "android": "4.4.4", + "chrome": "83", + "edge": "83", + "ios": "8.4", + "safari": "8" + } + ], + "-moz-animation-timing-function": [ + { + "firefox": "5" + }, + { + "firefox": "15" + } + ], + "-o-animation-timing-function": [ + { + "opera": "12" + }, + { + "opera": "29" + } + ], + + "-webkit-box-sizing": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "3", + "chrome": "9", + "ios": "4.3", + "safari": "5" + } + ], + "-moz-box-sizing": [ + { + "firefox": "2" + }, + { + "firefox": "28" + } + ], + + "-webkit-columns": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-columns": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-width": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-width": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-gap": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-gap": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-rule": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-rule": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-rule-color": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-rule-color": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-rule-width": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-rule-width": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-count": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-count": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-rule-style": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-rule-style": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-span": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-span": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + "-webkit-column-fill": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "49", + "ios": "8.4", + "opera": "36", + "safari": "8", + "samsung": "4" + } + ], + "-moz-column-fill": [ + { + "firefox": "2" + }, + { + "firefox": "51" + } + ], + + "-webkit-mask-clip": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-composite": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-image": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-origin": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-repeat": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-border-repeat": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-border-source": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-position": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-size": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-border": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-border-outset": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-border-width": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + "-webkit-mask-border-slice": [ + { + "and_chr": "92", + "android": "2.1", + "chrome": "4", + "edge": "79", + "ios": "3.2", + "op_mob": "64", + "opera": "15", + "safari": "4", + "samsung": "4" + }, + { + "ios": "15.3", + "safari": "15.3" + } + ], + + "-webkit-border-start": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-moz-border-start": [ + { + "firefox": "4" + }, + { + "firefox": "40" + } + ], + "-webkit-border-end": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-moz-border-end": [ + { + "firefox": "4" + }, + { + "firefox": "40" + } + ], + + "-webkit-margin-start": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-moz-margin-start": [ + { + "firefox": "4" + }, + { + "firefox": "40" + } + ], + "-webkit-margin-end": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-moz-margin-end": [ + { + "firefox": "4" + }, + { + "firefox": "40" + } + ], + + "-webkit-padding-start": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-moz-padding-start": [ + { + "firefox": "4" + }, + { + "firefox": "40" + } + ], + "-webkit-padding-end": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-moz-padding-end": [ + { + "firefox": "4" + }, + { + "firefox": "40" + } + ], + + "-webkit-border-before": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-webkit-border-after": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + + "-webkit-margin-before": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-webkit-margin-after": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + + "-webkit-padding-before": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + "-webkit-padding-after": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "68", + "ios": "12.1", + "opera": "55", + "safari": "12", + "samsung": "9.2" + } + ], + + "-webkit-backface-visibility": [ + { + "android": "3", + "chrome": "12", + "ios": "5", + "opera": "15", + "safari": "5.1" + }, + { + "android": "4.4.4", + "chrome": "35", + "ios": "15.3", + "opera": "22", + "safari": "15.3" + } + ], + "-moz-backface-visibility": [ + { + "firefox": "10" + }, + { + "firefox": "15" + } + ], + + "-webkit-clip-path": [ + { + "android": "4.4", + "chrome": "24", + "ios": "7.0", + "opera": "15", + "safari": "7", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "54", + "ios": "12.5", + "opera": "41", + "safari": "13", + "samsung": "17.0" + } + ], + + "-ms-touch-action": [ + { + "ie": "10" + }, + { + "ie": "10" + } + ], + + "-webkit-text-orientation": [ + { + "safari": "10.1" + }, + { + "safari": "13.1" + } + ], + + "-ms-text-spacing": [ + { + "edge": "12", + "ie": "8" + }, + { + "edge": "18", + "ie": "11" + } + ], + + "-webkit-text-emphasis": [ + { + "android": "4.4", + "chrome": "25", + "edge": "79", + "op_mob": "64", + "opera": "15", + "safari": "6.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "98", + "edge": "98", + "opera": "85", + "safari": "7", + "samsung": "17.0" + } + ], + "-webkit-text-emphasis-position": [ + { + "android": "4.4", + "chrome": "25", + "edge": "79", + "op_mob": "64", + "opera": "15", + "safari": "6.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "98", + "edge": "98", + "opera": "85", + "safari": "7", + "samsung": "17.0" + } + ], + "-webkit-text-emphasis-style": [ + { + "android": "4.4", + "chrome": "25", + "edge": "79", + "op_mob": "64", + "opera": "15", + "safari": "6.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "98", + "edge": "98", + "opera": "85", + "safari": "7", + "samsung": "17.0" + } + ], + "-webkit-text-emphasis-color": [ + { + "android": "4.4", + "chrome": "25", + "edge": "79", + "op_mob": "64", + "opera": "15", + "safari": "6.1", + "samsung": "4" + }, + { + "android": "4.4.4", + "chrome": "98", + "edge": "98", + "opera": "85", + "safari": "7", + "samsung": "17.0" + } + ], + + "-webkit-flow-into": [ + { + "chrome": "15", + "edge": "12", + "ios": "7.0", + "safari": "6.1" + }, + { + "chrome": "18", + "edge": "18", + "ios": "11.2", + "safari": "11" + } + ], + "-ms-flow-into": [ + { + "ie": "10" + }, + { + "ie": "11" + } + ], + "-webkit-flow-from": [ + { + "chrome": "15", + "edge": "12", + "ios": "7.0", + "safari": "6.1" + }, + { + "chrome": "18", + "edge": "18", + "ios": "11.2", + "safari": "11" + } + ], + "-ms-flow-from": [ + { + "ie": "10" + }, + { + "ie": "11" + } + ], + "-webkit-region-fragment": [ + { + "chrome": "15", + "edge": "12", + "ios": "7.0", + "safari": "6.1" + }, + { + "chrome": "18", + "edge": "18", + "ios": "11.2", + "safari": "11" + } + ], + "-ms-region-fragment": [ + { + "ie": "10" + }, + { + "ie": "11" + } + ], + + "-webkit-scroll-snap-type": [ + { + "ios": "9.0", + "safari": "9" + }, + { + "ios": "10.3", + "safari": "10.1" + } + ], + "-ms-scroll-snap-type": [ + { + "edge": "12" + }, + { + "edge": "18" + } + ], + "-webkit-scroll-snap-coordinate": [ + { + "ios": "9.0", + "safari": "9" + }, + { + "ios": "10.3", + "safari": "10.1" + } + ], + "-ms-scroll-snap-coordinate": [ + { + "edge": "12" + }, + { + "edge": "18" + } + ], + "-webkit-scroll-snap-destination": [ + { + "ios": "9.0", + "safari": "9" + }, + { + "ios": "10.3", + "safari": "10.1" + } + ], + "-ms-scroll-snap-destination": [ + { + "edge": "12" + }, + { + "edge": "18" + } + ], + "-webkit-scroll-snap-points-x": [ + { + "ios": "9.0", + "safari": "9" + }, + { + "ios": "10.3", + "safari": "10.1" + } + ], + "-ms-scroll-snap-points-x": [ + { + "edge": "12" + }, + { + "edge": "18" + } + ], + "-webkit-scroll-snap-points-y": [ + { + "ios": "9.0", + "safari": "9" + }, + { + "ios": "10.3", + "safari": "10.1" + } + ], + "-ms-scroll-snap-points-y": [ + { + "edge": "12" + }, + { + "edge": "18" + } + ], + + "-moz-text-align-last": [ + { + "firefox": "12" + }, + { + "firefox": "48" + } + ], + + "-o-text-overflow": [ + { + "op_mob": "10", + "opera": "9" + }, + { + "op_mob": "12", + "opera": "10.6" + } + ], + + "-webkit-shape-margin": [ + { + "ios": "8", + "safari": "7.1" + }, + { + "ios": "10.2", + "safari": "10" + } + ], + "-webkit-shape-outside": [ + { + "ios": "8", + "safari": "7.1" + }, + { + "ios": "10.2", + "safari": "10" + } + ], + "-webkit-shape-image-threshold": [ + { + "ios": "8", + "safari": "7.1" + }, + { + "ios": "10.2", + "safari": "10" + } + ], + + "-o-object-fit": [ + { + "op_mob": "11", + "opera": "10.6" + }, + { + "op_mob": "12.1", + "opera": "12.1" + } + ], + "-o-object-position": [ + { + "op_mob": "11", + "opera": "10.6" + }, + { + "op_mob": "12.1", + "opera": "12.1" + } + ], + + "-moz-tab-size": [ + { + "firefox": "4" + }, + { + "firefox": "90" + } + ], + "-o-tab-size": [ + { + "op_mob": "11", + "opera": "10.6" + }, + { + "op_mob": "12.1", + "opera": "12.1" + } + ], + + "-webkit-hyphens": [ + { + "ios": "4.2", + "safari": "5.1" + }, + {} + ], + "-moz-hyphens": [ + { + "firefox": "6" + }, + { + "firefox": "42" + } + ], + "-ms-hyphens": [ + { + "ie": "10", + "edge": "12" + }, + { + "ie": "11", + "edge": "18" + } + ], + + "-webkit-border-image": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "4.3", + "chrome": "14", + "ios": "5.1", + "safari": "5.1" + } + ], + "-moz-border-image": [{ "firefox": "3.5" }, { "firefox": "14" }], + "-o-border-image": [ + { + "op_mob": "11", + "opera": "11" + }, + { + "op_mob": "12.1", + "opera": "12.1" + } + ], + + "-webkit-font-kerning": [ + { + "android": "4.4.0", + "chrome": "29", + "ios": "8", + "opera": "16", + "safari": "7" + }, + { + "android": "4.4.3", + "chrome": "32", + "ios": "11.4", + "opera": "16", + "safari": "9" + } + ], + + "-webkit-font-feature-settings": [ + { + "android": "4.4", + "chrome": "16", + "opera": "15" + }, + { + "android": "4.4.4", + "chrome": "47", + "opera": "34" + } + ], + "-moz-font-feature-settings": [ + { + "firefox": "4" + }, + { + "firefox": "33" + } + ], + "-webkit-font-variant-ligatures": [ + { + "android": "4.4", + "chrome": "16", + "opera": "15" + }, + { + "android": "4.4.4", + "chrome": "47", + "opera": "34" + } + ], + "-moz-font-variant-ligatures": [ + { + "firefox": "4" + }, + { + "firefox": "33" + } + ], + "-webkit-font-language-override": [ + { + "android": "4.4", + "chrome": "16", + "opera": "15" + }, + { + "android": "4.4.4", + "chrome": "47", + "opera": "34" + } + ], + "-moz-font-language-override": [ + { + "firefox": "4" + }, + { + "firefox": "33" + } + ], + + "-webkit-transition": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "4.3", + "chrome": "25", + "ios": "6.1", + "safari": "6" + } + ], + "-moz-transition": [ + { + "firefox": "4" + }, + { + "firefox": "15" + } + ], + "-o-transition": [ + { + "op_mob": "10", + "opera": "10.5" + }, + { + "op_mob": "12", + "opera": "12" + } + ], + "-webkit-transition-duration": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "4.3", + "chrome": "25", + "ios": "6.1", + "safari": "6" + } + ], + "-moz-transition-duration": [ + { + "firefox": "4" + }, + { + "firefox": "15" + } + ], + "-o-transition-duration": [ + { + "op_mob": "10", + "opera": "10.5" + }, + { + "op_mob": "12", + "opera": "12" + } + ], + "-webkit-transition-delay": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "4.3", + "chrome": "25", + "ios": "6.1", + "safari": "6" + } + ], + "-moz-transition-delay": [ + { + "firefox": "4" + }, + { + "firefox": "15" + } + ], + "-o-transition-delay": [ + { + "op_mob": "10", + "opera": "10.5" + }, + { + "op_mob": "12", + "opera": "12" + } + ], + "-webkit-transition-timing-function": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "4.3", + "chrome": "25", + "ios": "6.1", + "safari": "6" + } + ], + "-moz-transition-timing-function": [ + { + "firefox": "4" + }, + { + "firefox": "15" + } + ], + "-o-transition-timing-function": [ + { + "op_mob": "10", + "opera": "10.5" + }, + { + "op_mob": "12", + "opera": "12" + } + ], + + "-webkit-perspective": [ + { + "android": "3", + "chrome": "12", + "ios": "3.2", + "opera": "15", + "safari": "4" + }, + { + "android": "4.3", + "chrome": "35", + "ios": "8.4", + "opera": "22", + "safari": "8" + } + ], + "-moz-perspective": [ + { + "firefox": "10" + }, + { + "firefox": "15" + } + ], + "-webkit-perspective-origin": [ + { + "android": "3", + "chrome": "12", + "ios": "3.2", + "opera": "15", + "safari": "4" + }, + { + "android": "4.3", + "chrome": "35", + "ios": "8.4", + "opera": "22", + "safari": "8" + } + ], + "-moz-perspective-origin": [ + { + "firefox": "10" + }, + { + "firefox": "15" + } + ], + + "-webkit-box-shadow": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "3", + "chrome": "9", + "edge": "83", + "ios": "4.3", + "safari": "5" + } + ], + "-moz-box-shadow": [ + { + "firefox": "3.5" + }, + { + "firefox": "3.6" + } + ], + + "-webkit-border-radius": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "4" + } + ], + "-moz-border-radius": [ + { + "firefox": "2" + }, + { + "firefox": "3.6" + } + ], + "-webkit-border-top-left-radius": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "4" + } + ], + "-moz-border-radius-topleft": [ + { + "firefox": "2" + }, + { + "firefox": "3.6" + } + ], + "-webkit-border-top-right-radius": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "4" + } + ], + "-moz-border-radius-topright": [ + { + "firefox": "2" + }, + { + "firefox": "3.6" + } + ], + "-webkit-border-bottom-right-radius": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "4" + } + ], + "-moz-border-radius-bottomright": [ + { + "firefox": "2" + }, + { + "firefox": "3.6" + } + ], + "-webkit-border-bottom-left-radius": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "3.1" + }, + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "safari": "4" + } + ], + "-moz-border-radius-bottomleft": [ + { + "firefox": "2" + }, + { + "firefox": "3.6" + } + ], + + "-webkit-backdrop-filter": [ + { + "edge": "17", + "ios": "9.0", + "safari": "9" + }, + { + "edge": "18", + "ios": "16.0", + "safari": "16.0" + } + ], + + "-ms-scroll-chaining": [ + { + "edge": "12", + "ie": "10" + }, + { + "edge": "17", + "ie": "11" + } + ], + + "-webkit-transform": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1" + }, + { + "android": "4.4.4", + "chrome": "35", + "ios": "8.4", + "opera": "22", + "safari": "8" + } + ], + "-moz-transform": [ + { + "firefox": "3.5" + }, + { + "firefox": "15" + } + ], + "-ms-transform": [ + { + "ie": "9" + }, + { + "ie": "9" + } + ], + "-o-transform": [ + { + "opera": "10.5" + }, + { + "opera": "11.6" + } + ], + + "-webkit-transform-origin": [ + { + "android": "2.1", + "chrome": "4", + "ios": "3.2", + "opera": "15", + "safari": "3.1" + }, + { + "android": "4.4.4", + "chrome": "35", + "ios": "8.4", + "opera": "22", + "safari": "8" + } + ], + "-moz-transform-origin": [ + { + "firefox": "3.5" + }, + { + "firefox": "15" + } + ], + "-ms-transform-origin": [ + { + "ie": "9" + }, + { + "ie": "9" + } + ], + "-o-transform-origin": [ + { + "opera": "10.5" + }, + { + "opera": "11.6" + } + ], + + "-webkit-transform-style": [ + { + "android": "3", + "chrome": "12", + "ios": "3.2", + "opera": "15", + "safari": "4" + }, + { + "android": "4.3", + "chrome": "35", + "ios": "8.4", + "opera": "22", + "safari": "8" + } + ], + "-moz-transform-style": [ + { + "firefox": "10" + }, + { + "firefox": "15" + } + ] +} diff --git a/crates/swc_css_prefixer/src/lib.rs b/crates/swc_css_prefixer/src/lib.rs index 7b2cbc56736..c77ef3d7481 100644 --- a/crates/swc_css_prefixer/src/lib.rs +++ b/crates/swc_css_prefixer/src/lib.rs @@ -1,3 +1,4 @@ pub use self::prefixer::prefixer; +pub mod options; mod prefixer; diff --git a/crates/swc_css_prefixer/src/options.rs b/crates/swc_css_prefixer/src/options.rs new file mode 100644 index 00000000000..6afbf40b3e7 --- /dev/null +++ b/crates/swc_css_prefixer/src/options.rs @@ -0,0 +1,15 @@ +use preset_env_base::query::Query; +pub use preset_env_base::query::Targets; +use serde::Deserialize; + +#[derive(Debug, Default, Clone, Deserialize)] +#[serde(rename_all = "camelCase")] +#[serde(deny_unknown_fields)] +pub struct Options { + #[serde(default = "default_targets")] + pub env: Option, +} + +fn default_targets() -> Option { + Some(Targets::Query(Query::Single("".into()))) +} diff --git a/crates/swc_css_prefixer/src/prefixer.rs b/crates/swc_css_prefixer/src/prefixer.rs index 347fc623db3..2ac4b983147 100644 --- a/crates/swc_css_prefixer/src/prefixer.rs +++ b/crates/swc_css_prefixer/src/prefixer.rs @@ -1,7 +1,9 @@ use core::f64::consts::PI; use std::mem::take; -use swc_common::{EqIgnoreSpan, DUMMY_SP}; +use once_cell::sync::Lazy; +use preset_env_base::{query::targets_to_versions, version::Version, BrowserData, Versions}; +use swc_common::{collections::AHashMap, EqIgnoreSpan, DUMMY_SP}; use swc_css_ast::*; use swc_css_utils::{ replace_function_name, replace_ident, replace_pseudo_class_selector_name, @@ -9,8 +11,105 @@ use swc_css_utils::{ }; use swc_css_visit::{VisitMut, VisitMutWith}; -pub fn prefixer() -> impl VisitMut { - Prefixer::default() +use crate::options::Options; + +static PREFIXES_AND_BROWSERS: Lazy>; 2]>> = + Lazy::new(|| { + let map: AHashMap>; 2]> = + serde_json::from_str(include_str!("../data/prefixes_and_browsers.json")) + .expect("failed to parse json"); + + map.into_iter() + .map(|(property, versions)| { + ( + property, + [ + versions[0].map_value(|version| version), + versions[1].map_value(|version| version), + ], + ) + }) + .collect() + }); + +macro_rules! zip { + ($x: expr) => ($x); + ($x: expr, $($y: expr), +) => ($x.iter().zip(zip!($($y), +))) +} + +fn should_enable( + target: Versions, + low_versions: Versions, + high_versions: Versions, + default: bool, +) -> bool { + if zip!(target, low_versions, high_versions).all(|((_, target_version), ((_, l), (_, h)))| { + target_version.is_none() && l.is_none() && h.is_none() + }) { + return default; + } + + zip!(target, low_versions, high_versions).any( + |( + (target_name, maybe_target_version), + ((_, maybe_low_version), (_, maybe_high_version)), + )| { + maybe_target_version.map_or(false, |target_version| { + let low_or_fallback_version = maybe_low_version.or_else(|| match target_name { + // Fall back to Chrome versions if Android browser data + // is missing from the feature data. It appears the + // Android browser has aligned its versioning with Chrome. + "android" => low_versions.chrome, + _ => None, + }); + + if let Some(low_or_fallback_version) = low_or_fallback_version { + if target_version >= low_or_fallback_version { + let high_or_fallback_version = maybe_high_version.or(match target_name { + // Fall back to Chrome versions if Android browser data + // is missing from the feature data. It appears the + // Android browser has aligned its versioning with Chrome. + "android" => low_versions.chrome, + _ => None, + }); + + if let Some(high_or_fallback_version) = high_or_fallback_version { + target_version <= high_or_fallback_version + } else { + true + } + } else { + false + } + } else { + false + } + }) + }, + ) +} + +pub fn should_prefix(property: &str, target: Versions, default: bool) -> bool { + if target.is_any_target() { + return true; + } + + let versions = PREFIXES_AND_BROWSERS.get(property); + + if let Some(versions) = versions { + return should_enable(target, versions[0], versions[1], false); + } + + default +} + +pub fn prefixer(options: Options) -> impl VisitMut { + let env: Versions = targets_to_versions(options.env).expect("failed to parse targets"); + + Prefixer { + env, + ..Default::default() + } } pub struct CrossFadeFunctionReplacerOnLegacyVariant<'a> { @@ -434,8 +533,17 @@ macro_rules! str_to_ident { }}; } +#[derive(Debug, PartialEq, Eq, Clone, Copy)] +pub enum Prefix { + Webkit, + Moz, + O, + Ms, +} + #[derive(Default)] struct Prefixer { + env: Versions, in_keyframe_block: bool, simple_block: Option, rule_prefix: Option, @@ -445,14 +553,6 @@ struct Prefixer { added_declarations: Vec, } -#[derive(Clone, Debug, PartialEq, Eq)] -pub enum Prefix { - Webkit, - Moz, - O, - Ms, -} - impl VisitMut for Prefixer { fn visit_mut_stylesheet(&mut self, n: &mut Stylesheet) { let mut new = vec![]; @@ -1102,52 +1202,42 @@ impl VisitMut for Prefixer { // TODO avoid insert moz/etc prefixes for `appearance: -webkit-button;` // TODO avoid duplication insert macro_rules! add_declaration { - ($prefix:expr,$name:expr) => {{ - // Use only specific prefix in prefixed at-rules or rule, i.e. - // don't use `-moz` prefix for properties in `@-webkit-keyframes` at-rule - if self.rule_prefix == Some($prefix) || self.rule_prefix.is_none() { - // Check we don't have prefixed property - if !property_names.contains(&$name) { - let name = DeclarationName::Ident(Ident { - span: DUMMY_SP, - value: $name.into(), - raw: None, - }); - let new_value = match $prefix { - Prefix::Webkit => webkit_value.clone(), - Prefix::Moz => moz_value.clone(), - Prefix::O => o_value.clone(), - Prefix::Ms => ms_value.clone(), - }; + ($prefix:expr,$property:expr, $value:expr) => {{ + if should_prefix($property, self.env, true) { + // Use only specific prefix in prefixed at-rules or rule, i.e. + // don't use `-moz` prefix for properties in `@-webkit-keyframes` at-rule + if self.rule_prefix == Some($prefix) || self.rule_prefix.is_none() { + // Check we don't have prefixed property + if !property_names.contains(&$property) { + let name = DeclarationName::Ident(Ident { + span: DUMMY_SP, + value: $property.into(), + raw: None, + }); - self.added_declarations.push(Declaration { - span: n.span, - name, - value: new_value, - important: n.important.clone(), - }); - } - } - }}; + if let Some(value) = $value { + self.added_declarations.push(Declaration { + span: n.span, + name, + value, + important: n.important.clone(), + }); + } else { + let new_value = match $prefix { + Prefix::Webkit => webkit_value.clone(), + Prefix::Moz => moz_value.clone(), + Prefix::O => o_value.clone(), + Prefix::Ms => ms_value.clone(), + }; - ($prefix:expr,$name:expr,$value:expr) => {{ - // Use only specific prefix in prefixed at-rules or rule, i.e. - // don't use `-moz` prefix for properties in `@-webkit-keyframes` at-rule - if self.rule_prefix == Some($prefix) || self.rule_prefix.is_none() { - // Check we don't have prefixed property - if !property_names.contains(&$name) { - let name = DeclarationName::Ident(Ident { - span: DUMMY_SP, - value: $name.into(), - raw: None, - }); - - self.added_declarations.push(Declaration { - span: n.span, - name, - value: $value, - important: n.important.clone(), - }); + self.added_declarations.push(Declaration { + span: n.span, + name, + value: new_value, + important: n.important.clone(), + }); + } + } } } }}; @@ -1157,9 +1247,9 @@ impl VisitMut for Prefixer { match property_name { "appearance" => { - add_declaration!(Prefix::Webkit, "-webkit-appearance"); - add_declaration!(Prefix::Moz, "-moz-appearance"); - add_declaration!(Prefix::Ms, "-ms-appearance"); + add_declaration!(Prefix::Webkit, "-webkit-appearance", None); + add_declaration!(Prefix::Moz, "-moz-appearance", None); + add_declaration!(Prefix::Ms, "-ms-appearance", None); } "animation" => { @@ -1171,28 +1261,28 @@ impl VisitMut for Prefixer { }); if need_prefix { - add_declaration!(Prefix::Webkit, "-webkit-animation"); - add_declaration!(Prefix::Moz, "-moz-animation"); - add_declaration!(Prefix::O, "-o-animation"); + add_declaration!(Prefix::Webkit, "-webkit-animation", None); + add_declaration!(Prefix::Moz, "-moz-animation", None); + add_declaration!(Prefix::O, "-o-animation", None); } } "animation-name" => { - add_declaration!(Prefix::Webkit, "-webkit-animation-name"); - add_declaration!(Prefix::Moz, "-moz-animation-name"); - add_declaration!(Prefix::O, "-o-animation-name"); + add_declaration!(Prefix::Webkit, "-webkit-animation-name", None); + add_declaration!(Prefix::Moz, "-moz-animation-name", None); + add_declaration!(Prefix::O, "-o-animation-name", None); } "animation-duration" => { - add_declaration!(Prefix::Webkit, "-webkit-animation-duration"); - add_declaration!(Prefix::Moz, "-moz-animation-duration"); - add_declaration!(Prefix::O, "-o-animation-duration"); + add_declaration!(Prefix::Webkit, "-webkit-animation-duration", None); + add_declaration!(Prefix::Moz, "-moz-animation-duration", None); + add_declaration!(Prefix::O, "-o-animation-duration", None); } "animation-delay" => { - add_declaration!(Prefix::Webkit, "-webkit-animation-delay"); - add_declaration!(Prefix::Moz, "-moz-animation-delay"); - add_declaration!(Prefix::O, "-o-animation-delay"); + add_declaration!(Prefix::Webkit, "-webkit-animation-delay", None); + add_declaration!(Prefix::Moz, "-moz-animation-delay", None); + add_declaration!(Prefix::O, "-o-animation-delay", None); } "animation-direction" => { @@ -1201,112 +1291,112 @@ impl VisitMut for Prefixer { "alternate-reverse" | "reverse" => {} _ => { - add_declaration!(Prefix::Webkit, "-webkit-animation-direction"); - add_declaration!(Prefix::Moz, "-moz-animation-direction"); - add_declaration!(Prefix::O, "-o-animation-direction"); + add_declaration!(Prefix::Webkit, "-webkit-animation-direction", None); + add_declaration!(Prefix::Moz, "-moz-animation-direction", None); + add_declaration!(Prefix::O, "-o-animation-direction", None); } } } } "animation-fill-mode" => { - add_declaration!(Prefix::Webkit, "-webkit-animation-fill-mode"); - add_declaration!(Prefix::Moz, "-moz-animation-fill-mode"); - add_declaration!(Prefix::O, "-o-animation-fill-mode"); + add_declaration!(Prefix::Webkit, "-webkit-animation-fill-mode", None); + add_declaration!(Prefix::Moz, "-moz-animation-fill-mode", None); + add_declaration!(Prefix::O, "-o-animation-fill-mode", None); } "animation-iteration-count" => { - add_declaration!(Prefix::Webkit, "-webkit-animation-iteration-count"); - add_declaration!(Prefix::Moz, "-moz-animation-iteration-count"); - add_declaration!(Prefix::O, "-o-animation-iteration-count"); + add_declaration!(Prefix::Webkit, "-webkit-animation-iteration-count", None); + add_declaration!(Prefix::Moz, "-moz-animation-iteration-count", None); + add_declaration!(Prefix::O, "-o-animation-iteration-count", None); } "animation-play-state" => { - add_declaration!(Prefix::Webkit, "-webkit-animation-play-state"); - add_declaration!(Prefix::Moz, "-moz-animation-play-state"); - add_declaration!(Prefix::O, "-o-animation-play-state"); + add_declaration!(Prefix::Webkit, "-webkit-animation-play-state", None); + add_declaration!(Prefix::Moz, "-moz-animation-play-state", None); + add_declaration!(Prefix::O, "-o-animation-play-state", None); } "animation-timing-function" => { - add_declaration!(Prefix::Webkit, "-webkit-animation-timing-function"); - add_declaration!(Prefix::Moz, "-moz-animation-timing-function"); - add_declaration!(Prefix::O, "-o-animation-timing-function"); + add_declaration!(Prefix::Webkit, "-webkit-animation-timing-function", None); + add_declaration!(Prefix::Moz, "-moz-animation-timing-function", None); + add_declaration!(Prefix::O, "-o-animation-timing-function", None); } "background-clip" => { if let ComponentValue::Ident(Ident { value, .. }) = &n.value[0] { if &*value.to_lowercase() == "text" { - add_declaration!(Prefix::Webkit, "-webkit-background-clip"); + add_declaration!(Prefix::Webkit, "-webkit-background-clip", None); } } } "box-decoration-break" => { - add_declaration!(Prefix::Webkit, "-webkit-box-decoration-break"); + add_declaration!(Prefix::Webkit, "-webkit-box-decoration-break", None); } "box-sizing" => { - add_declaration!(Prefix::Webkit, "-webkit-box-sizing"); - add_declaration!(Prefix::Moz, "-moz-box-sizing"); + add_declaration!(Prefix::Webkit, "-webkit-box-sizing", None); + add_declaration!(Prefix::Moz, "-moz-box-sizing", None); } "color-adjust" => { - add_declaration!(Prefix::Webkit, "-webkit-print-color-adjust"); + add_declaration!(Prefix::Webkit, "-webkit-print-color-adjust", None); } "print-color-adjust" => { - add_declaration!(Prefix::Moz, "color-adjust"); - add_declaration!(Prefix::Webkit, "-webkit-print-color-adjust"); + add_declaration!(Prefix::Moz, "color-adjust", None); + add_declaration!(Prefix::Webkit, "-webkit-print-color-adjust", None); } "columns" => { - add_declaration!(Prefix::Webkit, "-webkit-columns"); - add_declaration!(Prefix::Moz, "-moz-columns"); + add_declaration!(Prefix::Webkit, "-webkit-columns", None); + add_declaration!(Prefix::Moz, "-moz-columns", None); } "column-width" => { - add_declaration!(Prefix::Webkit, "-webkit-column-width"); - add_declaration!(Prefix::Moz, "-moz-column-width"); + add_declaration!(Prefix::Webkit, "-webkit-column-width", None); + add_declaration!(Prefix::Moz, "-moz-column-width", None); } "column-gap" => { - add_declaration!(Prefix::Webkit, "-webkit-column-gap"); - add_declaration!(Prefix::Moz, "-moz-column-gap"); + add_declaration!(Prefix::Webkit, "-webkit-column-gap", None); + add_declaration!(Prefix::Moz, "-moz-column-gap", None); } "column-rule" => { - add_declaration!(Prefix::Webkit, "-webkit-column-rule"); - add_declaration!(Prefix::Moz, "-moz-column-rule"); + add_declaration!(Prefix::Webkit, "-webkit-column-rule", None); + add_declaration!(Prefix::Moz, "-moz-column-rule", None); } "column-rule-color" => { - add_declaration!(Prefix::Webkit, "-webkit-column-rule-color"); - add_declaration!(Prefix::Moz, "-moz-column-rule-color"); + add_declaration!(Prefix::Webkit, "-webkit-column-rule-color", None); + add_declaration!(Prefix::Moz, "-moz-column-rule-color", None); } "column-rule-width" => { - add_declaration!(Prefix::Webkit, "-webkit-column-rule-width"); - add_declaration!(Prefix::Moz, "-moz-column-rule-width"); + add_declaration!(Prefix::Webkit, "-webkit-column-rule-width", None); + add_declaration!(Prefix::Moz, "-moz-column-rule-width", None); } "column-count" => { - add_declaration!(Prefix::Webkit, "-webkit-column-count"); - add_declaration!(Prefix::Moz, "-moz-column-count"); + add_declaration!(Prefix::Webkit, "-webkit-column-count", None); + add_declaration!(Prefix::Moz, "-moz-column-count", None); } "column-rule-style" => { - add_declaration!(Prefix::Webkit, "-webkit-column-rule-style"); - add_declaration!(Prefix::Moz, "-moz-column-rule-style"); + add_declaration!(Prefix::Webkit, "-webkit-column-rule-style", None); + add_declaration!(Prefix::Moz, "-moz-column-rule-style", None); } "column-span" => { - add_declaration!(Prefix::Webkit, "-webkit-column-span"); - add_declaration!(Prefix::Moz, "-moz-column-span"); + add_declaration!(Prefix::Webkit, "-webkit-column-span", None); + add_declaration!(Prefix::Moz, "-moz-column-span", None); } "column-fill" => { - add_declaration!(Prefix::Webkit, "-webkit-column-fill"); - add_declaration!(Prefix::Moz, "-moz-column-fill"); + add_declaration!(Prefix::Webkit, "-webkit-column-fill", None); + add_declaration!(Prefix::Moz, "-moz-column-fill", None); } "cursor" => { @@ -1390,18 +1480,22 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Webkit, "-webkit-box-flex", - vec![spec_2009_value.clone()] + Some(vec![spec_2009_value.clone()]) ); } else { - add_declaration!(Prefix::Webkit, "-webkit-box-flex"); + add_declaration!(Prefix::Webkit, "-webkit-box-flex", None); } - add_declaration!(Prefix::Webkit, "-webkit-flex"); + add_declaration!(Prefix::Webkit, "-webkit-flex", None); if let Some(spec_2009_value) = &spec_2009_value { - add_declaration!(Prefix::Moz, "-moz-box-flex", vec![spec_2009_value.clone()]); + add_declaration!( + Prefix::Moz, + "-moz-box-flex", + Some(vec![spec_2009_value.clone()]) + ); } else { - add_declaration!(Prefix::Webkit, "-moz-box-flex"); + add_declaration!(Prefix::Webkit, "-moz-box-flex", None); } if n.value.len() == 3 { @@ -1425,27 +1519,27 @@ impl VisitMut for Prefixer { })); } - add_declaration!(Prefix::Ms, "-ms-flex", value); + add_declaration!(Prefix::Ms, "-ms-flex", Some(value)); } else { - add_declaration!(Prefix::Ms, "-ms-flex"); + add_declaration!(Prefix::Ms, "-ms-flex", None); } } "flex-grow" => { - add_declaration!(Prefix::Webkit, "-webkit-box-flex"); - add_declaration!(Prefix::Webkit, "-webkit-flex-grow"); - add_declaration!(Prefix::Moz, "-moz-box-flex"); - add_declaration!(Prefix::Ms, "-ms-flex-positive"); + add_declaration!(Prefix::Webkit, "-webkit-box-flex", None); + add_declaration!(Prefix::Webkit, "-webkit-flex-grow", None); + add_declaration!(Prefix::Moz, "-moz-box-flex", None); + add_declaration!(Prefix::Ms, "-ms-flex-positive", None); } "flex-shrink" => { - add_declaration!(Prefix::Webkit, "-webkit-flex-shrink"); - add_declaration!(Prefix::Ms, "-ms-flex-negative"); + add_declaration!(Prefix::Webkit, "-webkit-flex-shrink", None); + add_declaration!(Prefix::Ms, "-ms-flex-negative", None); } "flex-basis" => { - add_declaration!(Prefix::Webkit, "-webkit-flex-basis"); - add_declaration!(Prefix::Ms, "-ms-flex-preferred-size"); + add_declaration!(Prefix::Webkit, "-webkit-flex-basis", None); + add_declaration!(Prefix::Ms, "-ms-flex-preferred-size", None); } "flex-direction" => { @@ -1477,32 +1571,36 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Webkit, "-webkit-box-orient", - vec![str_to_ident!(orient)] + Some(vec![str_to_ident!(orient)]) ); add_declaration!( Prefix::Webkit, "-webkit-box-direction", - vec![str_to_ident!(direction)] + Some(vec![str_to_ident!(direction)]) ); } - add_declaration!(Prefix::Webkit, "-webkit-flex-direction"); + add_declaration!(Prefix::Webkit, "-webkit-flex-direction", None); if let Some((orient, direction)) = old_values { - add_declaration!(Prefix::Moz, "-moz-box-orient", vec![str_to_ident!(orient)]); + add_declaration!( + Prefix::Moz, + "-moz-box-orient", + Some(vec![str_to_ident!(orient)]) + ); add_declaration!( Prefix::Webkit, "-moz-box-direction", - vec![str_to_ident!(direction)] + Some(vec![str_to_ident!(direction)]) ); } - add_declaration!(Prefix::Ms, "-ms-flex-direction"); + add_declaration!(Prefix::Ms, "-ms-flex-direction", None); } "flex-wrap" => { - add_declaration!(Prefix::Webkit, "-webkit-flex-wrap"); - add_declaration!(Prefix::Ms, "-ms-flex-wrap"); + add_declaration!(Prefix::Webkit, "-webkit-flex-wrap", None); + add_declaration!(Prefix::Ms, "-ms-flex-wrap", None); } "flex-flow" => { @@ -1554,27 +1652,31 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Webkit, "-webkit-box-orient", - vec![str_to_ident!(orient)] + Some(vec![str_to_ident!(orient)]) ); add_declaration!( Prefix::Webkit, "-webkit-box-direction", - vec![str_to_ident!(direction)] + Some(vec![str_to_ident!(direction)]) ); } - add_declaration!(Prefix::Webkit, "-webkit-flex-flow"); + add_declaration!(Prefix::Webkit, "-webkit-flex-flow", None); if let Some((orient, direction)) = old_values { - add_declaration!(Prefix::Moz, "-moz-box-orient", vec![str_to_ident!(orient)]); + add_declaration!( + Prefix::Moz, + "-moz-box-orient", + Some(vec![str_to_ident!(orient)]) + ); add_declaration!( Prefix::Moz, "-moz-box-direction", - vec![str_to_ident!(direction)] + Some(vec![str_to_ident!(direction)]) ); } - add_declaration!(Prefix::Ms, "-ms-flex-flow"); + add_declaration!(Prefix::Ms, "-ms-flex-flow", None); } "justify-content" => { @@ -1599,11 +1701,11 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Webkit, "-webkit-box-pack", - old_spec_webkit_new_value + Some(old_spec_webkit_new_value) ); } - add_declaration!(Prefix::Webkit, "-webkit-justify-content"); + add_declaration!(Prefix::Webkit, "-webkit-justify-content", None); if need_old_spec && (self.rule_prefix == Some(Prefix::Moz) || self.rule_prefix.is_none()) @@ -1614,7 +1716,7 @@ impl VisitMut for Prefixer { replace_ident(&mut old_spec_moz_value, "flex-end", "end"); replace_ident(&mut old_spec_moz_value, "space-between", "justify"); - add_declaration!(Prefix::Moz, "-moz-box-pack", old_spec_moz_value); + add_declaration!(Prefix::Moz, "-moz-box-pack", Some(old_spec_moz_value)); } if self.rule_prefix == Some(Prefix::Ms) || self.rule_prefix.is_none() { @@ -1625,7 +1727,7 @@ impl VisitMut for Prefixer { replace_ident(&mut old_spec_ms_value, "space-between", "justify"); replace_ident(&mut old_spec_ms_value, "space-around", "distribute"); - add_declaration!(Prefix::Ms, "-ms-flex-pack", old_spec_ms_value); + add_declaration!(Prefix::Ms, "-ms-flex-pack", Some(old_spec_ms_value)); } } @@ -1640,30 +1742,30 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Webkit, "-webkit-box-ordinal-group", - vec![str_to_ident!(old_spec_num.to_string())] + Some(vec![str_to_ident!(old_spec_num.to_string())]) ); } _ => { - add_declaration!(Prefix::Webkit, "-webkit-box-ordinal-group"); + add_declaration!(Prefix::Webkit, "-webkit-box-ordinal-group", None); } } - add_declaration!(Prefix::Webkit, "-webkit-order"); + add_declaration!(Prefix::Webkit, "-webkit-order", None); match old_spec_num { Some(old_spec_num) if n.value.len() == 1 => { add_declaration!( Prefix::Moz, "-moz-box-ordinal-group", - vec![str_to_ident!(old_spec_num.to_string())] + Some(vec![str_to_ident!(old_spec_num.to_string())]) ); } _ => { - add_declaration!(Prefix::Webkit, "-moz-box-ordinal-group"); + add_declaration!(Prefix::Webkit, "-moz-box-ordinal-group", None); } } - add_declaration!(Prefix::Ms, "-ms-flex-order"); + add_declaration!(Prefix::Ms, "-ms-flex-order", None); } "align-items" => { @@ -1676,11 +1778,11 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Webkit, "-webkit-box-align", - old_spec_webkit_new_value + Some(old_spec_webkit_new_value) ); } - add_declaration!(Prefix::Webkit, "-webkit-align-items"); + add_declaration!(Prefix::Webkit, "-webkit-align-items", None); if self.rule_prefix == Some(Prefix::Moz) || self.rule_prefix.is_none() { let mut old_spec_moz_value = moz_value.clone(); @@ -1688,7 +1790,7 @@ impl VisitMut for Prefixer { replace_ident(&mut old_spec_moz_value, "flex-end", "end"); replace_ident(&mut old_spec_moz_value, "flex-start", "start"); - add_declaration!(Prefix::Moz, "-moz-box-align", old_spec_moz_value); + add_declaration!(Prefix::Moz, "-moz-box-align", Some(old_spec_moz_value)); } if self.rule_prefix == Some(Prefix::Ms) || self.rule_prefix.is_none() { @@ -1697,12 +1799,12 @@ impl VisitMut for Prefixer { replace_ident(&mut old_spec_ms_value, "flex-end", "end"); replace_ident(&mut old_spec_ms_value, "flex-start", "start"); - add_declaration!(Prefix::Ms, "-ms-flex-align", old_spec_ms_value); + add_declaration!(Prefix::Ms, "-ms-flex-align", Some(old_spec_ms_value)); } } "align-self" => { - add_declaration!(Prefix::Webkit, "-webkit-align-self"); + add_declaration!(Prefix::Webkit, "-webkit-align-self", None); if self.rule_prefix == Some(Prefix::Ms) || self.rule_prefix.is_none() { let mut spec_2012_ms_value = ms_value.clone(); @@ -1710,12 +1812,12 @@ impl VisitMut for Prefixer { replace_ident(&mut spec_2012_ms_value, "flex-end", "end"); replace_ident(&mut spec_2012_ms_value, "flex-start", "start"); - add_declaration!(Prefix::Ms, "-ms-flex-item-align", spec_2012_ms_value); + add_declaration!(Prefix::Ms, "-ms-flex-item-align", Some(spec_2012_ms_value)); } } "align-content" => { - add_declaration!(Prefix::Webkit, "-webkit-align-content"); + add_declaration!(Prefix::Webkit, "-webkit-align-content", None); if self.rule_prefix == Some(Prefix::Ms) || self.rule_prefix.is_none() { let mut spec_2012_ms_value = ms_value.clone(); @@ -1725,7 +1827,7 @@ impl VisitMut for Prefixer { replace_ident(&mut spec_2012_ms_value, "space-between", "justify"); replace_ident(&mut spec_2012_ms_value, "space-around", "distribute"); - add_declaration!(Prefix::Ms, "-ms-flex-line-pack", spec_2012_ms_value); + add_declaration!(Prefix::Ms, "-ms-flex-line-pack", Some(spec_2012_ms_value)); } } @@ -1756,7 +1858,11 @@ impl VisitMut for Prefixer { replace_ident(&mut old_spec_ms_value, "pixelated", "nearest-neighbor"); if ms_value != old_spec_ms_value { - add_declaration!(Prefix::Ms, "-ms-interpolation-mode", old_spec_ms_value); + add_declaration!( + Prefix::Ms, + "-ms-interpolation-mode", + Some(old_spec_ms_value) + ); } } } @@ -1767,132 +1873,132 @@ impl VisitMut for Prefixer { ComponentValue::Function(Function { name, .. }) if name.value.as_ref().eq_ignore_ascii_case("alpha") => {} _ => { - add_declaration!(Prefix::Webkit, "-webkit-filter"); + add_declaration!(Prefix::Webkit, "-webkit-filter", None); } }, "backdrop-filter" => { - add_declaration!(Prefix::Webkit, "-webkit-backdrop-filter"); + add_declaration!(Prefix::Webkit, "-webkit-backdrop-filter", None); } "mask-clip" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-clip"); + add_declaration!(Prefix::Webkit, "-webkit-mask-clip", None); } // Fix me https://github.com/postcss/autoprefixer/blob/main/lib/hacks/mask-composite.js "mask-composite" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-composite"); + add_declaration!(Prefix::Webkit, "-webkit-mask-composite", None); } "mask-image" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-image"); + add_declaration!(Prefix::Webkit, "-webkit-mask-image", None); } "mask-origin" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-origin"); + add_declaration!(Prefix::Webkit, "-webkit-mask-origin", None); } "mask-repeat" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-repeat"); + add_declaration!(Prefix::Webkit, "-webkit-mask-repeat", None); } "mask-border-repeat" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-border-repeat"); + add_declaration!(Prefix::Webkit, "-webkit-mask-border-repeat", None); } "mask-border-source" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-border-source"); + add_declaration!(Prefix::Webkit, "-webkit-mask-border-source", None); } "mask" => { - add_declaration!(Prefix::Webkit, "-webkit-mask"); + add_declaration!(Prefix::Webkit, "-webkit-mask", None); } "mask-position" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-position"); + add_declaration!(Prefix::Webkit, "-webkit-mask-position", None); } "mask-size" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-size"); + add_declaration!(Prefix::Webkit, "-webkit-mask-size", None); } "mask-border" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-box-image"); + add_declaration!(Prefix::Webkit, "-webkit-mask-box-image", None); } "mask-border-outset" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-box-image-outset"); + add_declaration!(Prefix::Webkit, "-webkit-mask-box-image-outset", None); } "mask-border-width" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-box-image-width"); + add_declaration!(Prefix::Webkit, "-webkit-mask-box-image-width", None); } "mask-border-slice" => { - add_declaration!(Prefix::Webkit, "-webkit-mask-box-image-slice"); + add_declaration!(Prefix::Webkit, "-webkit-mask-box-image-slice", None); } "border-inline-start" => { - add_declaration!(Prefix::Webkit, "-webkit-border-start"); - add_declaration!(Prefix::Moz, "-moz-border-start"); + add_declaration!(Prefix::Webkit, "-webkit-border-start", None); + add_declaration!(Prefix::Moz, "-moz-border-start", None); } "border-inline-end" => { - add_declaration!(Prefix::Webkit, "-webkit-border-end"); - add_declaration!(Prefix::Moz, "-moz-border-end"); + add_declaration!(Prefix::Webkit, "-webkit-border-end", None); + add_declaration!(Prefix::Moz, "-moz-border-end", None); } "margin-inline-start" => { - add_declaration!(Prefix::Webkit, "-webkit-margin-start"); - add_declaration!(Prefix::Moz, "-moz-margin-start"); + add_declaration!(Prefix::Webkit, "-webkit-margin-start", None); + add_declaration!(Prefix::Moz, "-moz-margin-start", None); } "margin-inline-end" => { - add_declaration!(Prefix::Webkit, "-webkit-margin-end"); - add_declaration!(Prefix::Moz, "-moz-margin-end"); + add_declaration!(Prefix::Webkit, "-webkit-margin-end", None); + add_declaration!(Prefix::Moz, "-moz-margin-end", None); } "padding-inline-start" => { - add_declaration!(Prefix::Webkit, "-webkit-padding-start"); - add_declaration!(Prefix::Moz, "-moz-padding-start"); + add_declaration!(Prefix::Webkit, "-webkit-padding-start", None); + add_declaration!(Prefix::Moz, "-moz-padding-start", None); } "padding-inline-end" => { - add_declaration!(Prefix::Webkit, "-webkit-padding-end"); - add_declaration!(Prefix::Moz, "-moz-padding-end"); + add_declaration!(Prefix::Webkit, "-webkit-padding-end", None); + add_declaration!(Prefix::Moz, "-moz-padding-end", None); } "border-block-start" => { - add_declaration!(Prefix::Webkit, "-webkit-border-before"); + add_declaration!(Prefix::Webkit, "-webkit-border-before", None); } "border-block-end" => { - add_declaration!(Prefix::Webkit, "-webkit-border-after"); + add_declaration!(Prefix::Webkit, "-webkit-border-after", None); } "margin-block-start" => { - add_declaration!(Prefix::Webkit, "-webkit-margin-before"); + add_declaration!(Prefix::Webkit, "-webkit-margin-before", None); } "margin-block-end" => { - add_declaration!(Prefix::Webkit, "-webkit-margin-after"); + add_declaration!(Prefix::Webkit, "-webkit-margin-after", None); } "padding-block-start" => { - add_declaration!(Prefix::Webkit, "-webkit-padding-before"); + add_declaration!(Prefix::Webkit, "-webkit-padding-before", None); } "padding-block-end" => { - add_declaration!(Prefix::Webkit, "-webkit-padding-after"); + add_declaration!(Prefix::Webkit, "-webkit-padding-after", None); } "backface-visibility" => { - add_declaration!(Prefix::Webkit, "-webkit-backface-visibility"); - add_declaration!(Prefix::Moz, "-moz-backface-visibility"); + add_declaration!(Prefix::Webkit, "-webkit-backface-visibility", None); + add_declaration!(Prefix::Moz, "-moz-backface-visibility", None); } "clip-path" => { - add_declaration!(Prefix::Webkit, "-webkit-clip-path"); + add_declaration!(Prefix::Webkit, "-webkit-clip-path", None); } "position" if n.value.len() == 1 => { @@ -1902,8 +2008,8 @@ impl VisitMut for Prefixer { } "user-select" => { - add_declaration!(Prefix::Webkit, "-webkit-user-select"); - add_declaration!(Prefix::Moz, "-moz-user-select"); + add_declaration!(Prefix::Webkit, "-webkit-user-select", None); + add_declaration!(Prefix::Moz, "-moz-user-select", None); if let ComponentValue::Ident(Ident { value, .. }) = &n.value[0] { match &*value.to_lowercase() { @@ -1911,12 +2017,12 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Ms, "-ms-user-select", - vec![str_to_ident!("element")] + Some(vec![str_to_ident!("element")]) ); } "all" => {} _ => { - add_declaration!(Prefix::Ms, "-ms-user-select"); + add_declaration!(Prefix::Ms, "-ms-user-select", None); } } } @@ -1944,42 +2050,42 @@ impl VisitMut for Prefixer { _ => false, }); - add_declaration!(Prefix::Webkit, "-webkit-transform"); - add_declaration!(Prefix::Moz, "-moz-transform"); + add_declaration!(Prefix::Webkit, "-webkit-transform", None); + add_declaration!(Prefix::Moz, "-moz-transform", None); if !has_3d_function { if !self.in_keyframe_block { - add_declaration!(Prefix::Ms, "-ms-transform"); + add_declaration!(Prefix::Ms, "-ms-transform", None); } - add_declaration!(Prefix::O, "-o-transform"); + add_declaration!(Prefix::O, "-o-transform", None); } } "transform-origin" => { - add_declaration!(Prefix::Webkit, "-webkit-transform-origin"); - add_declaration!(Prefix::Moz, "-moz-transform-origin"); + add_declaration!(Prefix::Webkit, "-webkit-transform-origin", None); + add_declaration!(Prefix::Moz, "-moz-transform-origin", None); if !self.in_keyframe_block { - add_declaration!(Prefix::Ms, "-ms-transform-origin"); + add_declaration!(Prefix::Ms, "-ms-transform-origin", None); } - add_declaration!(Prefix::O, "-o-transform-origin"); + add_declaration!(Prefix::O, "-o-transform-origin", None); } "transform-style" => { - add_declaration!(Prefix::Webkit, "-webkit-transform-style"); - add_declaration!(Prefix::Moz, "-moz-transform-style"); + add_declaration!(Prefix::Webkit, "-webkit-transform-style", None); + add_declaration!(Prefix::Moz, "-moz-transform-style", None); } "perspective" => { - add_declaration!(Prefix::Webkit, "-webkit-perspective"); - add_declaration!(Prefix::Moz, "-moz-perspective"); + add_declaration!(Prefix::Webkit, "-webkit-perspective", None); + add_declaration!(Prefix::Moz, "-moz-perspective", None); } "perspective-origin" => { - add_declaration!(Prefix::Webkit, "-webkit-perspective-origin"); - add_declaration!(Prefix::Moz, "-moz-perspective-origin"); + add_declaration!(Prefix::Webkit, "-webkit-perspective-origin", None); + add_declaration!(Prefix::Moz, "-moz-perspective-origin", None); } "text-decoration" => { @@ -1999,33 +2105,33 @@ impl VisitMut for Prefixer { | "unset" ) => {} _ => { - add_declaration!(Prefix::Webkit, "-webkit-text-decoration"); - add_declaration!(Prefix::Moz, "-moz-text-decoration"); + add_declaration!(Prefix::Webkit, "-webkit-text-decoration", None); + add_declaration!(Prefix::Moz, "-moz-text-decoration", None); } } } else { - add_declaration!(Prefix::Webkit, "-webkit-text-decoration"); - add_declaration!(Prefix::Moz, "-moz-text-decoration"); + add_declaration!(Prefix::Webkit, "-webkit-text-decoration", None); + add_declaration!(Prefix::Moz, "-moz-text-decoration", None); } } "text-decoration-style" => { - add_declaration!(Prefix::Webkit, "-webkit-text-decoration-style"); - add_declaration!(Prefix::Moz, "-moz-text-decoration-style"); + add_declaration!(Prefix::Webkit, "-webkit-text-decoration-style", None); + add_declaration!(Prefix::Moz, "-moz-text-decoration-style", None); } "text-decoration-color" => { - add_declaration!(Prefix::Webkit, "-webkit-text-decoration-color"); - add_declaration!(Prefix::Moz, "-moz-text-decoration-color"); + add_declaration!(Prefix::Webkit, "-webkit-text-decoration-color", None); + add_declaration!(Prefix::Moz, "-moz-text-decoration-color", None); } "text-decoration-line" => { - add_declaration!(Prefix::Webkit, "-webkit-text-decoration-line"); - add_declaration!(Prefix::Moz, "-moz-text-decoration-line"); + add_declaration!(Prefix::Webkit, "-webkit-text-decoration-line", None); + add_declaration!(Prefix::Moz, "-moz-text-decoration-line", None); } "text-decoration-skip" => { - add_declaration!(Prefix::Webkit, "-webkit-text-decoration-skip"); + add_declaration!(Prefix::Webkit, "-webkit-text-decoration-skip", None); } "text-decoration-skip-ink" => { @@ -2035,11 +2141,15 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Webkit, "-webkit-text-decoration-skip", - vec![str_to_ident!("ink")] + Some(vec![str_to_ident!("ink")]) ); } _ => { - add_declaration!(Prefix::Webkit, "-webkit-text-decoration-skip-ink"); + add_declaration!( + Prefix::Webkit, + "-webkit-text-decoration-skip-ink", + None + ); } } } @@ -2048,9 +2158,9 @@ impl VisitMut for Prefixer { "text-size-adjust" if n.value.len() == 1 => { if let ComponentValue::Ident(Ident { value, .. }) = &n.value[0] { if &*value.to_lowercase() == "none" { - add_declaration!(Prefix::Webkit, "-webkit-text-size-adjust"); - add_declaration!(Prefix::Moz, "-moz-text-size-adjust"); - add_declaration!(Prefix::Ms, "-ms-text-size-adjust"); + add_declaration!(Prefix::Webkit, "-webkit-text-size-adjust", None); + add_declaration!(Prefix::Moz, "-moz-text-size-adjust", None); + add_declaration!(Prefix::Ms, "-ms-text-size-adjust", None); } } } @@ -2063,19 +2173,19 @@ impl VisitMut for Prefixer { replace_ident(&mut webkit_value, "filter", "-webkit-filter"); } - add_declaration!(Prefix::Webkit, "-webkit-transition"); + add_declaration!(Prefix::Webkit, "-webkit-transition", None); if self.rule_prefix == Some(Prefix::Moz) || self.rule_prefix.is_none() { replace_ident(&mut moz_value, "transform", "-moz-transform"); } - add_declaration!(Prefix::Moz, "-moz-transition"); + add_declaration!(Prefix::Moz, "-moz-transition", None); if self.rule_prefix == Some(Prefix::O) || self.rule_prefix.is_none() { replace_ident(&mut o_value, "transform", "-o-transform"); } - add_declaration!(Prefix::O, "-o-transition"); + add_declaration!(Prefix::O, "-o-transition", None); } "transition-property" => { @@ -2091,27 +2201,27 @@ impl VisitMut for Prefixer { replace_ident(&mut o_value, "transform", "-o-transform"); } - add_declaration!(Prefix::Webkit, "-webkit-transition-property"); - add_declaration!(Prefix::Moz, "-moz-transition-timing-function"); - add_declaration!(Prefix::O, "-o-transition-timing-function"); + add_declaration!(Prefix::Webkit, "-webkit-transition-property", None); + add_declaration!(Prefix::Moz, "-moz-transition-timing-function", None); + add_declaration!(Prefix::O, "-o-transition-timing-function", None); } "transition-duration" => { - add_declaration!(Prefix::Webkit, "-webkit-transition-duration"); - add_declaration!(Prefix::Moz, "-moz-transition-duration"); - add_declaration!(Prefix::O, "-o-transition-duration"); + add_declaration!(Prefix::Webkit, "-webkit-transition-duration", None); + add_declaration!(Prefix::Moz, "-moz-transition-duration", None); + add_declaration!(Prefix::O, "-o-transition-duration", None); } "transition-delay" => { - add_declaration!(Prefix::Webkit, "-webkit-transition-delay"); - add_declaration!(Prefix::Moz, "-moz-transition-delay"); - add_declaration!(Prefix::O, "-o-transition-delay"); + add_declaration!(Prefix::Webkit, "-webkit-transition-delay", None); + add_declaration!(Prefix::Moz, "-moz-transition-delay", None); + add_declaration!(Prefix::O, "-o-transition-delay", None); } "transition-timing-function" => { - add_declaration!(Prefix::Webkit, "-webkit-transition-timing-function"); - add_declaration!(Prefix::Moz, "-moz-transition-timing-function"); - add_declaration!(Prefix::O, "-o-transition-timing-function"); + add_declaration!(Prefix::Webkit, "-webkit-transition-timing-function", None); + add_declaration!(Prefix::Moz, "-moz-transition-timing-function", None); + add_declaration!(Prefix::O, "-o-transition-timing-function", None); } "writing-mode" if n.value.len() == 1 => { @@ -2135,21 +2245,21 @@ impl VisitMut for Prefixer { if let ComponentValue::Ident(Ident { value, .. }) = &n.value[0] { match &*value.to_lowercase() { "vertical-lr" => { - add_declaration!(Prefix::Webkit, "-webkit-writing-mode"); + add_declaration!(Prefix::Webkit, "-webkit-writing-mode", None); match direction { Some("ltr") => { add_declaration!( Prefix::Ms, "-ms-writing-mode", - vec![str_to_ident!("tb-lr")] + Some(vec![str_to_ident!("tb-lr")]) ); } Some("rtl") => { add_declaration!( Prefix::Ms, "-ms-writing-mode", - vec![str_to_ident!("bt-lr")] + Some(vec![str_to_ident!("bt-lr")]) ); } _ => {} @@ -2157,21 +2267,21 @@ impl VisitMut for Prefixer { } "vertical-rl" => { - add_declaration!(Prefix::Webkit, "-webkit-writing-mode"); + add_declaration!(Prefix::Webkit, "-webkit-writing-mode", None); match direction { Some("ltr") => { add_declaration!( Prefix::Ms, "-ms-writing-mode", - vec![str_to_ident!("tb-rl")] + Some(vec![str_to_ident!("tb-rl")]) ); } Some("rtl") => { add_declaration!( Prefix::Ms, "-ms-writing-mode", - vec![str_to_ident!("bt-rl")] + Some(vec![str_to_ident!("bt-rl")]) ); } _ => {} @@ -2179,21 +2289,21 @@ impl VisitMut for Prefixer { } "horizontal-tb" => { - add_declaration!(Prefix::Webkit, "-webkit-writing-mode"); + add_declaration!(Prefix::Webkit, "-webkit-writing-mode", None); match direction { Some("ltr") => { add_declaration!( Prefix::Ms, "-ms-writing-mode", - vec![str_to_ident!("lr-tb")] + Some(vec![str_to_ident!("lr-tb")]) ); } Some("rtl") => { add_declaration!( Prefix::Ms, "-ms-writing-mode", - vec![str_to_ident!("rl-tb")] + Some(vec![str_to_ident!("rl-tb")]) ); } _ => {} @@ -2201,12 +2311,12 @@ impl VisitMut for Prefixer { } "sideways-rl" | "sideways-lr" => { - add_declaration!(Prefix::Webkit, "-webkit-writing-mode"); + add_declaration!(Prefix::Webkit, "-webkit-writing-mode", None); } _ => { - add_declaration!(Prefix::Webkit, "-webkit-writing-mode"); - add_declaration!(Prefix::Ms, "-ms-writing-mode"); + add_declaration!(Prefix::Webkit, "-webkit-writing-mode", None); + add_declaration!(Prefix::Ms, "-ms-writing-mode", None); } } } @@ -2276,14 +2386,14 @@ impl VisitMut for Prefixer { replace_ident(&mut new_ms_value, "none", "-ms-none"); replace_ident(&mut new_ms_value, "pinch-zoom", "-ms-pinch-zoom"); - add_declaration!(Prefix::Ms, "-ms-touch-action", new_ms_value); + add_declaration!(Prefix::Ms, "-ms-touch-action", Some(new_ms_value)); } - add_declaration!(Prefix::Ms, "-ms-touch-action"); + add_declaration!(Prefix::Ms, "-ms-touch-action", None); } "text-orientation" => { - add_declaration!(Prefix::Webkit, "-webkit-text-orientation"); + add_declaration!(Prefix::Webkit, "-webkit-text-orientation", None); } "unicode-bidi" => { @@ -2303,139 +2413,139 @@ impl VisitMut for Prefixer { } "text-spacing" => { - add_declaration!(Prefix::Ms, "-ms-text-spacing"); + add_declaration!(Prefix::Ms, "-ms-text-spacing", None); } "text-emphasis" => { - add_declaration!(Prefix::Webkit, "-webkit-text-spacing"); + add_declaration!(Prefix::Webkit, "-webkit-text-emphasis", None); } "text-emphasis-position" => { - add_declaration!(Prefix::Webkit, "-webkit-text-emphasis-position"); + add_declaration!(Prefix::Webkit, "-webkit-text-emphasis-position", None); } "text-emphasis-style" => { - add_declaration!(Prefix::Webkit, "-webkit-text-emphasis-style"); + add_declaration!(Prefix::Webkit, "-webkit-text-emphasis-style", None); } "text-emphasis-color" => { - add_declaration!(Prefix::Webkit, "-webkit-text-emphasis-color"); + add_declaration!(Prefix::Webkit, "-webkit-text-emphasis-color", None); } "flow-into" => { - add_declaration!(Prefix::Webkit, "-webkit-flow-into"); - add_declaration!(Prefix::Ms, "-ms-flow-into"); + add_declaration!(Prefix::Webkit, "-webkit-flow-into", None); + add_declaration!(Prefix::Ms, "-ms-flow-into", None); } "flow-from" => { - add_declaration!(Prefix::Webkit, "-webkit-flow-from"); - add_declaration!(Prefix::Ms, "-ms-flow-from"); + add_declaration!(Prefix::Webkit, "-webkit-flow-from", None); + add_declaration!(Prefix::Ms, "-ms-flow-from", None); } "region-fragment" => { - add_declaration!(Prefix::Webkit, "-webkit-region-fragment"); - add_declaration!(Prefix::Ms, "-ms-region-fragment"); + add_declaration!(Prefix::Webkit, "-webkit-region-fragment", None); + add_declaration!(Prefix::Ms, "-ms-region-fragment", None); } "scroll-snap-type" => { - add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-type"); - add_declaration!(Prefix::Ms, "-ms-scroll-snap-type"); + add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-type", None); + add_declaration!(Prefix::Ms, "-ms-scroll-snap-type", None); } "scroll-snap-coordinate" => { - add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-coordinate"); - add_declaration!(Prefix::Ms, "-ms-scroll-snap-coordinate"); + add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-coordinate", None); + add_declaration!(Prefix::Ms, "-ms-scroll-snap-coordinate", None); } "scroll-snap-destination" => { - add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-destination"); - add_declaration!(Prefix::Ms, "-ms-scroll-snap-destination"); + add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-destination", None); + add_declaration!(Prefix::Ms, "-ms-scroll-snap-destination", None); } "scroll-snap-points-x" => { - add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-points-x"); - add_declaration!(Prefix::Ms, "-ms-scroll-snap-points-x"); + add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-points-x", None); + add_declaration!(Prefix::Ms, "-ms-scroll-snap-points-x", None); } "scroll-snap-points-y" => { - add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-points-y"); - add_declaration!(Prefix::Ms, "-ms-scroll-snap-points-y"); + add_declaration!(Prefix::Webkit, "-webkit-scroll-snap-points-y", None); + add_declaration!(Prefix::Ms, "-ms-scroll-snap-points-y", None); } "text-align-last" => { - add_declaration!(Prefix::Moz, "-moz-text-align-last"); + add_declaration!(Prefix::Moz, "-moz-text-align-last", None); } "text-overflow" => { - add_declaration!(Prefix::O, "-o-text-overflow"); + add_declaration!(Prefix::O, "-o-text-overflow", None); } "shape-margin" => { - add_declaration!(Prefix::Webkit, "-webkit-shape-margin"); + add_declaration!(Prefix::Webkit, "-webkit-shape-margin", None); } "shape-outside" => { - add_declaration!(Prefix::Webkit, "-webkit-shape-outside"); + add_declaration!(Prefix::Webkit, "-webkit-shape-outside", None); } "shape-image-threshold" => { - add_declaration!(Prefix::Webkit, "-webkit-shape-image-threshold"); + add_declaration!(Prefix::Webkit, "-webkit-shape-image-threshold", None); } "object-fit" => { - add_declaration!(Prefix::O, "-o-object-fit"); + add_declaration!(Prefix::O, "-o-object-fit", None); } "object-position" => { - add_declaration!(Prefix::O, "-o-object-position"); + add_declaration!(Prefix::O, "-o-object-position", None); } "tab-size" => { - add_declaration!(Prefix::Moz, "-moz-tab-size"); - add_declaration!(Prefix::O, "-o-tab-size"); + add_declaration!(Prefix::Moz, "-moz-tab-size", None); + add_declaration!(Prefix::O, "-o-tab-size", None); } "hyphens" => { - add_declaration!(Prefix::Webkit, "-webkit-hyphens"); - add_declaration!(Prefix::Moz, "-moz-hyphens"); - add_declaration!(Prefix::Ms, "-ms-hyphens"); + add_declaration!(Prefix::Webkit, "-webkit-hyphens", None); + add_declaration!(Prefix::Moz, "-moz-hyphens", None); + add_declaration!(Prefix::Ms, "-ms-hyphens", None); } "border-image" => { - add_declaration!(Prefix::Webkit, "-webkit-border-image"); - add_declaration!(Prefix::Moz, "-moz-border-image"); - add_declaration!(Prefix::O, "-o-border-image"); + add_declaration!(Prefix::Webkit, "-webkit-border-image", None); + add_declaration!(Prefix::Moz, "-moz-border-image", None); + add_declaration!(Prefix::O, "-o-border-image", None); } "font-kerning" => { - add_declaration!(Prefix::Webkit, "-webkit-font-kerning"); + add_declaration!(Prefix::Webkit, "-webkit-font-kerning", None); } "font-feature-settings" => { - add_declaration!(Prefix::Webkit, "-webkit-font-feature-settings"); - add_declaration!(Prefix::Moz, "-moz-font-feature-settings"); + add_declaration!(Prefix::Webkit, "-webkit-font-feature-settings", None); + add_declaration!(Prefix::Moz, "-moz-font-feature-settings", None); } "font-variant-ligatures" => { - add_declaration!(Prefix::Webkit, "-webkit-font-variant-ligatures"); - add_declaration!(Prefix::Moz, "-moz-font-variant-ligatures"); + add_declaration!(Prefix::Webkit, "-webkit-font-variant-ligatures", None); + add_declaration!(Prefix::Moz, "-moz-font-variant-ligatures", None); } "font-language-override" => { - add_declaration!(Prefix::Webkit, "-webkit-font-language-override"); - add_declaration!(Prefix::Moz, "-moz-font-language-override"); + add_declaration!(Prefix::Webkit, "-webkit-font-language-override", None); + add_declaration!(Prefix::Moz, "-moz-font-language-override", None); } "background-origin" => { - add_declaration!(Prefix::Webkit, "-webkit-background-origin"); - add_declaration!(Prefix::Moz, "-moz-background-origin"); - add_declaration!(Prefix::O, "-o-background-origin"); + add_declaration!(Prefix::Webkit, "-webkit-background-origin", None); + add_declaration!(Prefix::Moz, "-moz-background-origin", None); + add_declaration!(Prefix::O, "-o-background-origin", None); } "background-size" => { - add_declaration!(Prefix::Webkit, "-webkit-background-size"); - add_declaration!(Prefix::Moz, "-moz-background-size"); - add_declaration!(Prefix::O, "-o-background-size"); + add_declaration!(Prefix::Webkit, "-webkit-background-size", None); + add_declaration!(Prefix::Moz, "-moz-background-size", None); + add_declaration!(Prefix::O, "-o-background-size", None); } "overscroll-behavior" => { @@ -2445,39 +2555,39 @@ impl VisitMut for Prefixer { add_declaration!( Prefix::Ms, "-ms-scroll-chaining", - vec![str_to_ident!("chained")] + Some(vec![str_to_ident!("chained")]) ); } "none" | "contain" => { add_declaration!( Prefix::Ms, "-ms-scroll-chaining", - vec![str_to_ident!("none")] + Some(vec![str_to_ident!("none")]) ); } _ => { - add_declaration!(Prefix::Ms, "-ms-scroll-chaining"); + add_declaration!(Prefix::Ms, "-ms-scroll-chaining", None); } } } else { - add_declaration!(Prefix::Ms, "-ms-scroll-chaining"); + add_declaration!(Prefix::Ms, "-ms-scroll-chaining", None); } } "box-shadow" => { - add_declaration!(Prefix::Webkit, "-webkit-box-shadow"); - add_declaration!(Prefix::Moz, "-moz-box-shadow"); + add_declaration!(Prefix::Webkit, "-webkit-box-shadow", None); + add_declaration!(Prefix::Moz, "-moz-box-shadow", None); } "forced-color-adjust" => { - add_declaration!(Prefix::Ms, "-ms-high-contrast-adjust"); + add_declaration!(Prefix::Ms, "-ms-high-contrast-adjust", None); } "break-inside" => { if let ComponentValue::Ident(Ident { value, .. }) = &n.value[0] { match &*value.to_lowercase() { "auto" | "avoid" => { - add_declaration!(Prefix::Webkit, "-webkit-column-break-inside"); + add_declaration!(Prefix::Webkit, "-webkit-column-break-inside", None); } _ => {} } @@ -2488,13 +2598,13 @@ impl VisitMut for Prefixer { if let ComponentValue::Ident(Ident { value, .. }) = &n.value[0] { match &*value.to_lowercase() { "auto" | "avoid" => { - add_declaration!(Prefix::Webkit, "-webkit-column-break-before"); + add_declaration!(Prefix::Webkit, "-webkit-column-break-before", None); } "column" => { add_declaration!( Prefix::Webkit, "-webkit-column-break-before", - vec![str_to_ident!("always")] + Some(vec![str_to_ident!("always")]) ); } _ => {} @@ -2506,13 +2616,13 @@ impl VisitMut for Prefixer { if let ComponentValue::Ident(Ident { value, .. }) = &n.value[0] { match &*value.to_lowercase() { "auto" | "avoid" => { - add_declaration!(Prefix::Webkit, "-webkit-column-break-after"); + add_declaration!(Prefix::Webkit, "-webkit-column-break-after", None); } "column" => { add_declaration!( Prefix::Webkit, "-webkit-column-break-after", - vec![str_to_ident!("always")] + Some(vec![str_to_ident!("always")]) ); } _ => {} @@ -2521,28 +2631,28 @@ impl VisitMut for Prefixer { } "border-radius" => { - add_declaration!(Prefix::Webkit, "-webkit-border-radius"); - add_declaration!(Prefix::Moz, "-moz-border-radius"); + add_declaration!(Prefix::Webkit, "-webkit-border-radius", None); + add_declaration!(Prefix::Moz, "-moz-border-radius", None); } "border-top-left-radius" => { - add_declaration!(Prefix::Webkit, "-webkit-border-top-left-radius"); - add_declaration!(Prefix::Moz, "-moz-border-radius-topleft"); + add_declaration!(Prefix::Webkit, "-webkit-border-top-left-radius", None); + add_declaration!(Prefix::Moz, "-moz-border-radius-topleft", None); } "border-top-right-radius" => { - add_declaration!(Prefix::Webkit, "-webkit-border-top-right-radius"); - add_declaration!(Prefix::Moz, "-moz-border-radius-topright"); + add_declaration!(Prefix::Webkit, "-webkit-border-top-right-radius", None); + add_declaration!(Prefix::Moz, "-moz-border-radius-topright", None); } "border-bottom-right-radius" => { - add_declaration!(Prefix::Webkit, "-webkit-border-bottom-right-radius"); - add_declaration!(Prefix::Moz, "-moz-border-radius-bottomright"); + add_declaration!(Prefix::Webkit, "-webkit-border-bottom-right-radius", None); + add_declaration!(Prefix::Moz, "-moz-border-radius-bottomright", None); } "border-bottom-left-radius" => { - add_declaration!(Prefix::Webkit, "-webkit-border-bottom-left-radius"); - add_declaration!(Prefix::Moz, "-moz-border-radius-bottomleft"); + add_declaration!(Prefix::Webkit, "-webkit-border-bottom-left-radius", None); + add_declaration!(Prefix::Moz, "-moz-border-radius-bottomleft", None); } // TODO add `grid` support https://github.com/postcss/autoprefixer/tree/main/lib/hacks (starting with grid) diff --git a/crates/swc_css_prefixer/tests/fixture/advanced-filter/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/advanced-filter/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..bd37bad25ff --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/advanced-filter/output.defaults-not-ie-11.css @@ -0,0 +1,12 @@ +div { + -webkit-backdrop-filter: blur(2px); + backdrop-filter: blur(2px); +} +div { + background: -webkit-filter(url('image.jpg'), blur(2px)); + background: filter(url('image.jpg'), blur(2px)); +} +div { + background: url(image.jpg), -webkit-filter(url('image.jpg'), blur(2px)); + background: url(image.jpg), filter(url('image.jpg'), blur(2px)); +} diff --git a/crates/swc_css_prefixer/tests/fixture/animation/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/animation/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..4139fb262e1 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/animation/output.defaults-not-ie-11.css @@ -0,0 +1,28 @@ +.class { + animation: inherit; +} +.class { + animation-duration: 0.6s; +} +.class { + animation-name: slidein; +} +.class { + animation-iteration-count: infinite; +} +.class { + animation-timing-function: cubic-bezier(0.1, 0.7, 1.0, 0.1); +} +.class { + animation-direction: alternate; + animation-direction: reverse; + animation-direction: REVERSE; + animation-direction: alternate-reverse; + animation: rotation-reverse; + animation: rotation-reverse reverse; + animation: test reverse; + animation: reverse test; +} +div { + animation-direction: var(--test); +} diff --git a/crates/swc_css_prefixer/tests/fixture/any-link/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/any-link/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..5602496495f --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/any-link/output.defaults-not-ie-11.css @@ -0,0 +1,9 @@ +a:-webkit-any-link { + color: red; +} +a:-moz-any-link { + color: red; +} +a:any-link { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/appearance/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/appearance/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..b136786e94e --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/appearance/output.defaults-not-ie-11.css @@ -0,0 +1,8 @@ +a { + -webkit-appearance: none; + appearance: none; +} +b { + -webkit-appearance: auto; + appearance: auto; +} diff --git a/crates/swc_css_prefixer/tests/fixture/autofill/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/autofill/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..534cc94b0ef --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/autofill/output.defaults-not-ie-11.css @@ -0,0 +1,12 @@ +input:-webkit-autofill { + border: 3px solid blue; +} +input:autofill { + border: 3px solid blue; +} +input:-webkit-autofill { + border: 3px solid blue; +} +input:AUTOFILL { + border: 3px solid blue; +} diff --git a/crates/swc_css_prefixer/tests/fixture/backdrop-filter/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/backdrop-filter/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..35aa97b6047 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/backdrop-filter/output.defaults-not-ie-11.css @@ -0,0 +1,4 @@ +a { + -webkit-backdrop-filter: blur(2px); + backdrop-filter: blur(2px); +} diff --git a/crates/swc_css_prefixer/tests/fixture/backdrop/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/backdrop/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..a0e6f0ada77 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/backdrop/output.defaults-not-ie-11.css @@ -0,0 +1,9 @@ +dialog::-webkit-backdrop { + background: rgba(255, 0, 0, .25); +} +dialog::-ms-backdrop { + background: rgba(255, 0, 0, .25); +} +dialog::backdrop { + background: rgba(255, 0, 0, .25); +} diff --git a/crates/swc_css_prefixer/tests/fixture/backface-visibility/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/backface-visibility/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..65a7881b010 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/backface-visibility/output.defaults-not-ie-11.css @@ -0,0 +1,4 @@ +.class { + -webkit-backface-visibility: hidden; + backface-visibility: hidden; +} diff --git a/crates/swc_css_prefixer/tests/fixture/background-clip/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/background-clip/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..b1d4982f7f3 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/background-clip/output.defaults-not-ie-11.css @@ -0,0 +1,7 @@ +a { + -webkit-background-clip: text; + background-clip: text; +} +b { + background-clip: content-box; +} diff --git a/crates/swc_css_prefixer/tests/fixture/background-img-opts/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/background-img-opts/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..41ddd746acd --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/background-img-opts/output.defaults-not-ie-11.css @@ -0,0 +1,12 @@ +.class { + -webkit-background-origin: initial; + -moz-background-origin: initial; + -o-background-origin: initial; + background-origin: initial; +} +.class { + -webkit-background-size: contain; + -moz-background-size: contain; + -o-background-size: contain; + background-size: contain; +} diff --git a/crates/swc_css_prefixer/tests/fixture/background-size/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/background-size/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..57c94e75cc5 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/background-size/output.defaults-not-ie-11.css @@ -0,0 +1,12 @@ +a { + -webkit-background-size: 20px; + -moz-background-size: 20px; + -o-background-size: 20px; + background-size: 20px; +} +b { + -webkit-background-size: contain; + -moz-background-size: contain; + -o-background-size: contain; + background-size: contain; +} diff --git a/crates/swc_css_prefixer/tests/fixture/background/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/background/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..56e667adf8c --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/background/output.defaults-not-ie-11.css @@ -0,0 +1,23 @@ +.class { + background: none; +} +.class { + background: -webkit-image-set(url(foo.jpg) 2x); + background: image-set(url(foo.jpg) 2x); +} +.class { + background-image: -webkit-image-set(url(foo.jpg) 2x); + background-image: image-set(url(foo.jpg) 2x); +} +.class { + background: -webkit-filter(url('image.jpg'), blur(2px)); + background: filter(url('image.jpg'), blur(2px)); +} +.class { + background: -webkit-filter(url('image.jpg'), blur(2px)); + background: filter(url('image.jpg'), blur(2px)); +} +.class { + background: url(image.jpg), -webkit-filter(url('image.jpg'), blur(2px)); + background: url(image.jpg), filter(url('image.jpg'), blur(2px)); +} diff --git a/crates/swc_css_prefixer/tests/fixture/basic/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/basic/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..b2495518421 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/basic/output.defaults-not-ie-11.css @@ -0,0 +1,18 @@ +body { + color: red; +} +:hover { + color: red; + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + animation: foo 1s ease-out; +} +div a { + display: none; +} +[data-test] > div { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/border-image/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/border-image/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..cdc5e79e98e --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/border-image/output.defaults-not-ie-11.css @@ -0,0 +1,6 @@ +.class { + border-image: -webkit-linear-gradient(black, white) 20% fill stretch stretch; + border-image: -moz-linear-gradient(black, white) 20% fill stretch stretch; + border-image: -o-linear-gradient(black, white) 20% fill stretch stretch; + border-image: linear-gradient(black, white) 20% fill stretch stretch; +} diff --git a/crates/swc_css_prefixer/tests/fixture/border-radius/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/border-radius/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..c8dee351e09 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/border-radius/output.defaults-not-ie-11.css @@ -0,0 +1,7 @@ +a { + border-radius: 5px; + border-top-left-radius: 3px; + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; + border-bottom-left-radius: 3px; +} diff --git a/crates/swc_css_prefixer/tests/fixture/box-decoration-break/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/box-decoration-break/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..60a361810a9 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/box-decoration-break/output.defaults-not-ie-11.css @@ -0,0 +1,4 @@ +.class { + -webkit-box-decoration-break: slice; + box-decoration-break: slice; +} diff --git a/crates/swc_css_prefixer/tests/fixture/box-shadow/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/box-shadow/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..f979e030f56 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/box-shadow/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + box-shadow: 10px 5px 5px red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/box-sizing/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/box-sizing/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..ef40e811092 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/box-sizing/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + box-sizing: border-box; +} diff --git a/crates/swc_css_prefixer/tests/fixture/calc/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/calc/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..c5c4de4ad67 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/calc/output.defaults-not-ie-11.css @@ -0,0 +1,18 @@ +.class { + width: -webkit-calc(20px + 40px); + width: -moz-calc(20px + 40px); + width: calc(20px + 40px); +} +.class { + margin: -webkit-calc(5% + 5px) -webkit-calc(10% + 10px); + margin: -moz-calc(5% + 5px) -moz-calc(10% + 10px); + margin: calc(5% + 5px) calc(10% + 10px); +} +div { + -webkit-background-size: -webkit-calc(20px); + -moz-background-size: -moz-calc(20px); + -o-background-size: calc(20px); + background-size: -webkit-calc(20px); + background-size: -moz-calc(20px); + background-size: calc(20px); +} diff --git a/crates/swc_css_prefixer/tests/fixture/case-insensivity/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/case-insensivity/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..75ea68262bf --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/case-insensivity/output.defaults-not-ie-11.css @@ -0,0 +1,8 @@ +a { + -webkit-appearance: NONE; + APPEARANCE: NONE; +} +b { + -webkit-appearance: AUTO; + APPEARANCE: AUTO; +} diff --git a/crates/swc_css_prefixer/tests/fixture/check-down/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/check-down/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..b901d3914ca --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/check-down/output.defaults-not-ie-11.css @@ -0,0 +1,4 @@ +* { + transition: all 1s; + -o-transition: all 1s; +} diff --git a/crates/swc_css_prefixer/tests/fixture/clip-path/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/clip-path/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..a296cb81bde --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/clip-path/output.defaults-not-ie-11.css @@ -0,0 +1,4 @@ +.class { + -webkit-clip-path: none; + clip-path: none; +} diff --git a/crates/swc_css_prefixer/tests/fixture/color-adjust/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/color-adjust/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..2dbe2a3e679 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/color-adjust/output.defaults-not-ie-11.css @@ -0,0 +1,8 @@ +.a { + -webkit-print-color-adjust: economy; + color-adjust: economy; +} +.b { + -webkit-print-color-adjust: exact; + color-adjust: exact; +} diff --git a/crates/swc_css_prefixer/tests/fixture/color/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/color/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..19fce739214 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/color/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/columns/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/columns/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..7a9e18c59d3 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/columns/output.defaults-not-ie-11.css @@ -0,0 +1,30 @@ +.class { + columns: auto; +} +.class { + column-count: auto; +} +.class { + column-fill: auto; +} +.class { + column-gap: auto; +} +.class { + column-rule: auto; +} +.class { + column-rule-color: auto; +} +.class { + column-rule-style: auto; +} +.class { + column-rule-width: auto; +} +.class { + column-span: auto; +} +.class { + column-width: auto; +} diff --git a/crates/swc_css_prefixer/tests/fixture/cross-fade/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/cross-fade/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..c7bead8d375 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/cross-fade/output.defaults-not-ie-11.css @@ -0,0 +1,45 @@ +a { + background-image: -webkit-cross-fade(url(foo.png), url(bar.png), 0.2); + background-image: cross-fade(20% url(foo.png), url(bar.png)); +} +b { + background-image: -webkit-cross-fade(url(foo.png), url(bar.png), 0.5); + background-image: cross-fade(url(foo.png), url(bar.png)); +} +h1 { + background-image: -webkit-cross-fade(url(foo.png), url(bar.png), 0.10823); + background-image: cross-fade(10.823% url(foo.png), url(bar.png)); +} +h2 { + background-image: -webkit-cross-fade(url(foo.png), url(bar.png), 0.59); + background-image: cross-fade(0.59 url(foo.png), url(bar.png)); +} +h3 { + background-image: -webkit-cross-fade(url(foo.png), url(bar.png), 0.59); + background-image: cross-fade(.59 url(foo.png), url(bar.png)); +} +.foo { + background-image: -webkit-cross-fade(-webkit-linear-gradient(white, black), -webkit-radial-gradient(circle closest-corner, white, black), 0.59); + background-image: cross-fade(.59 -moz-linear-gradient(white, black), -moz-radial-gradient(circle closest-corner, white, black)); + background-image: cross-fade(.59 -o-linear-gradient(white, black), -o-radial-gradient(circle closest-corner, white, black)); + background-image: cross-fade(.59 linear-gradient(white, black), radial-gradient(circle closest-corner, white, black)); +} +.class { + background-image: -webkit-cross-fade(url(white.png), url(black.png), 0); + background-image: cross-fade(url(white.png) 0%, url(black.png) 100%); + background-image: -webkit-cross-fade(url(white.png), url(black.png), 0.25); + background-image: cross-fade(url(white.png) 25%, url(black.png) 75%); + background-image: -webkit-cross-fade(url(white.png), url(black.png), 0.5); + background-image: cross-fade(url(white.png) 50%, url(black.png) 50%); + background-image: -webkit-cross-fade(url(white.png), url(black.png), 0.75); + background-image: cross-fade(url(white.png) 75%, url(black.png) 25%); + background-image: -webkit-cross-fade(url(white.png), url(black.png), 1); + background-image: cross-fade(url(white.png) 100%, url(black.png) 0%); + background-image: cross-fade(url(green.png) 75%, url(red.png) 75%); + background-image: -webkit-cross-fade(url(white.png), url(black.png), 0.25); + background-image: cross-fade(url(white.png), url(black.png) 75%); + background-image: cross-fade(url(red.png) 33.33%, url(yellow.png) 33.33%, url(blue.png) 33.33%); +} +.broken { + background-image: cross-fade(url(red.png) 33.33%); +} diff --git a/crates/swc_css_prefixer/tests/fixture/css-regions/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/css-regions/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..4dff63de3e3 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/css-regions/output.defaults-not-ie-11.css @@ -0,0 +1,9 @@ +.class { + flow-into: table-content; +} +.class { + flow-from: none; +} +.class { + region-fragment: break; +} diff --git a/crates/swc_css_prefixer/tests/fixture/cursor/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/cursor/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..107983b0271 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/cursor/output.defaults-not-ie-11.css @@ -0,0 +1,47 @@ +.class { + cursor: none; +} +.class { + cursor: -webkit-grab; + cursor: -moz-grab; + cursor: grab; +} +.class { + cursor: url(cursor_1.png) 4 12, -webkit-grab; + cursor: url(cursor_1.png) 4 12, -moz-grab; + cursor: url(cursor_1.png) 4 12, grab; +} +.class { + cursor: -webkit-image-set(url(foo.jpg) 2x), pointer; + cursor: image-set(url(foo.jpg) 2x), pointer; +} +.class { + cursor: -webkit-image-set(url(foo.jpg) 2x), -webkit-grab; + cursor: image-set(url(foo.jpg) 2x), -moz-grab; + cursor: image-set(url(foo.jpg) 2x), grab; +} +.class { + cursor: url(cursor_1.svg) 4 5, url(cursor_2.svg), -webkit-image-set(url(foo.jpg) 2x) 5 5, -webkit-grab; + cursor: url(cursor_1.svg) 4 5, url(cursor_2.svg), image-set(url(foo.jpg) 2x) 5 5, -moz-grab; + cursor: url(cursor_1.svg) 4 5, url(cursor_2.svg), image-set(url(foo.jpg) 2x) 5 5, grab; +} +.class { + cursor: -webkit-zoom-in; + cursor: -moz-zoom-in; + cursor: zoom-in; +} +.class { + cursor: -webkit-zoom-out; + cursor: -moz-zoom-out; + cursor: zoom-out; +} +.class { + cursor: -webkit-grabbing; + cursor: -moz-grabbing; + cursor: grabbing; +} +.class { + cursor: url(cursor_1.svg) 4 5, url(cursor_2.svg), IMAGE_SET(url(foo.jpg) 2x) 5 5, -webkit-grab; + cursor: url(cursor_1.svg) 4 5, url(cursor_2.svg), IMAGE_SET(url(foo.jpg) 2x) 5 5, -moz-grab; + cursor: url(cursor_1.svg) 4 5, url(cursor_2.svg), IMAGE_SET(url(foo.jpg) 2x) 5 5, GRAB; +} diff --git a/crates/swc_css_prefixer/tests/fixture/display/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/display/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..a2ba6eb50dd --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/display/output.defaults-not-ie-11.css @@ -0,0 +1,44 @@ +.class { + display: block; +} +.class { + display: -webkit-box !important; + display: -webkit-flex !important; + display: -moz-box !important; + display: -ms-flexbox !important; + display: flex !important; +} +.class { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -moz-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; +} +.class { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; +} +:-webkit-full-screen a { + display: -webkit-box; + display: -webkit-flex; + display: flex; +} +:-moz-full-screen a { + display: -moz-box; + display: flex; +} +:-ms-fullscreen a { + display: -ms-flexbox; + display: flex; +} +:fullscreen a { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; +} diff --git a/crates/swc_css_prefixer/tests/fixture/duplicate-at-rule/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/duplicate-at-rule/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..d19951f3e12 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/duplicate-at-rule/output.defaults-not-ie-11.css @@ -0,0 +1,24 @@ +@-webkit-keyframes anim {} +@-moz-keyframes anim {} +@-o-keyframes anim {} +@keyframes anim {} +@-webkit-keyframes anim { + 0% { + color: red; + } +} +@-moz-keyframes anim { + 0% { + color: red; + } +} +@-o-keyframes anim { + 0% { + color: red; + } +} +@keyframes anim { + 0% { + color: red; + } +} diff --git a/crates/swc_css_prefixer/tests/fixture/element/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/element/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..33ebc6260f7 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/element/output.defaults-not-ie-11.css @@ -0,0 +1,13 @@ +div { + background: -moz-element(#id); + background: element(#id); +} +div { + background: url(image.jpg), -moz-element(#id); + background: url(image.jpg), element(#id); +} +div { + background: -webkit-image-set(url("small-balloons.jpg") 1x, url("large-balloons.jpg") 2x), element(#id); + background: image-set(url("small-balloons.jpg") 1x, url("large-balloons.jpg") 2x), -moz-element(#id); + background: image-set(url("small-balloons.jpg") 1x, url("large-balloons.jpg") 2x), element(#id); +} diff --git a/crates/swc_css_prefixer/tests/fixture/error-recovery/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/error-recovery/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..49d28842916 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/error-recovery/output.defaults-not-ie-11.css @@ -0,0 +1,7 @@ +.class { + __styled-jsx-placeholder__1 + animation: slide 3s ease infinite;} +.class { + animation: slide 3s ease infinite; + __styled-jsx-placeholder__1 +} diff --git a/crates/swc_css_prefixer/tests/fixture/file-selector-button/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/file-selector-button/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..4e08bde2794 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/file-selector-button/output.defaults-not-ie-11.css @@ -0,0 +1,18 @@ +input[type=file]::-webkit-file-upload-button { + border: 2px solid #6c5ce7; +} +input[type=file]::-ms-browse { + border: 2px solid #6c5ce7; +} +input[type=file]::file-selector-button { + border: 2px solid #6c5ce7; +} +input[type=file]::-webkit-file-upload-button:hover { + border: 2px solid #00cec9; +} +input[type=file]::-ms-browse:hover { + border: 2px solid #00cec9; +} +input[type=file]::file-selector-button:hover { + border: 2px solid #00cec9; +} diff --git a/crates/swc_css_prefixer/tests/fixture/filter/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/filter/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..fd094f520cf --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/filter/output.defaults-not-ie-11.css @@ -0,0 +1,20 @@ +.class { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + fill: red; +} +a { + -webkit-filter: blur(10px); + filter: blur(10px); + transition: -webkit-filter 2s; + transition: filter 2s; +} +div { + filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50); +} +b { + filter: alpha(opacity=100); +} +em { + filter: Alpha(opacity=100); +} diff --git a/crates/swc_css_prefixer/tests/fixture/flex/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/flex/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..a5463ec5f92 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/flex/output.defaults-not-ie-11.css @@ -0,0 +1,387 @@ +a { + -js-display: flex; + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -webkit-flex-flow: row; + -moz-box-orient: horizontal; + -moz-box-direction: normal; + -ms-flex-flow: row; + flex-flow: row; + -webkit-box-ordinal-group: 1; + -webkit-order: 0; + -moz-box-ordinal-group: 1; + -ms-flex-order: 0; + order: 0; + -webkit-box-flex: 0; + -webkit-flex: 0 1 2; + -moz-box-flex: 0; + -ms-flex: 0 1 2; + flex: 0 1 2; + transition: flex 200ms; +} +.inline { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -moz-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: auto; + -ms-flex-item-align: auto; + align-self: auto; + -webkit-align-content: stretch; + -ms-flex-line-pack: stretch; + align-content: stretch; + -webkit-box-flex: 1; + -webkit-flex: auto; + -moz-box-flex: 1; + -ms-flex: auto; + flex: auto; +} +.a { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -webkit-flex-direction: row; + -moz-box-orient: horizontal; + -moz-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -moz-box-pack: start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-box-align: start; + -webkit-align-items: flex-start; + -moz-box-align: start; + -ms-flex-align: start; + align-items: flex-start; + -webkit-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + flex-wrap: nowrap; + -webkit-align-content: flex-start; + -ms-flex-line-pack: start; + align-content: flex-start; + -webkit-align-self: flex-start; + -ms-flex-item-align: start; + align-self: flex-start; + -webkit-box-flex: 0; + -webkit-flex: none; + -moz-box-flex: 0; + -ms-flex: none; + flex: none; +} +.b { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: reverse; + -webkit-flex-direction: row-reverse; + -moz-box-orient: horizontal; + -moz-box-direction: reverse; + -ms-flex-direction: row-reverse; + flex-direction: row-reverse; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -moz-box-pack: end; + -ms-flex-pack: end; + justify-content: flex-end; + -webkit-box-align: end; + -webkit-align-items: flex-end; + -moz-box-align: end; + -ms-flex-align: end; + align-items: flex-end; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-align-content: flex-end; + -ms-flex-line-pack: end; + align-content: flex-end; + -webkit-align-self: flex-end; + -ms-flex-item-align: end; + align-self: flex-end; + -webkit-flex-shrink: 1; + -ms-flex-negative: 1; + flex-shrink: 1; +} +.c { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -webkit-flex-direction: column; + -moz-box-orient: vertical; + -moz-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -moz-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -webkit-align-items: center; + -moz-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-flex-wrap: reverse-wrap; + -ms-flex-wrap: reverse-wrap; + flex-wrap: reverse-wrap; + -webkit-align-content: center; + -ms-flex-line-pack: center; + align-content: center; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + -webkit-flex-basis: auto; + -ms-flex-preferred-size: auto; + flex-basis: auto; +} +.e { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: reverse; + -webkit-flex-direction: column-reverse; + -moz-box-orient: vertical; + -moz-box-direction: reverse; + -ms-flex-direction: column-reverse; + flex-direction: column-reverse; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -moz-box-pack: justify; + -ms-flex-pack: justify; + justify-content: space-between; + -webkit-box-align: baseline; + -webkit-align-items: baseline; + -moz-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + -webkit-align-content: space-between; + -ms-flex-line-pack: justify; + align-content: space-between; + -webkit-align-self: baseline; + -ms-flex-item-align: baseline; + align-self: baseline; +} +.f { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-justify-content: space-around; + -ms-flex-pack: distribute; + justify-content: space-around; + -webkit-box-align: stretch; + -webkit-align-items: stretch; + -moz-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; + -webkit-align-content: space-around; + -ms-flex-line-pack: distribute; + align-content: space-around; + -webkit-align-self: stretch; + -ms-flex-item-align: stretch; + align-self: stretch; +} +.g { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-box-flex: calc(1em + 1px); + -webkit-flex: -webkit-calc(1em + 1px) 0 0; + -moz-box-flex: calc(1em + 1px); + -ms-flex: calc(1em + 1px) 0 0px; + flex: -webkit-calc(1em + 1px) 0 0; + flex: -moz-calc(1em + 1px) 0 0; + flex: calc(1em + 1px) 0 0; +} +.h { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -webkit-flex-flow: column wrap; + -moz-box-orient: vertical; + -moz-box-direction: normal; + -ms-flex-flow: column wrap; + flex-flow: column wrap; +} +.i { + -webkit-flex-flow: nowrap; + -ms-flex-flow: nowrap; + flex-flow: nowrap; +} +.inherit { + -webkit-box-ordinal-group: inherit; + -webkit-order: inherit; + -moz-box-ordinal-group: inherit; + -ms-flex-order: inherit; + order: inherit; + -webkit-flex-direction: inherit; + -ms-flex-direction: inherit; + flex-direction: inherit; +} +@supports (display: flex) { + .foo { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + } +} +@supports (flex: auto) { + .foo { + -webkit-box-flex: 1; + -webkit-flex: auto; + -moz-box-flex: 1; + -ms-flex: auto; + flex: auto; + } +} +.class { + -webkit-box-flex: inherit; + -webkit-flex: inherit; + -moz-box-flex: inherit; + -ms-flex: inherit; + flex: inherit; +} +.class { + -webkit-box-flex: 1; + -webkit-flex-grow: 1; + -moz-box-flex: 1; + -ms-flex-positive: 1; + flex-grow: 1; +} +.class { + -webkit-flex-shrink: 1; + -ms-flex-negative: 1; + flex-shrink: 1; +} +.class { + -webkit-flex-basis: auto; + -ms-flex-preferred-size: auto; + flex-basis: auto; +} +.class { + -webkit-align-self: auto; + -ms-flex-item-align: auto; + align-self: auto; +} +.class { + -webkit-align-self: flex-start; + -ms-flex-item-align: start; + align-self: flex-start; +} +.class { + -webkit-align-self: flex-end; + -ms-flex-item-align: end; + align-self: flex-end; +} +.class { + -webkit-align-content: center; + -ms-flex-line-pack: center; + align-content: center; +} +.class { + -webkit-align-content: flex-start; + -ms-flex-line-pack: start; + align-content: flex-start; +} +.class { + -webkit-align-content: flex-end; + -ms-flex-line-pack: end; + align-content: flex-end; +} +.class { + -webkit-box-align: stretch; + -webkit-align-items: stretch; + -moz-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; +} +.class { + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -moz-box-pack: end; + -ms-flex-pack: end; + justify-content: flex-end; +} +.class { + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -moz-box-pack: start; + -ms-flex-pack: start; + justify-content: flex-start; +} +.class { + -webkit-box-pack: stretch; + -webkit-justify-content: stretch; + -moz-box-pack: stretch; + -ms-flex-pack: stretch; + justify-content: stretch; +} +.class { + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -moz-box-pack: justify; + -ms-flex-pack: justify; + justify-content: space-between; +} +.class { + justify-items: center; +} +.class { + -webkit-box-ordinal-group: 2; + -webkit-order: 1; + -moz-box-ordinal-group: 2; + -ms-flex-order: 1; + order: 1; +} +.class { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -webkit-flex-direction: column; + -moz-box-orient: vertical; + -moz-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; +} +.class { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -webkit-flex-flow: wrap column; + -moz-box-orient: vertical; + -moz-box-direction: normal; + -ms-flex-flow: wrap column; + flex-flow: wrap column; +} +.class-17 { + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -webkit-flex-direction: row; + -moz-box-orient: horizontal; + -moz-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; +} diff --git a/crates/swc_css_prefixer/tests/fixture/font-feature/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/font-feature/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..035d11f4899 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/font-feature/output.defaults-not-ie-11.css @@ -0,0 +1,9 @@ +.class { + font-feature-settings: initial; +} +.class { + font-variant-ligatures: initial; +} +.class { + font-language-override: initial; +} diff --git a/crates/swc_css_prefixer/tests/fixture/font-kerning/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/font-kerning/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..3f80581e65f --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/font-kerning/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + font-kerning: none; +} diff --git a/crates/swc_css_prefixer/tests/fixture/forced-color-adjust/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/forced-color-adjust/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..73bbc91e2fe --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/forced-color-adjust/output.defaults-not-ie-11.css @@ -0,0 +1,4 @@ +.class { + -ms-high-contrast-adjust: auto; + forced-color-adjust: auto; +} diff --git a/crates/swc_css_prefixer/tests/fixture/fullscreen/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/fullscreen/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..9fec015690b --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/fullscreen/output.defaults-not-ie-11.css @@ -0,0 +1,12 @@ +:-webkit-full-screen a { + color: red; +} +:-moz-full-screen a { + color: red; +} +:-ms-fullscreen a { + color: red; +} +:fullscreen a { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/gradient/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/gradient/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..65b2b7bcf33 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/gradient/output.defaults-not-ie-11.css @@ -0,0 +1,231 @@ +a { + background: -webkit-linear-gradient(99.5deg, white, black), -webkit-linear-gradient(220deg, black, white), -webkit-linear-gradient(45deg, black, white); + background: -moz-linear-gradient(99.5deg, white, black), -moz-linear-gradient(220deg, black, white), -moz-linear-gradient(45deg, black, white); + background: -o-linear-gradient(99.5deg, white, black), -o-linear-gradient(220deg, black, white), -o-linear-gradient(45deg, black, white); + background: linear-gradient(350.5deg, white, black), linear-gradient(-130deg, black, white), linear-gradient(45deg, black, white); +} +b { + background-image: -webkit-linear-gradient(rgba(0, 0, 0, 1), white), -webkit-linear-gradient(white, black); + background-image: -moz-linear-gradient(rgba(0, 0, 0, 1), white), -moz-linear-gradient(white, black); + background-image: -o-linear-gradient(rgba(0, 0, 0, 1), white), -o-linear-gradient(white, black); + background-image: linear-gradient(rgba(0, 0, 0, 1), white), linear-gradient(white, black); +} +strong { + background: -webkit-linear-gradient(bottom, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -moz-linear-gradient(bottom, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -o-linear-gradient(bottom, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; +} +div { + background-image: -webkit-radial-gradient(right, white, black), -webkit-repeating-linear-gradient(top left, black, white), -webkit-repeating-radial-gradient(bottom, aqua, red); + background-image: -moz-radial-gradient(right, white, black), -moz-repeating-linear-gradient(top left, black, white), -moz-repeating-linear-gradient(bottom, aqua, red); + background-image: -o-radial-gradient(right, white, black), -o-repeating-linear-gradient(top left, black, white), -o-repeating-radial-gradient(bottom, aqua, red); + background-image: radial-gradient(to left, white, black), repeating-linear-gradient(to bottom right, black, white), repeating-radial-gradient(to top, aqua, red); +} +.old-radial { + background: -webkit-radial-gradient(0 50%, ellipse farthest-corner, black, white); + background: -moz-radial-gradient(0 50%, ellipse farthest-corner, black, white); + background: -o-radial-gradient(0 50%, ellipse farthest-corner, black, white); + background: radial-gradient(0 50%, ellipse farthest-corner, black, white); +} +.simple1 { + background: -webkit-linear-gradient(black, white); + background: -moz-linear-gradient(black, white); + background: -o-linear-gradient(black, white); + background: linear-gradient(black, white); +} +.simple2 { + background: -webkit-linear-gradient(right, black 0%, rgba(0, 0, 0, 0.5) 50%, white 100%); + background: -moz-linear-gradient(right, black 0%, rgba(0, 0, 0, 0.5) 50%, white 100%); + background: -o-linear-gradient(right, black 0%, rgba(0, 0, 0, 0.5) 50%, white 100%); + background: linear-gradient(to left, black 0%, rgba(0, 0, 0, 0.5) 50%, white 100%); +} +.simple3 { + background: -webkit-linear-gradient(right, black 50%, white 100%); + background: -moz-linear-gradient(right, black 50%, white 100%); + background: -o-linear-gradient(right, black 50%, white 100%); + background: linear-gradient(to left, black 50%, white 100%); +} +.simple4 { + background: -webkit-linear-gradient(left bottom, black, white); + background: -moz-linear-gradient(left bottom, black, white); + background: -o-linear-gradient(left bottom, black, white); + background: linear-gradient(to right top, black, white); +} +.direction { + background: -webkit-linear-gradient(top left, black, rgba(0, 0, 0, 0.5), white); + background: -moz-linear-gradient(top left, black, rgba(0, 0, 0, 0.5), white); + background: -o-linear-gradient(top left, black, rgba(0, 0, 0, 0.5), white); + background: linear-gradient(top left, black, rgba(0, 0, 0, 0.5), white); +} +.silent { + background: -webkit-linear-gradient(top left, black, white); +} +.radial { + background: -webkit-radial-gradient(0 50%, farthest-side, white, black); + background: -moz-radial-gradient(0 50%, farthest-side, white, black); + background: -o-radial-gradient(0 50%, farthest-side, white, black); + background: radial-gradient(farthest-side at 0 50%, white, black); +} +.second { + background: red -webkit-linear-gradient(red, blue); + background: red -moz-linear-gradient(red, blue); + background: red -o-linear-gradient(red, blue); + background: red linear-gradient(red, blue); + background: url('logo.png'), -webkit-linear-gradient(#fff, #000); + background: url('logo.png'), -moz-linear-gradient(#fff, #000); + background: url('logo.png'), -o-linear-gradient(#fff, #000); + background: url('logo.png'), linear-gradient(#fff, #000); +} +.px { + background: -webkit-linear-gradient(black 0, white 100px); + background: -moz-linear-gradient(black 0, white 100px); + background: -o-linear-gradient(black 0, white 100px); + background: linear-gradient(black 0, white 100px); +} +.list { + list-style-image: -webkit-linear-gradient(white, black); + list-style-image: -moz-linear-gradient(white, black); + list-style-image: -o-linear-gradient(white, black); + list-style-image: linear-gradient(white, black); +} +.mask { + -webkit-mask: -webkit-linear-gradient(white, black); + mask: -webkit-linear-gradient(white, black); + mask: -moz-linear-gradient(white, black); + mask: -o-linear-gradient(white, black); + mask: linear-gradient(white, black); +} +.newline { + background-image: -webkit-linear-gradient(white, black), -webkit-linear-gradient(black, white); + background-image: -moz-linear-gradient(white, black), -moz-linear-gradient(black, white); + background-image: -o-linear-gradient(white, black), -o-linear-gradient(black, white); + background-image: linear-gradient(white, black), linear-gradient(black, white); +} +.convert { + background: -webkit-linear-gradient(bottom, white, black); + background: -moz-linear-gradient(bottom, white, black); + background: -o-linear-gradient(bottom, white, black); + background: linear-gradient(0deg, white, black); + background: -webkit-linear-gradient(left, white, black); + background: -moz-linear-gradient(left, white, black); + background: -o-linear-gradient(left, white, black); + background: linear-gradient(90deg, white, black); + background: -webkit-linear-gradient(top, white, black); + background: -moz-linear-gradient(top, white, black); + background: -o-linear-gradient(top, white, black); + background: linear-gradient(180deg, white, black); + background: -webkit-linear-gradient(right, white, black); + background: -moz-linear-gradient(right, white, black); + background: -o-linear-gradient(right, white, black); + background: linear-gradient(270deg, white, black); +} +.grad { + background: -webkit-linear-gradient(89.1deg, white, black); + background: -moz-linear-gradient(89.1deg, white, black); + background: -o-linear-gradient(89.1deg, white, black); + background: linear-gradient(1grad, white, black); +} +.rad { + background: -webkit-linear-gradient(32.704deg, white, black); + background: -moz-linear-gradient(32.704deg, white, black); + background: -o-linear-gradient(32.704deg, white, black); + background: linear-gradient(1rad, white, black); +} +.turn { + background: -webkit-linear-gradient(342deg, white, black); + background: -moz-linear-gradient(342deg, white, black); + background: -o-linear-gradient(342deg, white, black); + background: linear-gradient(0.3turn, white, black); +} +.norm { + background: -webkit-linear-gradient(right, white, black); + background: -moz-linear-gradient(right, white, black); + background: -o-linear-gradient(right, white, black); + background: linear-gradient(-90deg, white, black); +} +.mask { + -webkit-mask-image: -webkit-radial-gradient(86% 86%, circle, transparent 8px, black 8px); + mask-image: -webkit-radial-gradient(86% 86%, circle, transparent 8px, black 8px); + mask-image: -moz-radial-gradient(86% 86%, circle, transparent 8px, black 8px); + mask-image: -o-radial-gradient(86% 86%, circle, transparent 8px, black 8px); + mask-image: radial-gradient(circle at 86% 86%, transparent 8px, black 8px); +} +.cover { + background: -webkit-radial-gradient(center, ellipse cover, white, black); + background: -moz-radial-gradient(center, ellipse cover, white, black); + background: -o-radial-gradient(center, ellipse cover, white, black); + background: radial-gradient(ellipse cover at center, white, black); +} +.contain { + background: -webkit-radial-gradient(center, contain, white, black); + background: -moz-radial-gradient(center, contain, white, black); + background: -o-radial-gradient(center, contain, white, black); + background: radial-gradient(contain at center, white, black); +} +.no-div { + background: -webkit-linear-gradient(black); + background: -moz-linear-gradient(black); + background: -o-linear-gradient(black); + background: linear-gradient(black); +} +.background-shorthand { + background: -webkit-radial-gradient(#FFF, transparent) 0 0/ cover no-repeat #F0F; + background: -moz-radial-gradient(#FFF, transparent) 0 0/ cover no-repeat #F0F; + background: -o-radial-gradient(#FFF, transparent) 0 0/ cover no-repeat #F0F; + background: radial-gradient(#FFF, transparent) 0 0/ cover no-repeat #F0F; +} +.background-advanced { + background: -webkit-radial-gradient(5px 15px, ellipse farthest-corner, rgba(214, 168, 18, 0.7) 0%, rgba(255, 21, 177, 0.7) 50%, rgba(210, 7, 148, 0.7) 95%), -webkit-radial-gradient(#FFF, transparent), url(path/to/image.jpg) 50% / cover; + background: -moz-radial-gradient(5px 15px, ellipse farthest-corner, rgba(214, 168, 18, 0.7) 0%, rgba(255, 21, 177, 0.7) 50%, rgba(210, 7, 148, 0.7) 95%), -moz-radial-gradient(#FFF, transparent), url(path/to/image.jpg) 50% / cover; + background: -o-radial-gradient(5px 15px, ellipse farthest-corner, rgba(214, 168, 18, 0.7) 0%, rgba(255, 21, 177, 0.7) 50%, rgba(210, 7, 148, 0.7) 95%), -o-radial-gradient(#FFF, transparent), url(path/to/image.jpg) 50% / cover; + background: radial-gradient(ellipse farthest-corner at 5px 15px, rgba(214, 168, 18, 0.7) 0%, rgba(255, 21, 177, 0.7) 50%, rgba(210, 7, 148, 0.7) 95%), radial-gradient(#FFF, transparent), url(path/to/image.jpg) 50% / cover; +} +.multiradial { + -webkit-mask-image: -webkit-radial-gradient(100% 50%, circle closest-corner, #000, transparent); + mask-image: -webkit-radial-gradient(100% 50%, circle closest-corner, #000, transparent); + mask-image: -moz-radial-gradient(100% 50%, circle closest-corner, #000, transparent); + mask-image: -o-radial-gradient(100% 50%, circle closest-corner, #000, transparent); + mask-image: radial-gradient(circle closest-corner at 100% 50%, #000, transparent); +} +.broken { + -webkit-mask-image: -webkit-radial-gradient(white, black); + mask-image: -webkit-radial-gradient(white, black); + mask-image: -moz-radial-gradient(white, black); + mask-image: -o-radial-gradient(white, black); + mask-image: radial-gradient(white, black); +} +.loop { + background-image: url("https://test.com/lol(test.png"), -webkit-radial-gradient(yellow, black, yellow); + background-image: url("https://test.com/lol(test.png"), -moz-radial-gradient(yellow, black, yellow); + background-image: url("https://test.com/lol(test.png"), -o-radial-gradient(yellow, black, yellow); + background-image: url("https://test.com/lol(test.png"), radial-gradient(yellow, black, yellow); +} +.more { + background: -webkit-linear-gradient(bottom, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -moz-linear-gradient(bottom, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -o-linear-gradient(bottom, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -webkit-linear-gradient(right, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -moz-linear-gradient(right, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -o-linear-gradient(right, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: linear-gradient(to left, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -moz-linear-gradient(top, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -o-linear-gradient(top, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -webkit-linear-gradient(left, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -moz-linear-gradient(left, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -o-linear-gradient(left, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: linear-gradient(to right, transparent, rgba(0, 0, 0, 0.8) 20px, #000 30px, #000) no-repeat; + background: -webkit-linear-gradient(56.667deg, white, black), -webkit-linear-gradient(220deg, black, white), -webkit-linear-gradient(45deg, black, white); + background: -moz-linear-gradient(56.667deg, white, black), -moz-linear-gradient(220deg, black, white), -moz-linear-gradient(45deg, black, white); + background: -o-linear-gradient(56.667deg, white, black), -o-linear-gradient(220deg, black, white), -o-linear-gradient(45deg, black, white); + background: linear-gradient(33.333deg, white, black), linear-gradient(-130deg, black, white), linear-gradient(45deg, black, white); +} +.broken { + background-image: -webkit-linear-gradient(to, red 50%); + background-image: -moz-linear-gradient(to, red 50%); + background-image: -o-linear-gradient(to, red 50%); + background-image: linear-gradient(to, red 50%); +} diff --git a/crates/swc_css_prefixer/tests/fixture/grouping-rule/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/grouping-rule/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..959cd3fc3c1 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/grouping-rule/output.defaults-not-ie-11.css @@ -0,0 +1,89 @@ +.grid { + display: grid; +} +.a, +.b, +.c::selection, +.d:read-only, +.e::-webkit-input-placeholder { + color: yellow; +} +.a, +.b, +.c::-moz-selection, +.d:-moz-read-only, +.e:-moz-placeholder { + color: yellow; +} +.a, +.b, +.c::-moz-selection, +.d:-moz-read-only, +.e::-moz-placeholder { + color: yellow; +} +.a, +.b, +.c::selection, +.d:read-only, +.e:-ms-input-placeholder { + color: yellow; +} +.a, +.b, +.c::selection, +.d:read-only, +.e::-ms-input-placeholder { + color: yellow; +} +.a, +.b, +.c::selection, +.d:read-only, +.e::placeholder { + color: yellow; +} +::-moz-selection { + color: red; +} +::selection { + color: red; +} +:-moz-read-only { + color: black; +} +:read-only { + color: black; +} +.f:-moz-read-write, +.g:-moz-read-write { + background: #fff; +} +.f:read-write, +.g:read-write { + background: #fff; +} +.example:-webkit-any-link:read-only { + color: red; +} +.example:-moz-any-link:-moz-read-only { + color: red; +} +.example:any-link:read-only { + color: red; +} +.element1:focus, +.element1:-moz-read-only { + background-color: red; +} +.element1:focus, +.element1:read-only { + background-color: red; +} +.c::-moz-selection { + backface-visibility: visible; +} +.c::selection { + -webkit-backface-visibility: visible; + backface-visibility: visible; +} diff --git a/crates/swc_css_prefixer/tests/fixture/hyphens/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/hyphens/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..5a7ea7d90a0 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/hyphens/output.defaults-not-ie-11.css @@ -0,0 +1,4 @@ +.class { + -webkit-hyphens: auto; + hyphens: auto; +} diff --git a/crates/swc_css_prefixer/tests/fixture/image-rendering/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/image-rendering/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..64bd6446ed2 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/image-rendering/output.defaults-not-ie-11.css @@ -0,0 +1,23 @@ +img { + image-rendering: -webkit-optimize-contrast; + image-rendering: -moz-crisp-edges; + image-rendering: crisp-edges; +} +img.other { + -ms-interpolation-mode: nearest-neighbor; + image-rendering: -webkit-optimize-contrast; + image-rendering: -moz-crisp-edges; + image-rendering: -o-pixelated; + image-rendering: pixelated; +} +img.already { + -ms-interpolation-mode: nearest-neighbor; + display: block; + image-rendering: -webkit-optimize-contrast; + image-rendering: -moz-crisp-edges; + image-rendering: crisp-edges; + image-rendering: -webkit-optimize-contrast; + image-rendering: -moz-crisp-edges; + image-rendering: -o-pixelated; + image-rendering: pixelated; +} diff --git a/crates/swc_css_prefixer/tests/fixture/image-set/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/image-set/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..9dee98e83dd --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/image-set/output.defaults-not-ie-11.css @@ -0,0 +1,42 @@ +a { + background-image: -webkit-image-set(url(foo@1x.png) 1x, url(foo@2x.png) 2x); + background-image: image-set(url(foo@1x.png) 1x, url(foo@2x.png) 2x); +} +h1 { + background-image: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + background-image: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.class { + background-image: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + background-image: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.class { + border-image: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + border-image: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.class { + -webkit-mask: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + mask: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + mask: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.class { + -webkit-mask-image: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + mask-image: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + mask-image: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.class { + list-style: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + list-style: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.class { + list-style-image: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + list-style-image: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.class { + content: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x); + content: image-set('foo@1x.png' 1x, "foo@2x.png" 2x); +} +.broken { + content: -webkit-image-set(url("foo@1x.png") 1x, url("foo@2x.png") 2x) "test"; + content: image-set('foo@1x.png' 1x, "foo@2x.png" 2x) "test"; +} diff --git a/crates/swc_css_prefixer/tests/fixture/important/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/important/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..664cfb548c4 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/important/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + box-shadow: 10px 5px 5px red !important; +} diff --git a/crates/swc_css_prefixer/tests/fixture/isolate-override/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/isolate-override/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..fbdc6954875 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/isolate-override/output.defaults-not-ie-11.css @@ -0,0 +1,18 @@ +.bible-quote { + direction: rtl; + unicode-bidi: -webpack-isolate-override; + unicode-bidi: -moz-isolate-override; + unicode-bidi: isolate-override; +} +.bible-quote { + direction: rtl; + unicode-bidi: -webpack-plaintext; + unicode-bidi: -moz-plaintext; + unicode-bidi: plaintext; +} +.bible-quote { + direction: rtl; + unicode-bidi: -webkit-isolate; + unicode-bidi: -moz-isolate; + unicode-bidi: isolate; +} diff --git a/crates/swc_css_prefixer/tests/fixture/keyframes/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/keyframes/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..de110d9fbf7 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/keyframes/output.defaults-not-ie-11.css @@ -0,0 +1,109 @@ +@-webkit-keyframes anim { + from { + top: -webkit-calc(10% + 10px); + top: calc(10% + 10px); + transform: rotate(10deg); + } + 50% { + top: 0; + display: -webkit-box; + display: -webkit-flex; + display: flex; + } + to { + top: -webkit-calc(10%); + top: calc(10%); + transform: rotate(0); + } +} +@-moz-keyframes anim { + from { + top: -moz-calc(10% + 10px); + top: calc(10% + 10px); + transform: rotate(10deg); + } + 50% { + top: 0; + display: -moz-box; + display: flex; + } + to { + top: -moz-calc(10%); + top: calc(10%); + transform: rotate(0); + } +} +@-o-keyframes anim { + from { + top: calc(10% + 10px); + transform: rotate(10deg); + } + 50% { + top: 0; + display: flex; + } + to { + top: calc(10%); + transform: rotate(0); + } +} +@keyframes anim { + from { + top: -webkit-calc(10% + 10px); + top: -moz-calc(10% + 10px); + top: calc(10% + 10px); + transform: rotate(10deg); + } + 50% { + top: 0; + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + } + to { + top: -webkit-calc(10%); + top: -moz-calc(10%); + top: calc(10%); + transform: rotate(0); + } +} +@media screen { + @-webkit-keyframes inside {} + @-moz-keyframes inside {} + @-o-keyframes inside {} + @keyframes inside {} +} +@-webkit-keyframes spaces { + from { + color: black; + } + to { + color: white; + } +} +@-moz-keyframes spaces { + from { + color: black; + } + to { + color: white; + } +} +@-o-keyframes spaces { + from { + color: black; + } + to { + color: white; + } +} +@keyframes spaces { + from { + color: black; + } + to { + color: white; + } +} diff --git a/crates/swc_css_prefixer/tests/fixture/margid-border-padding-logical/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/margid-border-padding-logical/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..27f609e5ba2 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/margid-border-padding-logical/output.defaults-not-ie-11.css @@ -0,0 +1,39 @@ +.class { + margin-inline-start: 20px; +} +.class { + margin-inline-end: 20px; +} +a { + margin-block-start: 1px; + margin-inline-start: 1px; + padding-inline-end: 1px; +} +.border { + border-block-end: 1px; + border-inline-end: 1px; +} +.class { + padding-block-start: 1px; + padding-block-end: 1px; +} +.class { + margin-block-start: 1px; + margin-block-end: 1px; +} +.class { + border-block-start: 1px; + border-block-end: 1px; +} +.class { + padding-inline-start: 1px; + padding-inline-end: 1px; +} +.class { + margin-inline-start: 1px; + margin-inline-end: 1px; +} +.class { + border-inline-start: 1px; + border-inline-end: 1px; +} diff --git a/crates/swc_css_prefixer/tests/fixture/mask/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/mask/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..0b7d07a4098 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/mask/output.defaults-not-ie-11.css @@ -0,0 +1,79 @@ +.class { + -webkit-mask: none; + mask: none; +} +.class { + -webkit-mask-image: none; + mask-image: none; +} +.class { + -webkit-mask-image: -webkit-linear-gradient(#fff); + mask-image: -webkit-linear-gradient(#fff); + mask-image: -moz-linear-gradient(#fff); + mask-image: -o-linear-gradient(#fff); + mask-image: linear-gradient(#fff); +} +.class { + mask-mode: initial; +} +.class { + -webkit-mask-clip: initial; + mask-clip: initial; +} +.class { + -webkit-mask-size: initial; + mask-size: initial; +} +.class { + -webkit-mask-repeat: initial; + mask-repeat: initial; +} +.class { + -webkit-mask-origin: initial; + mask-origin: initial; +} +.class { + -webkit-mask-position: initial; + mask-position: initial; +} +.class { + -webkit-mask-composite: initial; + mask-composite: initial; +} +.class { + -webkit-mask-border-source: url(image.png); + mask-border-source: url(image.png); + -webkit-mask-box-image-slice: 50% fill; + mask-border-slice: 50% fill; + -webkit-mask-box-image-width: auto 1 50%; + mask-border-width: auto 1 50%; + -webkit-mask-box-image-outset: 0 1 2; + mask-border-outset: 0 1 2; + -webkit-mask-border-repeat: repeat space; + mask-border-repeat: repeat space; + -webkit-mask-box-image: url(#foo) 1 fill; + mask-border: url(#foo) 1 fill; +} +a { + -webkit-mask: url(add.png) add, url(substract.png); + mask: url(add.png) add, url(substract.png); +} +a { + -webkit-mask: url(intersect.png) intersect, url(exclude.png); + mask: url(intersect.png) intersect, url(exclude.png); +} +a { + -webkit-mask: url(image.png) intersect, url(image.png) add, url(image.png); + mask: url(image.png) intersect, url(image.png) add, url(image.png); +} +a { + -webkit-mask-composite: add; + mask-composite: add; +} +a { + mask-composite: ; +} +a { + -webkit-mask-composite: add, subtract, exclude; + mask-composite: add, subtract, exclude; +} diff --git a/crates/swc_css_prefixer/tests/fixture/min-zoom/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/min-zoom/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..73f506f8e1d --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/min-zoom/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + min-zoom: 0; +} diff --git a/crates/swc_css_prefixer/tests/fixture/multicolumn/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/multicolumn/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..2f2e5b2dbc5 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/multicolumn/output.defaults-not-ie-11.css @@ -0,0 +1,46 @@ +.a { + -webkit-column-break-inside: auto; + break-inside: auto; + -webkit-column-break-before: auto; + break-before: auto; + -webkit-column-break-after: auto; + break-after: auto; +} +.b { + -webkit-column-break-inside: avoid; + break-inside: avoid; +} +.c { + break-inside: avoid-column; +} +.d { + break-inside: avoid-page; +} +.e { + break-inside: avoid-region; +} +.f { + break-inside: region; +} +.class { + break-before: page; +} +.class { + -webkit-column-break-before: avoid; + break-before: avoid; +} +.class { + break-before: avoid-column; +} +.class { + -webkit-column-break-after: avoid; + break-after: avoid; +} +.class { + -webkit-column-break-after: always; + break-after: column; +} +.class { + -webkit-column-break-before: always; + break-before: column; +} diff --git a/crates/swc_css_prefixer/tests/fixture/nested/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/nested/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..7c7b0f3df5e --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/nested/output.defaults-not-ie-11.css @@ -0,0 +1,215 @@ +@-webkit-keyframes test { + 0% { + color: red; + } +} +@-moz-keyframes test { + 0% { + color: red; + } +} +@-o-keyframes test { + 0% { + color: red; + } +} +@keyframes test { + 0% { + color: red; + } +} +@supports (flex-wrap: wrap) { + @-webkit-keyframes test { + 0% { + color: red; + } + } + @-moz-keyframes test { + 0% { + color: red; + } + } + @-o-keyframes test { + 0% { + color: red; + } + } + @keyframes test { + 0% { + color: red; + } + } +} +@supports (flex-wrap: wrap) { + @supports (flex-wrap: wrap) { + @-webkit-keyframes test { + 0% { + color: red; + } + } + @-moz-keyframes test { + 0% { + color: red; + } + } + @-o-keyframes test { + 0% { + color: red; + } + } + @keyframes test { + 0% { + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + color: red; + } + } + } +} +.test { + &.class::-webkit-input-placeholder { + color: red; + } + &.class:-moz-placeholder { + color: red; + } + &.class::-moz-placeholder { + color: red; + } + &.class:-ms-input-placeholder { + color: red; + } + &.class::-ms-input-placeholder { + color: red; + } + &.class::placeholder { + color: red; + } +} +.test { + &.class::-webkit-input-placeholder { + -webkit-appearance: auto; + appearance: auto; + } + &.class:-moz-placeholder { + appearance: auto; + } + &.class::-moz-placeholder { + appearance: auto; + } + &.class:-ms-input-placeholder { + appearance: auto; + } + &.class::-ms-input-placeholder { + appearance: auto; + } + &.class::placeholder { + -webkit-appearance: auto; + appearance: auto; + } +} +.test { + -webkit-appearance: auto; + appearance: auto; + &.class { + color: red; + } +} +.test { + -webkit-appearance: auto; + appearance: auto; + &.class { + -webkit-appearance: auto; + appearance: auto; + } +} +.test { + @supports (foo: bar) { + -webkit-appearance: auto; + appearance: auto; + } +} +.test { + @media (orientation: landscape) { + -webkit-appearance: auto; + appearance: auto; + } +} +.test { + -webkit-appearance: auto; + appearance: auto; + &.class::-webkit-input-placeholder { + -webkit-appearance: auto; + appearance: auto; + } + &.class:-moz-placeholder { + appearance: auto; + } + &.class::-moz-placeholder { + appearance: auto; + } + &.class:-ms-input-placeholder { + appearance: auto; + } + &.class::-ms-input-placeholder { + appearance: auto; + } + &.class::placeholder { + -webkit-appearance: auto; + appearance: auto; + } + @media (orientation: landscape) { + -webkit-appearance: auto; + appearance: auto; + } +} +@media (orientation: landscape) { + .test { + &.class::-webkit-input-placeholder { + -webkit-appearance: auto; + appearance: auto; + } + &.class:-moz-placeholder { + appearance: auto; + } + &.class::-moz-placeholder { + appearance: auto; + } + &.class:-ms-input-placeholder { + appearance: auto; + } + &.class::-ms-input-placeholder { + appearance: auto; + } + &.class::placeholder { + -webkit-appearance: auto; + appearance: auto; + } + } +} +@media (orientation: landscape) { + .test { + -webkit-appearance: auto; + appearance: auto; + &.class { + -webkit-appearance: auto; + appearance: auto; + } + } +} +.test { + -webkit-appearance: none; + appearance: none; + &.class { + -webkit-appearance: auto; + appearance: auto; + &.class { + -webkit-appearance: menulist-button; + appearance: menulist-button; + &.class { + -webkit-appearance: button; + appearance: button; + } + } + } +} diff --git a/crates/swc_css_prefixer/tests/fixture/object-fit/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/object-fit/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..b7552162128 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/object-fit/output.defaults-not-ie-11.css @@ -0,0 +1,6 @@ +.class { + object-fit: contain; +} +.class { + object-position: 20px; +} diff --git a/crates/swc_css_prefixer/tests/fixture/overflow/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/overflow/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..fc829ddc9cb --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/overflow/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + text-overflow: clip; +} diff --git a/crates/swc_css_prefixer/tests/fixture/overscroll-behavior/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/overscroll-behavior/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..eb59cb0049c --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/overscroll-behavior/output.defaults-not-ie-11.css @@ -0,0 +1,12 @@ +.none { + overscroll-behavior: none; +} +.contain { + overscroll-behavior: contain; +} +.auto { + overscroll-behavior: auto; +} +.inherit { + overscroll-behavior: inherit; +} diff --git a/crates/swc_css_prefixer/tests/fixture/perspective/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/perspective/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..e1aed373da1 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/perspective/output.defaults-not-ie-11.css @@ -0,0 +1,6 @@ +.class { + perspective: 20px; +} +.class { + perspective-origin: 20px; +} diff --git a/crates/swc_css_prefixer/tests/fixture/placeholder-shown/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/placeholder-shown/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..222f88e13e3 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/placeholder-shown/output.defaults-not-ie-11.css @@ -0,0 +1,9 @@ +a:-moz-placeholder-shown { + color: red; +} +a:-ms-input-placeholder { + color: red; +} +a:placeholder-shown { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/placeholder/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/placeholder/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..7d1b2df92b3 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/placeholder/output.defaults-not-ie-11.css @@ -0,0 +1,82 @@ +input::-webkit-input-placeholder { + color: red; +} +input:-moz-placeholder { + color: red; +} +input::-moz-placeholder { + color: red; +} +input:-ms-input-placeholder { + color: red; +} +input::-ms-input-placeholder { + color: red; +} +input::placeholder { + color: red; +} +input::-webkit-input-placeholder, +#fs-toggle:-webkit-full-screen { + color: red; +} +input:-moz-placeholder, +#fs-toggle:-moz-full-screen { + color: red; +} +input::-moz-placeholder, +#fs-toggle:-moz-full-screen { + color: red; +} +input:-ms-input-placeholder, +#fs-toggle:-ms-fullscreen { + color: red; +} +input::-ms-input-placeholder, +#fs-toggle:-ms-fullscreen { + color: red; +} +input::placeholder, +#fs-toggle:fullscreen { + color: red; +} +input::-webkit-input-placeholder { + -webkit-backdrop-filter: blur(2px); + backdrop-filter: blur(2px); +} +input:-moz-placeholder { + backdrop-filter: blur(2px); +} +input::-moz-placeholder { + backdrop-filter: blur(2px); +} +input:-ms-input-placeholder { + backdrop-filter: blur(2px); +} +input::-ms-input-placeholder { + backdrop-filter: blur(2px); +} +input::placeholder { + -webkit-backdrop-filter: blur(2px); + backdrop-filter: blur(2px); +} +input.appearance::-webkit-input-placeholder { + -webkit-appearance: none; + appearance: none; +} +input.appearance:-moz-placeholder { + appearance: none; +} +input.appearance::-moz-placeholder { + appearance: none; +} +input.appearance:-ms-input-placeholder { + appearance: none; +} +input.appearance::-ms-input-placeholder { + appearance: none; +} +input.appearance::placeholder { + -webkit-appearance: none; + appearance: none; +} diff --git a/crates/swc_css_prefixer/tests/fixture/position/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/position/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..fe353faaf33 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/position/output.defaults-not-ie-11.css @@ -0,0 +1,7 @@ +.class { + position: relative; +} +.class { + position: -webkit-sticky; + position: sticky; +} diff --git a/crates/swc_css_prefixer/tests/fixture/prefixed/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/prefixed/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..25cc2cca68a --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/prefixed/output.defaults-not-ie-11.css @@ -0,0 +1,101 @@ +.class { + -webkit-appearance: auto; + appearance: auto; +} +.class-1 { + -webkit-appearance: unknown; + appearance: auto; +} +.class-2 { + -webkit-appearance: none; + appearance: none; + -webkit-appearance: auto; + appearance: auto; +} +.class-3 { + appearance: none; + appearance: auto; + -webkit-appearance: auto; +} +.class-4 { + appearance: unknown; + appearance: auto; + -webkit-appearance: unknown; +} +.class-5 { + -webkit-appearance: searchfield; + appearance: auto; + -webkit-appearance: auto; +} +.class-6 { + appearance: auto; + -webkit-appearance: auto; + -webkit-appearance: searchfield; +} +.class-7 { + -webkit-appearance: auto; + appearance: auto; + -webkit-appearance: -webkit-button; + appearance: -webkit-button; +} +.class-8 { + appearance: auto; + -webkit-appearance: -webkit-button; +} +.class-9 { + appearance: auto; + -webkit-appearance: -webkit-button; + -webkit-appearance: -webkit-unknown; +} +.class-10 { + -webkit-appearance: -webkit-button; + appearance: none; +} +.class-11 { + -webkit-animation: rotation-reverse; + animation: rotation-reverse reverse; +} +.class-12 { + -webkit-animation: rotation-reverse 100ms; + animation: rotation-reverse; +} +.class-13 { + display: block; + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; +} +.class-14 { + -webkit-column-break-before: avoid; + -moz-column-break-before: column; + break-before: column; +} +.class-15 { + align-content: flex-start; + -webkit-align-content: flex-start; + -ms-flex-line-pack: start; +} +.class-16 { + -webkit-align-content: flex-start; + -ms-flex-line-pack: start; +} +.class-17 { + -webkit-align-content: flex-start; + align-content: flex-start; + -ms-flex-line-pack: end; + -webkit-align-content: flex-start; + align-content: flex-start; +} +.class-19 { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; +} diff --git a/crates/swc_css_prefixer/tests/fixture/print-color-adjust/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/print-color-adjust/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..d7187b08f28 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/print-color-adjust/output.defaults-not-ie-11.css @@ -0,0 +1,10 @@ +.a { + color-adjust: economy; + -webkit-print-color-adjust: economy; + print-color-adjust: economy; +} +.b { + color-adjust: exact; + -webkit-print-color-adjust: exact; + print-color-adjust: exact; +} diff --git a/crates/swc_css_prefixer/tests/fixture/read-only/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/read-only/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..bb81162f98f --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/read-only/output.defaults-not-ie-11.css @@ -0,0 +1,6 @@ +.d:-moz-read-only { + color: red; +} +.d:read-only { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/read-write/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/read-write/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..319884c529d --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/read-write/output.defaults-not-ie-11.css @@ -0,0 +1,14 @@ +.f:-moz-read-write { + color: red; +} +.f:read-write { + color: red; +} +.f:-moz-read-write, +.g:-moz-read-write { + color: red; +} +.f:read-write, +.g:read-write { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/recovery/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/recovery/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..dbdaf652476 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/recovery/output.defaults-not-ie-11.css @@ -0,0 +1,32 @@ +main { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: __styled-jsx-placeholder; + -ms-flex-direction: __styled-jsx-placeholder; + flex-direction: __styled-jsx-placeholder; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -moz-box-pack: justify; + -ms-flex-pack: justify; + justify-content: space-between; + margin-bottom: var(--geist-gap-double); +} +div { + width: 100%; + max-width: -webkit-calc(100% - __styled-jsx-placeholderpx - var(--geist-gap-double)); + max-width: -moz-calc(100% - __styled-jsx-placeholderpx - var(--geist-gap-double)); + max-width: calc(100% - __styled-jsx-placeholderpx - var(--geist-gap-double)); +} +@media (max-width: __styled-jsx-placeholderpx) { + main { + -webkit-flex-direction: __styled-jsx-placeholder; + -ms-flex-direction: __styled-jsx-placeholder; + flex-direction: __styled-jsx-placeholder; + } + div { + max-width: unset; + } +} diff --git a/crates/swc_css_prefixer/tests/fixture/resolution/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/resolution/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..42f67010a36 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/resolution/output.defaults-not-ie-11.css @@ -0,0 +1,76 @@ +@media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-resolution: 2dppx), (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-resolution: 192dpi) { + .class { + color: red; + } +} +@media (-webkit-min-device-pixel-ratio: 2.5), (min--moz-device-pixel-ratio: 2.5), (min-resolution: 2.5dppx) { + .class { + color: red; + } +} +@media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { + .class { + color: red; + } +} +@media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-resolution: 2x) { + .class { + color: red; + } +} +@media (-webkit-min-device-pixel-ratio: 1.25), (min--moz-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { + .class { + color: red; + } +} +@media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-resolution: 2dppx) { + .class { + color: red; + } +} +@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (min-resolution: 124.8dpi) { + .class { + color: red; + } +} +@media (-webkit-min-device-pixel-ratio: 3), (min--moz-device-pixel-ratio: 3), (min-resolution: 113.38dpcm) { + .class { + color: red; + } +} +::-webkit-input-placeholder { + color: gray; +} +:-moz-placeholder { + color: gray; +} +::-moz-placeholder { + color: gray; +} +:-ms-input-placeholder { + color: gray; +} +::-ms-input-placeholder { + color: gray; +} +::placeholder { + color: gray; +} +.image { + background-image: url(image@1x.png); +} +@media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-resolution: 2dppx) { + .image { + background-image: url(image@2x.png); + } +} +@media (-webkit-min-device-pixel-ratio: 0.34), (min--moz-device-pixel-ratio: 0.34), (min-resolution: 33dpi) { + .class { + color: red; + } +} +@media (-webkit-min-device-pixel-ratio: 0), (min--moz-device-pixel-ratio: 0), (min-resolution: 0dpi) { + .class { + color: red; + } +} diff --git a/crates/swc_css_prefixer/tests/fixture/selection/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/selection/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..0f4d57f476a --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/selection/output.defaults-not-ie-11.css @@ -0,0 +1,18 @@ +.c::-moz-selection { + color: red; +} +.c::selection { + color: red; +} +::-moz-selection { + color: red; +} +::selection { + color: red; +} +::-moz-selection { + color: red; +} +::SeLeCtIoN { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/selector-list-2/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/selector-list-2/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..d9c431467fa --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/selector-list-2/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +div.jsx-5a206f122d1cb32e > span { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/selector-list/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/selector-list/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..4b54e67cfc5 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/selector-list/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.container.jsx-c7c3a8e231c9215a > * { + color: red; +} diff --git a/crates/swc_css_prefixer/tests/fixture/shapes/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/shapes/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..89e064b2d3b --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/shapes/output.defaults-not-ie-11.css @@ -0,0 +1,9 @@ +.class { + shape-margin: 20px; +} +.class { + shape-outside: url("foo.png"); +} +.class { + shape-image-threshold: initial; +} diff --git a/crates/swc_css_prefixer/tests/fixture/snappoints/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/snappoints/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..4e15ad9d5f7 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/snappoints/output.defaults-not-ie-11.css @@ -0,0 +1,15 @@ +.class { + scroll-snap-type: block; +} +.class { + scroll-snap-coordinate: none; +} +.class { + scroll-snap-destination: 400px 600px; +} +.class { + scroll-snap-points-x: none; +} +.class { + scroll-snap-points-y: none; +} diff --git a/crates/swc_css_prefixer/tests/fixture/style-block/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/style-block/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..2ed5bea0f9b --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/style-block/output.defaults-not-ie-11.css @@ -0,0 +1,36 @@ +.class { + &.foo { + -webkit-appearance: auto; + appearance: auto; + } + @media all { + -webkit-appearance: auto; + appearance: auto; + } +} +@media (min-width: 50em) { + .foo { + -webkit-appearance: auto; + appearance: auto; + } + @supports (flex-wrap: wrap) { + .foo { + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + -webkit-appearance: auto; + appearance: auto; + } + } +} +@supports (flex-wrap: wrap) { + .foo { + -webkit-appearance: auto; + appearance: auto; + } + @media (min-width: 50em) { + .foo { + -webkit-appearance: auto; + appearance: auto; + } + } +} diff --git a/crates/swc_css_prefixer/tests/fixture/tab-size/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/tab-size/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..d0c45ad50b1 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/tab-size/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + tab-size: 2; +} diff --git a/crates/swc_css_prefixer/tests/fixture/text-align-last/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/text-align-last/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..c4d364498f1 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/text-align-last/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + text-align-last: left; +} diff --git a/crates/swc_css_prefixer/tests/fixture/text-decoration/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/text-decoration/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..434d7569d5a --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/text-decoration/output.defaults-not-ie-11.css @@ -0,0 +1,32 @@ +.shorthand { + -webkit-text-decoration: overline double red; + -moz-text-decoration: overline double red; + text-decoration: overline double red; +} +.full { + -webkit-text-decoration-style: double; + -moz-text-decoration-style: double; + text-decoration-style: double; +} +.old { + text-decoration: underline; +} +.global { + text-decoration: unset; +} +.skip { + -webkit-text-decoration-skip: spaces; + text-decoration-skip: spaces; +} +.ink-auto { + -webkit-text-decoration-skip: ink; + text-decoration-skip-ink: auto; +} +.ink-all { + -webkit-text-decoration-skip-ink: all; + text-decoration-skip-ink: all; +} +.old-ink { + -webkit-text-decoration-skip: ink; + text-decoration-skip: ink; +} diff --git a/crates/swc_css_prefixer/tests/fixture/text-emphasis/output.css b/crates/swc_css_prefixer/tests/fixture/text-emphasis/output.css index 02cb7c4d41f..b8ebe6e2b44 100644 --- a/crates/swc_css_prefixer/tests/fixture/text-emphasis/output.css +++ b/crates/swc_css_prefixer/tests/fixture/text-emphasis/output.css @@ -1,9 +1,8 @@ .class { - -webkit-text-spacing: none; + -webkit-text-emphasis: none; text-emphasis: none; } .class { - -webkit-text-spacing: filled red; text-emphasis: filled red; -webkit-text-emphasis: filled red; } diff --git a/crates/swc_css_prefixer/tests/fixture/text-emphasis/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/text-emphasis/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..b8ebe6e2b44 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/text-emphasis/output.defaults-not-ie-11.css @@ -0,0 +1,36 @@ +.class { + -webkit-text-emphasis: none; + text-emphasis: none; +} +.class { + text-emphasis: filled red; + -webkit-text-emphasis: filled red; +} +.class { + -webkit-text-emphasis-position: left; + text-emphasis-position: left; +} +.class { + -webkit-text-emphasis-style: circle; + text-emphasis-style: circle; +} +.class { + -webkit-text-emphasis-color: red; + text-emphasis-color: red; +} +a { + -webkit-text-emphasis-position: over left; + text-emphasis-position: over left; +} +em { + -webkit-text-emphasis-position: under right; + text-emphasis-position: under right; +} +.reverse { + -webkit-text-emphasis-position: left over; + text-emphasis-position: left over; +} +.wrong { + -webkit-text-emphasis-position: over; + text-emphasis-position: over; +} diff --git a/crates/swc_css_prefixer/tests/fixture/text-orientation/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/text-orientation/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..ccfacacfab8 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/text-orientation/output.defaults-not-ie-11.css @@ -0,0 +1,6 @@ +.class { + -webkit-writing-mode: vertical-rl; + -ms-writing-mode: tb-rl; + writing-mode: vertical-rl; + text-orientation: mixed; +} diff --git a/crates/swc_css_prefixer/tests/fixture/text-size-adjust/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/text-size-adjust/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..30a9a793dfd --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/text-size-adjust/output.defaults-not-ie-11.css @@ -0,0 +1,9 @@ +.class { + text-align: left; + text-transform: none; + text-shadow: none; + -webkit-text-size-adjust: none; + -moz-text-size-adjust: none; + -ms-text-size-adjust: none; + text-size-adjust: none; +} diff --git a/crates/swc_css_prefixer/tests/fixture/text-spacing/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/text-spacing/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..88e2cd9fe52 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/text-spacing/output.defaults-not-ie-11.css @@ -0,0 +1,3 @@ +.class { + text-spacing: none; +} diff --git a/crates/swc_css_prefixer/tests/fixture/touch-action/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/touch-action/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..546995c6a6c --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/touch-action/output.defaults-not-ie-11.css @@ -0,0 +1,6 @@ +.class { + touch-action: none; +} +.class { + touch-action: manipulation; +} diff --git a/crates/swc_css_prefixer/tests/fixture/transform/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/transform/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..9c7fac4599c --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/transform/output.defaults-not-ie-11.css @@ -0,0 +1,43 @@ +.class { + transform: rotate(30deg); +} +a { + transition: -webkit-transform 1s; + transition: -moz-transform 1s; + transition: -o-transform 1s; + transition: transform 1s; + transform: rotateX(45deg); +} +b { + transform: translateX(45deg); + transform-origin: 0 0; +} +em { + transform: rotateZ(45deg); +} +@-webkit-keyframes anim { + from { + transform: rotate(90deg); + } +} +@-moz-keyframes anim { + from { + transform: rotate(90deg); + } +} +@-o-keyframes anim { + from { + transform: rotate(90deg); + } +} +@keyframes anim { + from { + transform: rotate(90deg); + } +} +.class { + transform-style: flat; +} +.class { + transform: perspective(500px) rotateY(3deg); +} diff --git a/crates/swc_css_prefixer/tests/fixture/transition/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/transition/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..d0830ecacdd --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/transition/output.defaults-not-ie-11.css @@ -0,0 +1,147 @@ +a { + transition: color 200ms, -webkit-transform 200ms; + transition: color 200ms, -moz-transform 200ms; + transition: color 200ms, -o-transform 200ms; + transition: color 200ms, transform 200ms; + transform: rotate(10deg); +} +div { + -webkit-transition-property: filter; + transition-property: filter; + animation-name: rotating; +} +.good { + -webkit-transition-property: filter; + transition-property: filter; + transition-duration: 1s; +} +.good2 { + -webkit-transition-property: color, filter; + transition-property: color, filter; + transition-timing-function: cubic-bezier(0.55, 0, 0.1, 1); +} +.bad { + -webkit-transition-property: color, filter; + transition-property: color, filter; + transition-duration: 1s, 2s; +} +.revert { + transition: 200ms -webkit-transform; + transition: 200ms -moz-transform; + transition: 200ms -o-transform; + transition: 200ms transform; +} +input[type=range]::-moz-range-thumb { + transition: color 200ms, -webkit-transform 200ms; + transition: color 200ms, -moz-transform 200ms; + transition: color 200ms, -o-transform 200ms; + transition: color 200ms, transform 200ms; + transform: rotate(10deg); +} +input[type=range]::-webkit-slider-thumb { + transition: none; + -webkit-transition-property: all; + transition-property: all; +} +button::-moz-submit-invalid { + opacity: 1; + transform: translateX(45px); + transition: opacity 0.5s 2s, -webkit-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, -moz-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, -o-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, transform 0.5s 0.5s; +} +@supports (transition: opacity 0.5s 2s, transform 0.5s 0.5s) { + button::-moz-submit-invalid { + opacity: 1; + transform: translateX(45px); + transition: opacity 0.5s 2s, -webkit-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, -moz-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, -o-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, transform 0.5s 0.5s; + } + button { + opacity: 1; + transform: translateX(45px); + transition: opacity 0.5s 2s, -webkit-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, -moz-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, -o-transform 0.5s 0.5s; + transition: opacity 0.5s 2s, transform 0.5s 0.5s; + } +} +button::-webkit-search-cancel-button { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + transition: color 200ms, -webkit-transform 200ms; + transition: color 200ms, -moz-transform 200ms; + transition: color 200ms, -o-transform 200ms; + transition: color 200ms, transform 200ms; + transform: rotate(10deg); +} +button::-webkit-search-cancel-button { + display: -webkit-box; + display: -webkit-flex; + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-transition: color 200ms, -webkit-transform 200ms; + transition: color 200ms, -webkit-transform 200ms; + transition: color 200ms, -webkit-transform 200ms; + transition: color 200ms, -moz-transform 200ms; + transition: color 200ms, -o-transform 200ms; + transition: color 200ms, transform 200ms; + transition: color 200ms, -webkit-transform 200ms, -webkit-transform 200ms; + transition: color 200ms, -moz-transform 200ms, -webkit-transform 200ms; + transition: color 200ms, -o-transform 200ms, -webkit-transform 200ms; + transition: color 200ms, transform 200ms, -webkit-transform 200ms; + -webkit-transform: rotate(10deg); + transform: rotate(10deg); +} +.a::-webkit-search-cancel-button { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -webkit-flex-flow: row; + -moz-box-orient: horizontal; + -moz-box-direction: normal; + -ms-flex-flow: row; + flex-flow: row; + -webkit-box-ordinal-group: 1; + -webkit-order: 0; + -moz-box-ordinal-group: 1; + -ms-flex-order: 0; + order: 0; + -webkit-box-flex: 0; + -webkit-flex: 0 1 2; + -moz-box-flex: 0; + -ms-flex: 0 1 2; + flex: 0 1 2; + transition: flex 200ms; +} +.no-warn { + -webkit-transition-property: color, opacity; + transition-property: color, opacity; + transition-duration: 1s, 2s; +} +div { + -webkit-transition-property: -webkit-transform; + transition-property: -webkit-transform; + transition-property: -moz-transform; + transition-property: -o-transform; + transition-property: transform; + transform: rotate(10deg); +} +div { + transition: -webkit-calc(1s); + transition: -moz-calc(1s); + transition: calc(1s); +} diff --git a/crates/swc_css_prefixer/tests/fixture/user-select/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/user-select/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..ad7716c7e46 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/user-select/output.defaults-not-ie-11.css @@ -0,0 +1,17 @@ +a { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +b { + -webkit-user-select: contain; + -moz-user-select: contain; + -ms-user-select: element; + user-select: contain; +} +.all { + -webkit-user-select: all; + -moz-user-select: all; + user-select: all; +} diff --git a/crates/swc_css_prefixer/tests/fixture/viewport/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/viewport/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..823e6e60f96 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/viewport/output.defaults-not-ie-11.css @@ -0,0 +1,12 @@ +@-ms-viewport{ + min-width: 640px; + max-width: 800px; +} +@-o-viewport{ + min-width: 640px; + max-width: 800px; +} +@viewport{ + min-width: 640px; + max-width: 800px; +} diff --git a/crates/swc_css_prefixer/tests/fixture/width-size/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/width-size/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..482cd8a8a34 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/width-size/output.defaults-not-ie-11.css @@ -0,0 +1,109 @@ +div { + width: -webkit-fit-content; + width: -moz-fit-content; + width: fit-content; + width: -webkit-max-content; + width: -moz-max-content; + width: max-content; + width: -webkit-min-content; + width: -moz-min-content; + width: min-content; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + width: -webkit-fill-available; + width: -moz-available; + width: stretch; + min-width: -webkit-fit-content; + min-width: -moz-fit-content; + min-width: fit-content; + max-width: -webkit-fit-content; + max-width: -moz-fit-content; + max-width: fit-content; + height: -webkit-fit-content; + height: -moz-fit-content; + height: fit-content; + min-height: -webkit-fit-content; + min-height: -moz-fit-content; + min-height: fit-content; + max-height: -webkit-fit-content; + max-height: -moz-fit-content; + max-height: fit-content; + inline-size: -webkit-fit-content; + inline-size: -moz-fit-content; + inline-size: fit-content; + min-inline-size: -webkit-fit-content; + min-inline-size: -moz-fit-content; + min-inline-size: fit-content; + max-inline-size: -webkit-fit-content; + max-inline-size: -moz-fit-content; + max-inline-size: fit-content; + block-size: -webkit-fit-content; + block-size: -moz-fit-content; + block-size: fit-content; + min-block-size: -webkit-fit-content; + min-block-size: -moz-fit-content; + min-block-size: fit-content; + max-block-size: -webkit-fit-content; + max-block-size: -moz-fit-content; + max-block-size: fit-content; +} +.outdated { + width: -webkit-fill-available; + width: -moz-available; + width: fill; +} +a { + width: -webkit-fill-available; + width: -moz-available; + width: stretch; +} +b { + height: -webkit-max-content; + height: -moz-max-content; + height: max-content; +} +p { + block-size: -webkit-min-content; + block-size: -moz-min-content; + block-size: min-content; + min-inline-size: -webkit-fit-content; + min-inline-size: -moz-fit-content; + min-inline-size: fit-content; +} +.outdated { + width: -webkit-fill-available; + width: -moz-available; + width: fill; +} +.old { + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; +} +.ok { + width: -webkit-calc(100% - var(--jqx-circular-progress-bar-fill-size)); + width: -moz-calc(100% - var(--jqx-circular-progress-bar-fill-size)); + width: calc(100% - var(--jqx-circular-progress-bar-fill-size)); +} +.grid { + grid: -webkit-min-content -webkit-max-content/ -webkit-fit-content(500px); + grid: min-content max-content/ fit-content(500px); +} +.grid-template { + grid-template: -webkit-min-content/ -webkit-fit-content(10px) -webkit-max-content; + grid-template: min-content/ fit-content(10px) max-content; + grid-template: -webkit-max-content 1fr -webkit-max-content -webkit-max-content/ -webkit-max-content 1fr; + grid-template: max-content 1fr max-content max-content/ max-content 1fr; +} +.grid-template-columns { + grid-template-columns: minmax(100px, -webkit-min-content); + grid-template-columns: minmax(100px, min-content); +} +.grid-auto-columns { + grid-auto-columns: -webkit-min-content -webkit-max-content; + grid-auto-columns: min-content max-content; +} +.ignore { + width: -webkit-fill-available; +} diff --git a/crates/swc_css_prefixer/tests/fixture/width/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/width/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..a09b5f91a94 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/width/output.defaults-not-ie-11.css @@ -0,0 +1,96 @@ +.class { + width: auto; +} +.class { + width: unset; +} +.class { + width: initial; +} +.class { + width: inherit; +} +.class { + width: 10; +} +.class { + width: min(); +} +.class { + width: var(--foo-content); +} +.class { + width: var(-content); +} +.class { + width: var(--max-content); +} +.class { + width: --max-content; +} +.class { + width: -webkit-fit-content; + width: -moz-fit-content; + width: fit-content; +} +.class { + width: stackWidth; +} +.class { + min-width: -webkit-max-content; + min-width: -moz-max-content; + min-width: max-content; +} +.class { + max-width: -webkit-min-content; + max-width: -moz-min-content; + max-width: min-content; +} +.class { + height: -webkit-fill-available; + height: -moz-available; + height: fill-available; +} +.class { + max-height: -webkit-fit-content; + max-height: -moz-fit-content; + max-height: fit-content; +} +.class { + width: -webkit-fill-available; + width: -moz-available; + width: stretch; +} +.class { + width: -webkit-fill-available !important; + width: -moz-available !important; + width: stretch !important; +} +.class { + min-block-size: -webkit-max-content; + min-block-size: -moz-max-content; + min-block-size: max-content; +} +.class { + min-inline-size: -webkit-max-content; + min-inline-size: -moz-max-content; + min-inline-size: max-content; +} +.class { + width: max(250px, 100px); +} +.class { + height: min(150px, 200px); +} +.class { + min-width: min(100px, 50px); +} +.class { + max-width: max(150px, 200px); +} +.class { + min-height: max(100px, 50px); +} +.class { + max-height: min(150px, 200px); +} diff --git a/crates/swc_css_prefixer/tests/fixture/writing-mode/output.defaults-not-ie-11.css b/crates/swc_css_prefixer/tests/fixture/writing-mode/output.defaults-not-ie-11.css new file mode 100644 index 00000000000..e2ca501b995 --- /dev/null +++ b/crates/swc_css_prefixer/tests/fixture/writing-mode/output.defaults-not-ie-11.css @@ -0,0 +1,110 @@ +.one { + -webkit-writing-mode: horizontal-tb; + -ms-writing-mode: lr-tb; + writing-mode: horizontal-tb; +} +.two { + -webkit-writing-mode: vertical-rl; + -ms-writing-mode: tb-rl; + writing-mode: vertical-rl; +} +.three { + -webkit-writing-mode: vertical-lr; + -ms-writing-mode: tb-lr; + writing-mode: vertical-lr; +} +.rtl-vertical-rl { + -webkit-writing-mode: vertical-rl; + -ms-writing-mode: bt-rl; + writing-mode: vertical-rl; + direction: rtl; +} +.rtl-vertical-lr { + -webkit-writing-mode: vertical-lr; + -ms-writing-mode: bt-lr; + writing-mode: vertical-lr; + direction: rtl; +} +.rtl-horizontal-tb { + -webkit-writing-mode: horizontal-tb; + -ms-writing-mode: rl-tb; + writing-mode: horizontal-tb; + direction: rtl; +} +.rtl-horizontal-tb-override-direction { + -webkit-writing-mode: horizontal-tb; + -ms-writing-mode: lr-tb; + writing-mode: horizontal-tb; + direction: rtl; + direction: ltr; +} +.class { + -webkit-writing-mode: none; + -ms-writing-mode: none; + writing-mode: none; +} +.class { + -webkit-writing-mode: vertical-lr; + -ms-writing-mode: tb-lr; + writing-mode: vertical-lr; +} +.class { + -webkit-writing-mode: vertical-rl; + -ms-writing-mode: tb-rl; + writing-mode: vertical-rl; +} +.class { + -webkit-writing-mode: horizontal-tb; + -ms-writing-mode: lr-tb; + writing-mode: horizontal-tb; +} +.class { + -webkit-writing-mode: sideways-rl; + writing-mode: sideways-rl; +} +.class { + -webkit-writing-mode: sideways-lr; + writing-mode: sideways-lr; +} +@-ms-viewport{ + -ms-writing-mode: rl-tb; + writing-mode: horizontal-tb; + direction: rtl; +} +@-o-viewport{ + writing-mode: horizontal-tb; + direction: rtl; +} +@viewport{ + -webkit-writing-mode: horizontal-tb; + -ms-writing-mode: rl-tb; + writing-mode: horizontal-tb; + direction: rtl; +} +@-webkit-keyframes test { + 100% { + -webkit-writing-mode: horizontal-tb; + writing-mode: horizontal-tb; + direction: rtl; + } +} +@-moz-keyframes test { + 100% { + writing-mode: horizontal-tb; + direction: rtl; + } +} +@-o-keyframes test { + 100% { + writing-mode: horizontal-tb; + direction: rtl; + } +} +@keyframes test { + 100% { + -webkit-writing-mode: horizontal-tb; + -ms-writing-mode: rl-tb; + writing-mode: horizontal-tb; + direction: rtl; + } +} diff --git a/crates/swc_css_prefixer/tests/prefixer.rs b/crates/swc_css_prefixer/tests/prefixer.rs index ab23ab5ca5b..3e837829ce6 100644 --- a/crates/swc_css_prefixer/tests/prefixer.rs +++ b/crates/swc_css_prefixer/tests/prefixer.rs @@ -7,19 +7,23 @@ use std::path::PathBuf; +use preset_env_base::query::{Query, Targets}; use swc_css_ast::Stylesheet; use swc_css_codegen::{ writer::basic::{BasicCssWriter, BasicCssWriterConfig}, CodegenConfig, Emit, }; use swc_css_parser::{parse_file, parser::ParserConfig}; -use swc_css_prefixer::prefixer; +use swc_css_prefixer::{options::Options, prefixer}; use swc_css_visit::VisitMutWith; use testing::NormalizedOutput; -#[testing::fixture("tests/fixture/**/input.css")] -fn fixture(input: PathBuf) { - let output = input.parent().unwrap().join("output.css"); +fn prefix(input: PathBuf, options: Options, suffix: Option<&str>) { + let parent = input.parent().unwrap(); + let output = match suffix { + Some(suffix) => parent.join("output.".to_owned() + suffix + ".css"), + _ => parent.join("output.css"), + }; testing::run_test2(false, |cm, handler| { // @@ -38,7 +42,7 @@ fn fixture(input: PathBuf) { err.to_diagnostics(&handler).emit(); } - ss.visit_mut_with(&mut prefixer()); + ss.visit_mut_with(&mut prefixer(options)); let mut s = String::new(); { @@ -55,3 +59,21 @@ fn fixture(input: PathBuf) { }) .unwrap(); } + +#[testing::fixture("tests/fixture/**/input.css")] +fn test_without_env(input: PathBuf) { + prefix(input, Options::default(), None) +} + +#[testing::fixture("tests/fixture/**/input.css")] +fn test_with_env(input: PathBuf) { + prefix( + input, + Options { + env: Some(Targets::Query(Query::Single(String::from( + "defaults, not IE 11", + )))), + }, + Some("defaults-not-ie-11"), + ) +}