Как отключить запрос на обновление в доверенной веб-активности (TWA)?

Question

У меня есть приложение PWA, код которого находится в файле main.css.

  @media all and (display-mode: fullscreen) {
    overscroll-behavior: none;
  }

А при добавлении на главный экран и запуске в полноэкранном режиме (установленном в manifest.json) обновление по запросу отключается, как и ожидалось.

Однако в случае TWA:

Когда я создаю подписанный APK с помощью https://github.com/GoogleChromeLabs/bubblewrap, поведение pull-to-refresh не отключено.

Есть ли решение для этого?

Answer 1

Вот и все

      body {
overscroll-behavior: contain;
}

Answer 2

Закончил создание обходного пути Javascript:

Сначала обновил twaManifest вbuild.gradle файл.

Следующая строка:

launchUrl: '/?utm_source=twa'

И я добавил этот кусок js, чтобы добавить класс css к элементу body при обнаружении параметра запроса twa:

export const disablePullToRefreshTWA = () => {
    const urlParams = new URLSearchParams(window.location.search);
    const myParam = urlParams.get('utm_source');
    if (myParam === 'twa') {
        document.body.classList.add('twa-app');
    }
};

и мой main.css теперь есть:

body.twa-app {
  overscroll-behavior: none;
}

Изменить: я сохранил свой медиа-запрос pwa (режим отображения) для добавления PWA в случай HomeScreen

Answer 3

Chrome на Android обновляет страницу при прокрутке за верхнюю границу. Этого можно избежать, установив для параметра «overscroll-behavior» значение «none» в элементе «html».

      html { margin: 0; overscroll-behavior: none; }

https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior#preventing_an_underlying_element_from_scrolling