Fix prefixing mask-image

Fixes #238
parcel-bundler · Jul 31, 2022 · 713ce2e · 713ce2e
1 parent b658cb9
commit 713ce2e
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 5 deletions.
diff --git a/src/lib.rs b/src/lib.rs
@@ -17728,7 +17728,9 @@ mod tests {
         .foo {
           -webkit-mask-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ff0f0e), to(#7773ff));
           -webkit-mask-image: -webkit-linear-gradient(#ff0f0e, #7773ff);
+          -webkit-mask-image: linear-gradient(#ff0f0e, #7773ff);
           mask-image: linear-gradient(#ff0f0e, #7773ff);
+          -webkit-mask-image: linear-gradient(lch(56.208% 136.76 46.312), lch(51% 135.366 301.364));
           mask-image: linear-gradient(lch(56.208% 136.76 46.312), lch(51% 135.366 301.364));
         }
       "#},
@@ -17738,6 +17740,36 @@ mod tests {
       },
     );
 
+    prefix_test(
+      ".foo { mask-image: linear-gradient(lch(56.208% 136.76 46.312), lch(51% 135.366 301.364)) }",
+      indoc! { r#"
+        .foo {
+          -webkit-mask-image: linear-gradient(#ff0f0e, #7773ff);
+          mask-image: linear-gradient(#ff0f0e, #7773ff);
+          -webkit-mask-image: linear-gradient(lch(56.208% 136.76 46.312), lch(51% 135.366 301.364));
+          mask-image: linear-gradient(lch(56.208% 136.76 46.312), lch(51% 135.366 301.364));
+        }
+      "#},
+      Browsers {
+        chrome: Some(95 << 16),
+        ..Browsers::default()
+      },
+    );
+
+    prefix_test(
+      ".foo { mask-image: linear-gradient(red, green) }",
+      indoc! { r#"
+        .foo {
+          -webkit-mask-image: linear-gradient(red, green);
+          mask-image: linear-gradient(red, green);
+        }
+      "#},
+      Browsers {
+        chrome: Some(95 << 16),
+        ..Browsers::default()
+      },
+    );
+
     prefix_test(
       ".foo { mask: linear-gradient(lch(56.208% 136.76 46.312), lch(51% 135.366 301.364)) 40px 20px }",
       indoc! { r#"

diff --git a/src/properties/masking.rs b/src/properties/masking.rs
@@ -856,20 +856,28 @@ impl<'i> MaskHandler<'i> {
             // Match prefix of fallback. e.g. -webkit-linear-gradient
             // can only be used in -webkit-mask-image.
             // However, if mask-image is unprefixed, gradients can still be.
-            let mut p = fallback.iter().fold(prefix, |p, image| p & image.get_vendor_prefix());
+            let mut p = fallback
+              .iter()
+              .fold(VendorPrefix::empty(), |p, image| p | image.get_vendor_prefix())
+              - VendorPrefix::None
+              & prefix;
             if p.is_empty() {
               p = prefix;
             }
             dest.push(Property::MaskImage(fallback, p))
           }
         }
 
-        let p = images.iter().fold(prefix, |p, image| p & image.get_vendor_prefix());
-        if !p.is_empty() {
-          prefix = p;
+        let mut p = images
+          .iter()
+          .fold(VendorPrefix::empty(), |p, image| p | image.get_vendor_prefix())
+          - VendorPrefix::None
+          & prefix;
+        if p.is_empty() {
+          p = prefix;
         }
 
-        dest.push(Property::MaskImage(images, prefix));
+        dest.push(Property::MaskImage(images, p));
       }
     }