JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.createjs.com/createjs-2014.12.12.min.js"></script>
<body onload="init();">
    <canvas id="canvas" width="300" height="200">
    </canvas>
    <button onclick="zoom()">zoom it</button>
</body>

JavaScript

var stage;
var container;
function zoom(){
    document.body.style.zoom = 2;
    container.scaleX = container.scaleY = 2;

}
function init() {
    
    stage = new createjs.Stage("canvas");
    container = new createjs.Container();
    var rect1 = new createjs.Shape();
    rect1.graphics.beginFill("#ff0000").drawRect(10, 10, 100, 100);
    rect1.name = "rect1";
    container.addChild(rect1);
    var rect2 = new createjs.Shape();
    rect2.name = "rect2";
    rect2.graphics.beginFill("#00ff00").drawRect(120, 10, 100, 100);
    container.addChild(rect2);
    stage.on('stagemousedown', onClick);
//    container.addEventListener('mousedown', onClick2 );
    stage.addChild( container );

    stage.update();
}

function onClick(e) {
    console.log( stage.getObjectUnderPoint(e.stageX, e.stageY), e.stageX + " " + e.stageY );
    alert(stage.getObjectUnderPoint(e.stageX, e.stageY));
}

function onClick2(e) {
    console.log( stage.getObjectUnderPoint(e.stageX, e.stageY), e.stageX + " " + e.stageY );
    alert("hola " + stage.getObjectUnderPoint(e.stageX, e.stageY));
}