JSFiddle - React, Tailwind, and code Playground

HTML

<canvas width="400" height="400" id="canvas"></canvas>
<img id="info" style="display: none" src="http://upload.wikimedia.org/wikipedia/en/3/31/Imbox_notice.png" >

JavaScript

// -----------------------------------------------------------
// This is my subclass

var IRect = fabric.util.createClass(fabric.Rect, {
    type: 'iRect',
    initialize: function(options) {
        options || (options = { });
        this.callSuper('initialize', options);
        
        // var canvas = ??? how to get the canvas where this is displayed ?
        // canvas.on('mouse:up', function(){...}
    },
    
    fromObject: function (object, callback) {
        return new IRect(object);
    },
    
    toObject: function() {
        return fabric.util.object.extend(this.callSuper('toObject'), {});
    },
    
    _render: function(ctx) {
        this.callSuper('_render', ctx);
        var c = document.getElementById('canvas');
        var img = document.getElementById('info');
        c.getContext('2d').drawImage(img, -this.width/2, -this.height/2);
    }
});

// -----------------------------------------------------------
// This code will go to my HTML file

var canvas = new fabric.Canvas('canvas');        

var iRect = new IRect({
    width: 200,
    height: 100,
    left: 100,
    top: 50,
    fill: '#888'
});
canvas.add(iRect);
canvas.renderAll();