iOS/WKWebViewでのSVGのランダムグリッチレンダリング

Question

私たちのiOSアプリにSVGアイコンを表示するときに、間違った（非常に時折）レンダリンググリッチが発生しています。これはWKWebViewに基づいています。

Safariでランダムに（まったく関係のない）CSSクラスを変更してページをデバッグすると、グリッチがなくなるかランダムに戻ってくるというCSSに結びついているようです。しかし、それには韻や理由もなく、信頼性をもって再現する方法はありません。

誰かが思考を持っているのか、これまでに遭遇したことがあるのか​​不思議です。

あなたはグリッチのカップルの種類があります見ることができるように：明白な文字化けアイコンは、だけでなく、唯一1つのメトリック]タブがあると想定しています。その部分は、 "Metrics"というラベルがテキストであり、アイコンの一部でもないので、特に奇妙です！

要素をデバッグすると、デバッガで表示されるようになります。要素には右の背景画像URLがあり、ラベルは必要です（要素ツリーのラベルにカーソルを置いても、テキストが完全に間違っていてもページのラベルが強調表示されます）。それは何とか実際のレンダリングで完全に台無しになるようです。

Answer 1

私たちは最終的にこれを解決し、結局のところSVGとは関係がないことが判明しました。この犯人は実際には適用されていたCSSのグレースケールフィルタで、おそらく他の何かと組み合わせて使用​​されていました。つまり、グレースケールフィルタを削除すると、グリッチのあるレンダリングが修正されました。