diff options
| -rw-r--r-- | src/features/messages.js | 18 | ||||
| -rw-r--r-- | tools/offline-cache-test.js | 70 |
2 files changed, 86 insertions, 2 deletions
diff --git a/src/features/messages.js b/src/features/messages.js index e812520..cb63e04 100644 --- a/src/features/messages.js +++ b/src/features/messages.js @@ -545,7 +545,9 @@ export function messagesFeature(ctx) { // least recently seen faces give theirs up first. The row itself stays — // that face just paints the way it used to. if (JSON.stringify(s).length > THUMB_BUDGET) { - const oldestFirst = Object.keys(s).filter((k) => s[k].thumb).sort((a, b) => (s[a].t || 0) - (s[b].t || 0)); + // never our own: the header face is the one that must paint offline + const mine = new Set(myPubkeys()); + const oldestFirst = Object.keys(s).filter((k) => s[k].thumb && !mine.has(k)).sort((a, b) => (s[a].t || 0) - (s[b].t || 0)); for (const k of oldestFirst) { delete s[k].thumb; delete s[k].thumbFor; if (JSON.stringify(s).length <= THUMB_BUDGET) break; @@ -648,7 +650,7 @@ export function messagesFeature(ctx) { // won't have us is asked about twice a month rather than every boot. if (p.thumbFailVersion === THUMB_VERSION && p.thumbFail === p.picture && Date.now() - (p.thumbFailAt || 0) < Math.min(THUMB_RETRY * 2 ** ((p.thumbFails || 1) - 1), THUMB_RETRY_MAX)) return; - if (thumbing.has(pk) || thumbing.size >= 3) return; // a few at a time + if (thumbing.has(pk) || (thumbing.size >= 3 && !isMe(pk))) return; // a few at a time — our own face never waits // Making the thumbnail costs one more fetch of the original today to // save every fetch after it — but not on a connection someone is // nursing. Data Saver keeps today's behaviour. @@ -1128,11 +1130,13 @@ export function messagesFeature(ctx) { msgs.set(rumor.id, { rumor, author }); bumpMsgRev(); room.typing.delete(author); // the message itself ends the "typing…" + schedulePersist(room); } else if (rumor.kind === 5) { for (const e of rumor.tags.filter((x) => x[0] === 'e')) { const m = room.byChannel.get(channelId)?.get(e[1]); if (!m || m.author === author) room.deletes.add(e[1]); } + schedulePersist(room); } else if (rumor.kind === 3302) { const target = tag('e')?.[1]; if (target) { @@ -1162,6 +1166,16 @@ export function messagesFeature(ctx) { return room.jm.channels || []; }; + // Messages that ARRIVE get cached too, not only ones we send: the cache + // used to be written on our own actions alone, so a member who only reads + // had nothing on an offline boot — the room said "No messages yet" with a + // hundred messages read the day before. A backfill lands in a burst, so + // the write waits for it to settle. + const persistTimers = new Map(); // room -> timer + function schedulePersist(room) { + clearTimeout(persistTimers.get(room)); + persistTimers.set(room, setTimeout(() => { persistTimers.delete(room); try { persistCache(room); } catch {} }, 2500)); + } function persistCache(room) { const s = st(); for (const [chId, msgs] of room.byChannel) { diff --git a/tools/offline-cache-test.js b/tools/offline-cache-test.js new file mode 100644 index 0000000..d5e8e5a --- /dev/null +++ b/tools/offline-cache-test.js @@ -0,0 +1,70 @@ +// What an offline boot has to show: the room's recent messages from the +// local cache (written as they ARRIVE, not only when we send), names from +// the profile cache and most faces from local thumbnails. Boots the PWA +// build from dist/ so the service worker serves the shell offline. +// +// Run: bun run build && bun tools/offline-cache-test.js +import puppeteer from 'puppeteer-core'; +import { generateMnemonic } from '@scure/bip39'; +import { wordlist } from '@scure/bip39/wordlists/english'; +import { join } from 'node:path'; +const sleep = (ms) => new Promise((r) => setTimeout(r, ms)); +const dist = join(import.meta.dir, '../dist'); +const server = Bun.serve({ port: 5234, async fetch(req) { + const u = new URL(req.url); let p = u.pathname === '/' ? '/index.html' : u.pathname; + const f = Bun.file(dist + p); + if (await f.exists()) return new Response(f, { headers: { 'cache-control': 'no-store' } }); + return new Response(Bun.file(dist + '/index.html'), { headers: { 'cache-control': 'no-store' } }); +} }); +const browser = await puppeteer.launch({ executablePath: '/usr/bin/google-chrome', headless: 'new', args: ['--no-sandbox'] }); +const page = await browser.newPage(); +const errs = []; page.on('pageerror', (e) => errs.push(e.message)); page.on('console', (m) => { if (m.type() === 'error') errs.push('console: ' + m.text().slice(0, 160)); }); +const click = (sel, t) => page.evaluate((s, x) => { const e = [...document.querySelectorAll(s)].find((n) => n.textContent.trim().toLowerCase().includes(x.toLowerCase())); if (e) { e.click(); return true; } return false; }, sel, t); +const waitText = async (x, ms = 25000) => { for (let i = 0; i < ms / 250; i++) { if ((await page.evaluate(() => document.body.innerText)).toLowerCase().includes(x.toLowerCase())) return true; await sleep(250); } return false; }; +const openMessages = () => page.evaluate(() => [...document.querySelectorAll('button')].find((b) => /message/i.test(b.getAttribute('aria-label') || ''))?.click()); +const openCoinos = () => page.evaluate(() => { const e = [...document.querySelectorAll('.chat-thread-row')].find((n) => (n.querySelector('.chat-name') || {}).textContent === 'coinos'); if (e) e.click(); }); +const snap = () => page.evaluate(() => ({ + text: document.body.innerText.replace(/\s+/g, ' ').slice(0, 300), + bubbles: document.querySelectorAll('.chat-bubble').length, + rows: document.querySelectorAll('.chat-thread-row').length, + avaImg: document.querySelectorAll('.ava-img').length, + avaImgData: [...document.querySelectorAll('.ava-img')].filter((e) => /url\("?data:/.test(e.style.backgroundImage)).length, + fallback: document.querySelectorAll('.chat-avatar.fallback').length, + header: !!document.querySelector('.header-ava'), + headerIsImg: !!document.querySelector('.header-ava.ava-img'), + offlineBanner: document.body.innerText.includes('offline') || document.body.innerText.includes('Offline'), +})); +await page.setViewport({ width: 420, height: 860 }); +await page.goto('http://localhost:5234/', { waitUntil: 'domcontentloaded' }); +await page.evaluate(() => localStorage.setItem('btc-wallet-network', 'regtest')); +await page.reload({ waitUntil: 'domcontentloaded' }); await sleep(400); +await click('button', 'Create a new wallet'); await sleep(300); +await click('button', 'Import existing'); await sleep(300); +await page.waitForSelector('textarea'); await page.type('textarea', generateMnemonic(wordlist)); +await click('button', 'Open wallet'); await waitText('receive', 15000); +await openMessages(); await sleep(800); await openCoinos(); +console.log('online room:', await waitText('GM Coinos community', 30000)); +await sleep(6000); // thumbnails, profiles, caches settle +console.log('online snapshot:', JSON.stringify(await snap())); +const sw = await page.evaluate(async () => { const r = await navigator.serviceWorker.getRegistration(); const ks = await caches.keys(); const c = ks.length ? await (await caches.open(ks[0])).keys() : []; return { reg: !!r, active: !!(r && r.active), caches: ks, cached: c.length }; }); +console.log('sw:', JSON.stringify(sw)); +const cdp = await page.target().createCDPSession(); await cdp.send('Network.enable'); +await cdp.send('Network.emulateNetworkConditions', { offline: true, latency: 0, downloadThroughput: -1, uploadThroughput: -1 }); +await sleep(500); +try { await page.reload({ waitUntil: 'domcontentloaded', timeout: 20000 }); } catch (e) { console.log('reload:', e.message.slice(0, 100)); } +await sleep(5000); +console.log('offline boot:', JSON.stringify(await snap())); +await openMessages(); await sleep(1500); +console.log('offline messages home:', JSON.stringify(await snap())); +await openCoinos(); await sleep(1500); +const room = await snap(); +console.log('offline room:', JSON.stringify(room).slice(0, 300)); +let ok = true; +const check = (n, c, d = '') => { console.log(` ${c ? '✓' : '✗'} ${n}${d ? ' — ' + d : ''}`); if (!c) ok = false; }; +check('the room shows cached messages offline', room.bubbles >= 20, `${room.bubbles} bubbles`); +check('most faces paint from local thumbnails', room.avaImgData >= room.avaImg * 0.6, `${room.avaImgData} of ${room.avaImg}`); +check('names resolve from the profile cache', !/npub1[a-z0-9]{8}/.test(room.text.slice(0, 120)) || room.text.includes('Adam'), room.text.slice(40, 120)); +await page.screenshot({ path: process.argv[2] || '/tmp/offline.png' }); +await browser.close(); server.stop(true); +console.log(ok ? '\nALL GOOD' : '\nFAILURES'); +process.exit(ok ? 0 : 1); |