fabric.js fill a SVG or a PNG with a PNG pattern

I'm currently trying to use the fabric.js library to fill a PNG or a SVG with a pattern. I need to fill only the part that is not transparent. I tried to get some inspiration from there, but couldn't make it work as it is explained.

Here is my pattern: PATTERN

Here is my PNG template: PNG TEMPLATE

I created a similar white SVG as it seems easier to to what I wan't with SVG: Here

// GET AND INIT CANVAS (400x400)
canvas = new fabric.Canvas('canvas');

// MY PATHS
let patternURL = "../images/background1.jpg";
let SVGURL = "../svg/test.svg";

// CREATE MY SVG ELEMENT
fabric.loadSVGFromURL(SVGURL, function(objects, options) {
    // CREATE MY PATTERN IMAGE
    fabric.Image.fromURL(patternURL, function(patternImage) {
        svg = fabric.util.groupSVGElements(objects, options);
        svg = svg.set({"opacity": 1});
        svg.getObjects().forEach(function(e) {
            // IF I DON'T USE THIS LINE, THE SVG REMAIN WHITE
            e.fill = patternImage
        });

        canvas.add(svg);
    });
});

Here is what I have after the execution of my code: RESULT

NB: I can move the PNG, and if I add canvas.add(patternImage); before adding the SVG, I get this result: RESULT_2 (so the pattern is loaded as it should).

I think i'm getting pretty close, must be missing the KEY line in the code. If you have any information or if you could redirect me into the right place ?