SVG tessellated pattern scaling

I have a complicated tessellation in an svg, this pattern is not entirely visible in the viewbox.

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="350pt" height="350pt" viewBox="0 0 350 350" enable-background="new 0 0 350 350" xml:space="preserve">

https://jsfiddle.net/86u46wys/1/

patternTransform is being set by matrix, which is set by a slider on webpage. In webkit browsers all works as expected, the slider adjusts the scale of the pattern in perfect tessellation. My issue is in Firefox, Edge and IE the pattern scales up and down but the viewbox is also adjusted. What I am seeing is a contiguous pattern that begins to get space between boxes when adjusted up and down.