| <!DOCTYPE html> <!-- webkit-test-runner [ SpatialPortalEnabled=true ModelElementEnabled=true ModelProcessEnabled=true useFlexibleViewport=true ] --> |
| <html> |
| <head> |
| <meta charset="utf-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> |
| <script src="../resources/js-test.js"></script> |
| <script src="../resources/basic-gestures.js"></script> |
| <script src="../resources/ui-helper.js"></script> |
| <style> |
| html, body { |
| padding: 0; |
| margin: 0; |
| } |
| |
| #overflow_container { |
| height: 300px; |
| overflow: scroll; |
| border: 2px solid black; |
| } |
| |
| #overflow { |
| background: linear-gradient(180deg, rgba(255, 199, 153, 1) 0%, rgba(255, 0, 102, 1) 100%); |
| height: 600px; |
| } |
| |
| .portal { |
| spatial: portal; |
| portal-action: orbit; |
| width: 200px; |
| height: 100px; |
| } |
| </style> |
| </head> |
| <script> |
| jsTestIsAsync = true; |
| testRunner.dumpAsText(); |
| |
| async function scroll() { |
| var fromX = overflow_container.offsetLeft + 50; |
| var fromY = overflow_container.offsetTop + overflow_container.offsetHeight - 5; |
| var toX = fromX; |
| var toY = fromY - 100; |
| await touchAndDragFromPointToPoint(fromX, fromY, toX, toY); |
| await liftUpAtPoint(toX, toY); |
| overflow_container.scrollTop = 0; |
| } |
| |
| async function scrollAndCheckIfPositionInformationUpdated(correctValue) { |
| await scroll(); |
| didWait = await UIHelper.didCallEnsurePositionInformationIsUpToDateSinceLastCheck(); |
| const msg = "didCallEnsurePositionInformationIsUpToDateSinceLastCheck was " + didWait + ", expected " + correctValue; |
| if (didWait == correctValue) |
| testPassed(msg); |
| else |
| testFailed(msg); |
| } |
| |
| addEventListener("load", async () => { |
| var didWait; |
| var portalContainer = document.getElementById("portal-container"); |
| |
| if (window.testRunner) { |
| await UIHelper.clearEnsurePositionInformationIsUpToDateTracking(); |
| |
| description(`ensurePositionInformationIsUpToDate should be called when a scroll gesture occurs if a spatial |
| portal takes part in the interaction gesture, whether or not it contains any model elements.`); |
| |
| // Page has one empty spatial portal handling the gesture. |
| await scrollAndCheckIfPositionInformationUpdated(true); |
| |
| portal.style.portalAction = "none"; // The portal no longer takes part in the gesture. |
| await scrollAndCheckIfPositionInformationUpdated(false); |
| |
| portal.style.portalAction = "orbit"; |
| await scrollAndCheckIfPositionInformationUpdated(true); |
| |
| portal.remove(); // Page now has no spatial portals. |
| await scrollAndCheckIfPositionInformationUpdated(false); |
| |
| var newPortal = document.createElement("div"); |
| newPortal.className = "portal"; |
| portalContainer.appendChild(newPortal); // Page now has one spatial portal. |
| await scrollAndCheckIfPositionInformationUpdated(true); |
| |
| newPortal.style.spatial = "none"; // The element no longer establishes a portal. |
| await scrollAndCheckIfPositionInformationUpdated(false); |
| |
| newPortal.style.spatial = "portal"; |
| await scrollAndCheckIfPositionInformationUpdated(true); |
| |
| portalContainer.innerHTML = ""; // Page now has no spatial portals. |
| await scrollAndCheckIfPositionInformationUpdated(false); |
| |
| finishJSTest(); |
| } |
| }); |
| </script> |
| <body> |
| <div id="overflow_container"> |
| <div id="overflow"></div> |
| </div> |
| <div id="portal-container"> |
| <div id="portal" class="portal"></div> |
| </div> |
| <div id="console"></div> |
| </body> |
| </html> |
