Css Chrome未呈现clipPath设置为objectBoundingBox中SVG文本元素的特定字体大小

我刚刚发现了clipPathUnits=“objectBoundingBox”，并且它在大部分情况下按照预期工作

但是，当剪切遮罩中包含文本元素且字体大小设置为0.5或以下时，Chrome不起作用。使用大于0.6的字体大小可以正常工作

此代码笔在Firefox中应该可以正常工作，但在Chrome中会失败，除非您将字体大小调整为.6或更大。

我是不是遗漏了某个webkit前缀？我在电视上看不到这个特别的问题

*{边距：0；填充：0；}
svg{边框：1px实心红色；}
.clipped容器{宽度：500px；高度：200px；边框：1px纯绿色；}
.clipped{宽度：100%；高度：100%；背景色：绿色；-webkit剪辑路径：url（'/#clipper'）；}
赫拉

你会发现一个有用的工具看起来像一个Chrome bug。你会发现一个有用的工具看起来像一个Chrome bug。

<style>
  * { margin: 0; padding: 0; } 
  svg { border: 1px solid red; }
  .clipped-container { width: 500px; height: 200px; border: 1px solid green;}
  .clipped { width: 100%; height: 100%; background-color: green; -webkit-clip-path: url('/#clipper'); }
</style>

<svg width="500px" height="200px">
  <defs>
    <clipPath id="clipper" clipPathUnits="objectBoundingBox">
      <text x="0" y=".8" font-size=".6" textLength="1">Hola</text>
    </clipPath>
  </defs>

  <rect x="0" y"0" width="500px" height="200px" fill="red" clip-path="url(#clipper)"></rect>
</svg>

<div class="clipped-container">
  <div class="clipped"></div>
</div>