Screen touch not fired in native VR mode

Question

I have to detect screen touches in VR mode, as that's what the button on a Cardboard produces. (I have other code to detect controller buttons.)

This code:

            // mobile and Cardboard controls
        AFRAME.scenes[0].addEventListener('touchstart', function(evt) {
            // console.log('scene touchstart:', evt);
            if (evt.target.classList.contains('a-enter-vr-button')) {
                return;
            }

            if (!state.isFlying) {
                AFRAME.scenes[0].emit('launch', evt);
            } else {
                AFRAME.scenes[0].emit('hover', evt);
            }
        });

fires when the screen is tapped, in Android Firefox in normal and VR mode (but VR mode is polyfilled). In Android Chrome, it fires in normal mode, but not VR mode (which appears to be native).

The same behavior occurs when I listen for mousedown, or add the listener to window, for either touchstart or mousedown.

So, what event on what element should I listen for, in native VR mode?

Answer 1

Add the event listener to the window or to the canvas (AFRAME.scenes[0].canvas).

window.addEventListener('click', function () { // ... } or

window.addEventListener('touchstart', ...)