v0.12.34 iOS bug fixes

This commit is contained in:
2026-03-28 13:22:02 -04:00
parent fb9d4dc956
commit 76edd7abd1
6 changed files with 756 additions and 9 deletions

View File

@@ -6,8 +6,15 @@ import './index.css';
// Register service worker
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js')
.then(reg => console.log('[SW] Registered, scope:', reg.scope))
navigator.serviceWorker.register('/sw.js', { updateViaCache: 'none' })
.then(reg => {
console.log('[SW] Registered, scope:', reg.scope);
// iOS aggressively HTTP-caches sw.js — force a check whenever the app
// becomes visible so updates are picked up without a full cold launch.
document.addEventListener('visibilitychange', () => {
if (document.visibilityState === 'visible') reg.update().catch(() => {});
});
})
.catch(err => console.error('[SW] Registration failed:', err));
});
}
@@ -107,10 +114,13 @@ if ('serviceWorker' in navigator) {
// from the message input (the keyboard covers the home indicator area anyway).
if (window.visualViewport) {
const onViewportChange = () => {
const h = window.visualViewport.height;
document.documentElement.style.setProperty('--visual-viewport-height', `${h}px`);
const vv = window.visualViewport;
document.documentElement.style.setProperty('--visual-viewport-height', `${vv.height}px`);
// Expose the visual viewport's vertical offset so .chat-layout can stay
// pinned to the visible area even when iOS scrolls the page on keyboard open.
document.documentElement.style.setProperty('--visual-viewport-offset', `${vv.offsetTop}px`);
// window.innerHeight doesn't shrink on iOS when keyboard opens — the gap IS the keyboard.
const keyboardVisible = (window.innerHeight - h) > 150;
const keyboardVisible = (window.innerHeight - vv.height) > 150;
document.documentElement.classList.toggle('keyboard-open', keyboardVisible);
};
window.visualViewport.addEventListener('resize', onViewportChange);

View File

@@ -64,7 +64,15 @@
@media (max-width: 767px) {
.chat-layout {
position: relative;
/* position: fixed keeps the layout pinned to the visual viewport even when
iOS scrolls the page on keyboard open. Without this, iOS scrolls the page
to bring the focused textarea into view, moving it to the top of the screen.
--visual-viewport-offset tracks the visual viewport's scrolled position so
the layout follows if iOS shifts it (usually 0, non-zero during keyboard open). */
position: fixed;
top: var(--visual-viewport-offset, 0px);
left: 0;
right: 0;
}
.chat-body {
overflow: hidden;