SVG: Issue with multiple masks in different svg

问题

I came across a strange problem using svg filter and masks.

Let's say I have an svg file containg these filters and masks:

<filter id="om-outline">
<feMorphology result="offset" in="SourceGraphic" operator="dilate" radius="3"/>
<feComposite in="offset" in2="SourceGraphic" operator="out" result="stroke" />
<feFlood flood-color="#79868d" result="COLOR-red-2" />
<feComposite in="COLOR-red-2" in2="stroke" operator="in" result="BEVEL_41" />
</filter>

<mask id="outline-mask">
<rect cx="0" cy="0" width="341" height="375" fill="black"/>
<!-- some more elements here that create the silhouette of my actual svg graphic -->
</mask>

using this filter and mask, creates a nice outline arround my animating svg graphic

everything is working as expected so far now, but when I add another graphic, using the same technic to create an outline, this happens:

somehow the second graphic uses the mask and outline of the first graphic, even though I used different ids for the reference.

This only happens in Firefox and Internet Explorer, Safari and Chrome seem to work as expected.

来源：https://stackoverflow.com/questions/40482500/svg-issue-with-multiple-masks-in-different-svg