Skip to content

Commit

Permalink
feat(css/prefixer): overflow
Browse files Browse the repository at this point in the history
  • Loading branch information
@alexander-akait
alexander-akait committed Dec 19, 2022
1 parent 23e27a9 commit 36c20df
Show file tree
Hide file tree
Showing 8 changed files with 259 additions and 12 deletions.
24 changes: 24 additions & 0 deletions crates/swc_css_prefixer/data/prefixes_and_browsers.json
View file
Expand Up @@ -3913,6 +3913,30 @@
"samsung": "11.2"
}
],
"overflow": [
{
"chrome": "4",
"edge": "12",
"safari": "3.1",
"firefox": "2",
"opera": "10",
"ie": "6",
"ios": "3.2",
"samsung": "4",
"android": "2.1"
},
{
"chrome": "67",
"edge": "17",
"safari": "13",
"firefox": "60",
"opera": "54",
"ie": "11",
"ios": "13.3",
"samsung": "14.0",
"android": "4.4.4"
}
],
"display:multi-keyword-values": [
{
"chrome": "4",
Expand Down
25 changes: 20 additions & 5 deletions crates/swc_css_prefixer/src/prefixer.rs
View file
Expand Up @@ -1845,7 +1845,7 @@ impl VisitMut for Prefixer {
}
}
} else if n.value.len() == 2
&& should_prefix("display:multi-keyword-values", self.env, true)
&& should_prefix("display:multi-keyword-values", self.env, false)
{
if let (
Some(ComponentValue::Ident(first)),
Expand Down Expand Up @@ -1969,7 +1969,7 @@ impl VisitMut for Prefixer {
}
}
} else if n.value.len() == 3
&& should_prefix("display:multi-keyword-values", self.env, true)
&& should_prefix("display:multi-keyword-values", self.env, false)
{
if let (
Some(ComponentValue::Ident(first)),
Expand Down Expand Up @@ -2296,7 +2296,7 @@ impl VisitMut for Prefixer {
);
}

"opacity" if should_prefix("opacity", self.env, true) => {
"opacity" if should_prefix("opacity", self.env, false) => {
let old_value = match n.value.get(0) {
Some(ComponentValue::Percentage(percentage)) => Some(percentage.value.value),
_ => None,
Expand Down Expand Up @@ -3188,6 +3188,21 @@ impl VisitMut for Prefixer {
add_declaration!(Prefix::O, "-o-object-position", None);
}

"overflow" if should_prefix("overflow", self.env, false) && n.value.len() == 2 => {
if let (
Some(left @ ComponentValue::Ident(box first)),
Some(right @ ComponentValue::Ident(box second)),
) = (n.value.get(0), n.value.get(1))
{
if first.value.eq_ignore_ascii_case(&second.value) {
add_declaration!("overflow", Some(Box::new(|| { vec![left.clone()] })));
} else {
add_declaration!("overflow-x", Some(Box::new(|| { vec![left.clone()] })));
add_declaration!("overflow-y", Some(Box::new(|| { vec![right.clone()] })));
}
}
}

"tab-size" => {
add_declaration!(Prefix::Moz, "-moz-tab-size", None);
add_declaration!(Prefix::O, "-o-tab-size", None);
Expand Down Expand Up @@ -3343,7 +3358,7 @@ impl VisitMut for Prefixer {
add_declaration!(Prefix::Moz, "-moz-border-radius-bottomleft", None);
}

"src" if should_prefix("font-face-format-ident", self.env, true) => {
"src" if should_prefix("font-face-format-ident", self.env, false) => {
let mut new_declaration = n.clone();

font_face_format_old_syntax(&mut new_declaration);
Expand Down Expand Up @@ -3394,7 +3409,7 @@ impl VisitMut for Prefixer {
}));
}

if should_prefix("calc-nested", self.env, true) {
if should_prefix("calc-nested", self.env, false) {
let mut value = n.value.clone();

replace_calc(&mut value, None);
Expand Down
69 changes: 67 additions & 2 deletions crates/swc_css_prefixer/tests/fixture/overflow/input.css
View file
@@ -1,3 +1,68 @@
.class {
text-overflow: clip;
html.single-overflow {
overflow: hidden;
}

html.double-overflow {
overflow: hidden auto;
}

html.double-overflow {
overflow: auto auto;
}

html.double-overflow {
overflow: hidden /* a comment */ auto;
}

html.double-overflow {
overflow: hidden auto;
}

html.double-overflow {
overflow: hidden auto;
}

.order-0 {
-webkit-overflow: hidden auto;
}

.order-1 {
-moz-overflow: hidden auto;
}

.order-2 {
-ms-overflow: hidden auto;
}

.order-3 {
-o-overflow: hidden auto;
}

.order-4 {
--overflow: hidden auto;
}

.order-5 {
foo-overflow: hidden auto;
}

/* overflow: hidden auto; */

.content {
content: 'overflow: hidden auto;';
}

.important {
overflow: hidden auto !important;
}

@supports (overflow: hidden auto) {
.support {
overflow: hidden auto;
}
}
@keyframes KEYFRAMES {
50% {
overflow: hidden auto;
}
}
90 changes: 87 additions & 3 deletions crates/swc_css_prefixer/tests/fixture/overflow/output.css
View file
@@ -1,4 +1,88 @@
.class {
-o-text-overflow: clip;
text-overflow: clip;
html.single-overflow {
overflow: hidden;
}
html.double-overflow {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
html.double-overflow {
overflow: auto;
overflow: auto auto;
}
html.double-overflow {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
html.double-overflow {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
html.double-overflow {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
.order-0 {
-webkit-overflow: hidden auto;
}
.order-1 {
-moz-overflow: hidden auto;
}
.order-2 {
-ms-overflow: hidden auto;
}
.order-3 {
-o-overflow: hidden auto;
}
.order-4 {
--overflow: hidden auto;
}
.order-5 {
foo-overflow: hidden auto;
}
.content {
content: 'overflow: hidden auto;';
}
.important {
overflow-x: hidden !important;
overflow-y: auto !important;
overflow: hidden auto !important;
}
@supports ((overflow: hidden auto) or (overflow-x: hidden) or (overflow-y: auto)) {
.support {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
}
@-webkit-keyframes KEYFRAMES {
50% {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
}
@-moz-keyframes KEYFRAMES {
50% {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
}
@-o-keyframes KEYFRAMES {
50% {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
}
@keyframes KEYFRAMES {
50% {
overflow-x: hidden;
overflow-y: auto;
overflow: hidden auto;
}
}
53 changes: 51 additions & 2 deletions crates/swc_css_prefixer/tests/fixture/overflow/output.defaults-not-ie-11.css
View file
@@ -1,3 +1,52 @@
.class {
text-overflow: clip;
html.single-overflow {
overflow: hidden;
}
html.double-overflow {
overflow: hidden auto;
}
html.double-overflow {
overflow: auto auto;
}
html.double-overflow {
overflow: hidden auto;
}
html.double-overflow {
overflow: hidden auto;
}
html.double-overflow {
overflow: hidden auto;
}
.order-0 {
-webkit-overflow: hidden auto;
}
.order-1 {
-moz-overflow: hidden auto;
}
.order-2 {
-ms-overflow: hidden auto;
}
.order-3 {
-o-overflow: hidden auto;
}
.order-4 {
--overflow: hidden auto;
}
.order-5 {
foo-overflow: hidden auto;
}
.content {
content: 'overflow: hidden auto;';
}
.important {
overflow: hidden auto !important;
}
@supports (overflow: hidden auto) {
.support {
overflow: hidden auto;
}
}
@keyframes KEYFRAMES {
50% {
overflow: hidden auto;
}
}
3 changes: 3 additions & 0 deletions crates/swc_css_prefixer/tests/fixture/text-overflow/input.css
View file
@@ -0,0 +1,3 @@
.class {
text-overflow: clip;
}
4 changes: 4 additions & 0 deletions crates/swc_css_prefixer/tests/fixture/text-overflow/output.css
View file
@@ -0,0 +1,4 @@
.class {
-o-text-overflow: clip;
text-overflow: clip;
}
3 changes: 3 additions & 0 deletions crates/swc_css_prefixer/tests/fixture/text-overflow/output.defaults-not-ie-11.css
View file
@@ -0,0 +1,3 @@
.class {
text-overflow: clip;
}

0 comments on commit 36c20df

Please sign in to comment.