ArcCamera <iframe> mouseUp not triggered


I put BabylonJS scene with the ArcCamera in StoryBook and noticed that when you:

  1. press the mouse button to drag your camera around scene
  2. drag it outside frame of StoryBook (still holding the button to drag)
  3. realis mouse button outside the StoryBook iframe
  4. return to the iframe with a released mouse, the ArcCamera is still dragging your view.

So it’s not detecting mouseUp outside the iframe.


Hello, this is expected has the event are not captured outside the boundary of the window (or the iframe).

I think you can add an observer to engine.onCanvasBlurObservable and try to call scene.simulatePointerUp() in this case

The iframe.

You can make a test for yourself.

I do not think that putting observer is a solution for a framework bug don’t you think??

You should detect mouse Up outside by default.


this is expected has the event are not captured outside the boundary of the window (or the iframe).

By that I mean it is because the browser DOES NOT send us the up event.

Sorry to resurrect this old post, but is there any modern mitigation for this problem? I’ve tried the method above (simulatePointerUp), which does not work for me at all (besides onCanvasBlurObservable being the wrong abstraction, since the canvas does not lose focus when dragging out of bounds). Dispatching a mouseup on canvas or the iframe document didn’t work either. Any ideas how to tackle this?

I suggest creating a new thread with maybe a repro if possible


I’m facing the same issue. Is this been resolved somehow?


@peterimg Will you (create a new thread)? Can you add some sort of ‘context’ to it? Sounds like a point to may be investigate nowadays, no?

Everything is in this thread so why do you need a new one?

Make arc camera looking at the box, put in in a Storybook. Make a Storybook preview for mobile or something small. And start rotating the camera so the mouse will get out of the preview.

Every time there will be this error.

So everything is in this Thread now. There is not just a solution.

If you want me to copy and past it in new Bug ok I can do it but what is the point?


Add an event listener to document and use Node.contains() to find whether the target of the event is inside your specified element.

var specifiedElement = document.getElementById('a');

//I'm using "click" but it works with any event
document.addEventListener('click', function(event) {
  var isClickInside = specifiedElement.contains(;

  if (!isClickInside) {
    //the click was outside the specifiedElement, do something

Personally, I am not asking for anything. This was simply a quote from the above.
Point is I will eventually start getting interested in parts like (quote, sry again;)

All I can add is I hope you will (finally) find/obtain a solution for your case,

The problem is not with starting but with dragging the mouse with a button-down outside Iframe.

I will personally like to have the camera rotating still until I release the button even outside of the iframe.

So the solution is not to the problem we have. The problem is with the drag. But only in Storybook.