border-image-source not rendering on Firefox

[jsnkuhn]

There's an issue on Firefox with border-image where it will overwrite the fallback border as intended (in the example below the double, solid, orange lines) but the border-image-source will not render on the element. You can however make the border-image-source appear by tabbing away and then returning to the codepen or dragging the code windows over the page view....

a hard reload is required to make it happen consistently

https://codepen.io/jsnkuhn/pen/PoJbWwy?editors=1100

[jsnkuhn]

this might just be a Firefox bug with -moz-element() not working with anything other than background: https://bugzilla.mozilla.org/show_bug.cgi?id=711326

[jsnkuhn]

also seems like this could be a general performance issue with the polyfill in Firefox. I'm really not sure.

Another example: https://codepen.io/jsnkuhn/pen/NWgBBdO?editors=0100

What I hope will be a complete PaintAPI CSS corner-shape polyfill. In Firefox it performs OK onload but if you change any of the custom properties, to let's say change a border-width, all of the examples need to re-paint and this takes a while. Some times like above you need to resize the viewport to get the examples to re-paint.