Search code examples
aframe

mouse cursor only works when aframe inspector is open?


When I add

<a-scene
    cursor="rayOrigin: mouse;"
    raycaster="objects: .rayclick;"
>

and

<a-entity id="clickabl1" class="rayclick" rayclick>

and

AFRAME.registerComponent('rayclick', {
    init: function () {
        this.el.addEventListener('click',  (evt) => {
            alert(`I was clicked at ${this.el.id}`);
        });
    }
});

I end up with a strange situation... seemingly, the code does nothing, no click functionality at all--except, when I open the aframe inspector, suddenly it works perfectly. Then, when I close the inspector, back to nothing working.

What could this possibly mean?


Solution

  • I ended up later discovering that the inspector uses a mouse cursor that has no objects filter, which can make it work whenever other cursors might fail. I've also found that there are some subtle, difficult to reproduce bugs with cursors at times in current A-Frame.

    But that explains why the cursors likely worked in the inspector, but not otherwise.

    There is also the question of how the ray from a mouse cursor is drawn--its origin is going to be different when the inspector is open, so analyze that closely. (This is where I start finding subtle errors, especially if you adjust it after creating it.)