AR Android showing “shadows” on left bottom corner

Hi Verge

We have come across interesting bug on variety of different Android devices in AR mode. When we anter AR, everything seems to be working fine but when object reaches bottom left corner of the screen it shows some shadowy overlay on top. At first we were like “wtf is this image” but then we found out its actually smaller version of how picture looked like immediately before clicking “enter AR” button. Some postprocessing residual image or uncleared buffer maybe?

– We have some html for model positioning on left bottom corner but this bug persist even if we delete it completely from build
– Verge is 3.9
– Relevant code in Visual logic (html overlay should be false):

// enableRendering puzzle
function enableRendering() {
    //console.log("Render ENABLED")
    appInstance.enableRendering();
}

// enterARMode puzzle
function enterARMode(refSpace, allowHTML, enterCb, exitCb, unAvailableCb) {

    switch (refSpace) {
        case 'SITTING':
            var referenceSpace = 'local-floor';
            break;
        case 'WALKING':
            var referenceSpace = 'unbounded';
            break;
        case 'ORIGIN':
            var referenceSpace = 'local';
            break;
        case 'ROOM':
            var referenceSpace = 'bounded-floor';
            break;
        case 'VIEWER':
            var referenceSpace = 'viewer';
            break;
        default:
            console.error('puzzles: Wrong VR reference space');
            return;
    }

    appInstance.initWebXR('immersive-ar', referenceSpace, function() {

        var controllers = appInstance.xrControllers;

        for (var i = 0; i < controllers.length; i++) {
            var controller = controllers;

            controller.addEventListener('select', _pGlob.xrOnSelect);

            _pGlob.xrSessionCallbacks.forEach(function(pair) {
                controller.addEventListener(pair[0], pair[1]);
            });
        }

        _pGlob.xrSessionAcquired = true;

        enterCb();

    }, unAvailableCb, function() {

        var controllers = appInstance.xrControllers;

        for (var i = 0; i < controllers.length; i++) {
            var controller = controllers;

            controller.removeEventListener('select', _pGlob.xrOnSelect);

            _pGlob.xrSessionCallbacks.forEach(function(pair) {
                controller.removeEventListener(pair[0], pair[1]);
            });
        }

        _pGlob.xrSessionAcquired = false;

        exitCb();

    }, { domOverlay: allowHTML });
}
.....

// Describe this function...
function runAR() {
  in_webar = true;
  console.log( "entering AR")
  enableRendering()

  //enterARMode(function() { // puvodni
  enterARMode('ORIGIN', false, function() {
    changeVis(['GROUP', 'object_group'], false);
    // changeVis('prompt_move_around', true); // toho je nove

    arHitTest(function() {
      console.log(" tracking in AR")
      changeVis(['GROUP', 'indicator_group'], true);
      setObjTransform('indicator_invis_plane', 'position', arHitPoint('x'), arHitPoint('y'), arHitPoint('z'), false);
    }, function() {
      console.log(" not tracking in AR")
      changeVis(['GROUP', 'indicator_group'], false);
      
    }, 0.7);

      // Hide Enter AR button
      //setHTMLElemStyle('display', 'none', 'enter_AR_button', false);

  }, function() {
    // exit AR
    in_webar = false;
    console.log("Exiting AR")
    openWebPage(getUrlData('URL', false), 'SAME');
  }, function() {
     console.error("could not enter AR!")
  });
}

Please can you help me identify what is causing this and how to get rid of it?

thank you very much!

Petr from Precismo