Bug 305065 – REGRESSION(294844@main): svg/custom/grayscale-gradient-mask-2.svg is broken

• Component: SVG
• Status: RESOLVED DUPLICATE

[Nikolas Zimmermann]

See screenshot Chrome is on top, Safari at the bottom.

[Nikolas Zimmermann]

Created attachment 477933 [details]
Screenshot

[Alexey Proskuryakov]

This test passes on bots, and LayoutTests/svg/custom/grayscale-gradient-mask-2-expected.txt was last modified in 2012. I can reproduce the test rendering differently in Safari and Chrome indeed.

Could you please clarify when this regressed, was there a version where it worked properly?

[Radar WebKit Bug Importer]

<rdar://problem/168167012>

[Ahmad Saleem]

https://jsfiddle.net/wLpagkbt/ <- matches on Firefox Nightly 148 & Chrome 143.

[Karl Dubost]

Created attachment 478028 [details]
rendering in safari, firefox, chrome

Safari Technology Preview  234          21624.1.6
Firefox Nightly            148.0a1       14826.1.4
Google Chrome Canary       145.0.7632.3  7632.3

[Karl Dubost]

<svg viewBox="0 0 820 320" version="1.1" xmlns="http://www.w3.org/2000/svg">


  <defs>
    <linearGradient id="Gradient" gradientUnits="userSpaceOnUse" x1="0" y1="0" x2="800" y2="0">
      <stop offset="0" stop-color="white" stop-opacity="1"/> <!-- this end is filled -->
      <stop offset="1" stop-color="black" stop-opacity="1"/>
    </linearGradient>
  </defs>

  <mask id="Mask1" 
        maskUnits="userSpaceOnUse" 
        x="0" y="0" 
        width="800" height="100">
     <rect x="0" y="0" width="800" height="100" fill="url(#Gradient)"/>
  </mask>

  <mask id="Mask2" 
        maskUnits="userSpaceOnUse" 
        x="0" y="100" 
        width="800" height="100" 
        color-interpolation="linearRGB">
     <rect x="0" y="100" width="800" height="100" fill="url(#Gradient)"/>
  </mask>

  <mask id="Mask3" 
        maskUnits="userSpaceOnUse" 
        x="0" y="200" 
        width="800" height="100" 
        color-interpolation="sRGB">
     <rect x="0" y="200" width="800" height="100" fill="url(#Gradient)"/>
  </mask>

  <rect x="0" y="0" width="800" height="300" fill="#FF8080"/>
  <rect x="0" y="0" width="800" height="100" fill="blue" mask="url(#Mask1)"/>
  <rect x="0" y="100" width="800" height="100" fill="blue" mask="url(#Mask2)"/>
  <rect x="0" y="200" width="800" height="100" fill="blue" mask="url(#Mask3)"/>

</svg>

[Karl Dubost]

I wonder if there is a need for a simpler test case to better show the issue.

[Said Abou-Hallawa]

This is a regression of 294844@main. Bug 305066 was also found to be another regression of this change. Let's dupe this one to bug 305066.

*** This bug has been marked as a duplicate of bug 305066 ***