Files
simplexmq/xftp-web/test/connection.node.test.ts
Evgeny f6aca47604 xftp: implementation of XFTP client as web page (#1708)
* xftp: implementation of XFTP client as web page (rfc, low level functions)

* protocol, file descriptions, more cryptogrpahy, handshake encoding, etc.

* xftp server changes to support web slients: SNI-based certificate choice, CORS headers, OPTIONS request

* web handshake

* test for xftp web handshake

* xftp-web client functions, fix transmission encoding

* support description "redirect" in agent.ts and cross-platform compatibility tests (Haskell <> TypeScript)

* rfc: web transport

* client transport abstraction

* browser environment

* persistent client sessions

* move rfcs

* web page plan

* improve plan

* webpage implementation (not tested)

* fix test

* fix test 2

* fix test 3

* fixes and page test plan

* allow sending xftp client hello after handshake - for web clients that dont know if established connection exists

* page tests pass

* concurrent and padded hellos in the server

* update TS client to pad hellos

* fix tests

* preview:local

* local preview over https

* fixed https in the test page

* web test cert fixtures

* debug logging in web page and server

* remove debug logging in server/browser, run preview xftp server via cabal run to ensure the latest code is used

* debug logging for page sessions

* add plan

* improve error handling, handle browser reconnections/re-handshake

* fix

* debugging

* opfs fallback

* delete test screenshot

* xftp CLI to support link

* fix encoding for XFTPServerHandshake

* support redirect file descriptions in xftp CLI receive

* refactor CLI redirect

* xftp-web: fixes and multi-server upload (#1714)

* fix: await sodium.ready in crypto/keys.ts (+ digest.ts StateAddress cast)

* multi-server parallel upload, remove pickRandomServer

* fix worker message race: wait for ready signal before posting messages

* suppress vite build warnings: emptyOutDir, externals, chunkSizeWarningLimit

* fix Haskell web tests: use agent+server API, wrap server in array, suppress debug logs

* remove dead APIs: un-export connectXFTP, delete closeXFTP

* fix TypeScript errors in check:web (#1716)

- client.ts: cast globalThis.process to any for browser tsconfig,
  suppress node:http2 import, use any for Buffer/chunks, cast fetch body
- crypto.worker.ts: cast sha512_init() return to StateAddress

* fix: serialize worker message processing to prevent OPFS handle race

async onmessage allows interleaved execution at await points.
When downloadFileRaw fetches chunks from multiple servers in parallel,
concurrent handleDecryptAndStore calls both see downloadWriteHandle
as null and race on createSyncAccessHandle for the same file,
causing intermittent NoModificationAllowedError.

Chain message handlers on a promise queue so each runs to completion
before the next starts.

* xftp-web: prepare for npm publishing (#1715)

* prepare package.json for npm publishing

Remove private flag, add description/license/repository/publishConfig,
rename postinstall to pretest, add prepublishOnly, set files and main.

* stable output filenames in production build

* fix repository url format, expand files array

* embeddable component: scoped CSS, dark mode, i18n, events, share

- worker output to assets/ for single-directory deployment
- scoped all CSS under #app, removed global resets
- dark mode via .dark ancestor class
- progress ring reads colors from CSS custom properties
- i18n via window.__XFTP_I18N__ with t() helper
- configurable mount element via data-xftp-app attribute
- optional hashchange listener (data-no-hashchange)
- completion events: xftp:upload-complete, xftp:download-complete
- enhanced file-too-large error mentioning SimpleX app
- native share button via navigator.share

* deferred init and runtime server configuration

- data-defer-init attribute skips auto-initialization
- window.__XFTP_SERVERS__ overrides baked-in server list

* use relative base path for relocatable build output

* xftp-web: retry resets to default state, use innerHTML for errors

* xftp-web: only enter download mode for valid XFTP URIs in hash

* xftp-web: render UI before WASM is ready

Move sodium.ready await after UI initialization so the upload/download
interface appears instantly. WASM is only needed when user triggers
an actual upload or download. Dispatch xftp:ready event once WASM loads.

* xftp-web: CLS placeholder HTML and embedder CSS selectors

Add placeholder HTML to index.html so the page renders a styled card
before JS executes, preventing layout shift. Use a <template> element
with an inline script to swap to the download placeholder when the URL
hash indicates a file download. Auto-compute CSP SHA-256 hashes for
inline scripts in the vite build plugin.

Change all CSS selectors from #app to :is(#app, [data-xftp-app]) so
styles apply when the widget is embedded with data-xftp-app attribute.

* xftp-web: progress ring overhaul

Rewrite progress ring with smooth lerp animation, green checkmark on
completion, theme reactivity via MutationObserver, and per-phase color
variables (encrypt/upload/download/decrypt).

Show honest per-phase progress: each phase animates 0-100% independently
with a ring color change between phases. Add decrypt progress callback
from the web worker so the decryption phase tracks real chunk processing
instead of showing an indeterminate spinner.

Snap immediately on phase reset (0) and completion (1) to avoid
lingering partial progress. Clean up animation and observers via
destroy() in finally blocks.

* xftp-web: single progress ring for upload, simplify ring color

* xftp-web: single progress ring for download

* feat(xftp-web): granular progress for encrypt/decrypt phases

Add byte-level progress callbacks to encryptFile, decryptChunks,
and sha512Streaming by processing data in 256KB segments. Worker
reports fine-grained progress across all phases (encrypt+hash+write
for upload, read+hash+decrypt for download). Progress ring gains
fillTo method for smooth ease-out animation during minimum display
delays. Encrypt/decrypt phases fill their weighted regions (0-15%
and 85-99%) with real callbacks, with fillTo covering remaining
time when work finishes under the 1s minimum for files >= 100KB.

* rename package

---------

Co-authored-by: Evgeny Poberezkin <evgeny@poberezkin.com>

---------

Co-authored-by: Evgeny @ SimpleX Chat <259188159+evgeny-simplex@users.noreply.github.com>
Co-authored-by: shum <github.shum@liber.li>
Co-authored-by: sh <37271604+shumvgolove@users.noreply.github.com>
2026-03-02 09:57:46 +00:00

165 lines
6.2 KiB
TypeScript

import {test, expect, vi, beforeEach} from 'vitest'
import {
newXFTPAgent, getXFTPServerClient, reconnectClient, removeStaleConnection,
sendXFTPCommand,
XFTPRetriableError, XFTPPermanentError,
type XFTPClient, type XFTPClientAgent
} from '../src/client.js'
import {formatXFTPServer, type XFTPServer} from '../src/protocol/address.js'
import {blockPad} from '../src/protocol/transmission.js'
import {concatBytes, encodeBytes, encodeLarge} from '../src/protocol/encoding.js'
const server: XFTPServer = {
keyHash: new Uint8Array(32),
host: "localhost",
port: "12345"
}
const key = formatXFTPServer(server)
function makeMockClient(overrides?: Partial<XFTPClient>): XFTPClient {
return {
baseUrl: "https://localhost:12345",
sessionId: new Uint8Array(32),
xftpVersion: 3,
transport: {post: vi.fn(), close: vi.fn()},
...overrides
}
}
function makeAgent(connectFn: (s: any) => Promise<XFTPClient>): XFTPClientAgent {
const agent = newXFTPAgent()
agent._connectFn = connectFn
return agent
}
// T4: getXFTPServerClient coalesces concurrent calls
test('getXFTPServerClient coalesces concurrent calls', async () => {
let resolve_: (v: XFTPClient) => void
const promise = new Promise<XFTPClient>(r => { resolve_ = r })
const connectFn = vi.fn(() => promise)
const agent = makeAgent(connectFn)
const p1 = getXFTPServerClient(agent, server)
const p2 = getXFTPServerClient(agent, server)
expect(p1).toBe(p2) // same promise, single connection
expect(connectFn).toHaveBeenCalledTimes(1)
const mockClient = makeMockClient()
resolve_!(mockClient)
expect(await p1).toBe(mockClient)
})
// T5: getXFTPServerClient auto-cleans failed connections
test('getXFTPServerClient auto-cleans failed connections', async () => {
const connectFn = vi.fn()
.mockImplementationOnce(() => Promise.reject(new Error("down")))
.mockImplementationOnce(() => Promise.resolve(makeMockClient()))
const agent = makeAgent(connectFn)
const p1 = getXFTPServerClient(agent, server)
await expect(p1).rejects.toThrow("down")
// After microtask, entry is removed
await new Promise(r => setTimeout(r, 0))
expect(agent.connections.has(key)).toBe(false)
// Next call creates fresh connection
const p2 = getXFTPServerClient(agent, server)
expect(p2).not.toBe(p1)
expect(connectFn).toHaveBeenCalledTimes(2)
})
// T6: removeStaleConnection respects promise identity
test('removeStaleConnection respects promise identity', () => {
const agent = newXFTPAgent()
const mockClient1 = makeMockClient()
const mockClient2 = makeMockClient()
const p1 = Promise.resolve(mockClient1)
agent.connections.set(key, {client: p1, queue: Promise.resolve()})
// Replace with reconnect
const p2 = Promise.resolve(mockClient2)
agent.connections.set(key, {client: p2, queue: Promise.resolve()})
// removeStaleConnection with old promise does NOT remove new entry
removeStaleConnection(agent, server, p1)
expect(agent.connections.has(key)).toBe(true)
expect(agent.connections.get(key)!.client).toBe(p2)
// removeStaleConnection with current promise removes it
removeStaleConnection(agent, server, p2)
expect(agent.connections.has(key)).toBe(false)
})
// T7: reconnectClient replaces promise but preserves queue
test('reconnectClient replaces promise but preserves queue', async () => {
const mockClient2 = makeMockClient()
const connectFn = vi.fn(() => Promise.resolve(mockClient2))
const agent = makeAgent(connectFn)
const origQueue = Promise.resolve()
agent.connections.set(key, {client: Promise.resolve(makeMockClient()), queue: origQueue})
reconnectClient(agent, server)
const conn = agent.connections.get(key)!
expect(await conn.client).toBe(mockClient2) // new client
expect(conn.queue).toBe(origQueue) // queue preserved
})
// T8: Retry loop — retriable error triggers reconnect, permanent does not
test('retry loop: retriable triggers reconnect, permanent does not', async () => {
const sessionId = new Uint8Array(32)
const dummyKey = new Uint8Array(64)
const dummyId = new Uint8Array(0)
const pingCmd = new TextEncoder().encode("PING")
// Case 1: Retriable then success — 2 _connectFn calls
const connectFn1 = vi.fn()
.mockImplementationOnce(() => Promise.resolve(makeMockClient({
sessionId,
transport: {
post: vi.fn().mockRejectedValueOnce(new XFTPRetriableError("SESSION")),
close: vi.fn()
}
})))
.mockImplementationOnce(() => Promise.resolve(makeMockClient({
sessionId,
transport: {
post: vi.fn().mockResolvedValueOnce(buildPongResponse(sessionId)),
close: vi.fn()
}
})))
const agent1 = makeAgent(connectFn1)
const result = await sendXFTPCommand(agent1, server, dummyKey, dummyId, pingCmd)
expect(result.response.type).toBe("FRPong")
expect(connectFn1).toHaveBeenCalledTimes(2)
// Case 2: All 3 retries exhausted — 3 _connectFn calls
const connectFn2 = vi.fn(() => Promise.resolve(makeMockClient({
sessionId,
transport: {
post: vi.fn().mockRejectedValue(new XFTPRetriableError("SESSION")),
close: vi.fn()
}
})))
const agent2 = makeAgent(connectFn2)
await expect(sendXFTPCommand(agent2, server, dummyKey, dummyId, pingCmd))
.rejects.toThrow(/expired|reconnecting/)
expect(connectFn2).toHaveBeenCalledTimes(3)
// Case 3: Permanent error — 1 _connectFn call (no reconnect)
const connectFn3 = vi.fn(() => Promise.resolve(makeMockClient({
sessionId,
transport: {
post: vi.fn().mockRejectedValue(new XFTPPermanentError("AUTH", "expired")),
close: vi.fn()
}
})))
const agent3 = makeAgent(connectFn3)
await expect(sendXFTPCommand(agent3, server, dummyKey, dummyId, pingCmd))
.rejects.toThrow(/expired/)
expect(connectFn3).toHaveBeenCalledTimes(1)
})
// Helper: build a valid XFTP PONG response block
function buildPongResponse(sessionId: Uint8Array): Uint8Array {
const authenticator = encodeBytes(new Uint8Array(0))
const sessBytes = encodeBytes(sessionId)
const corrId = encodeBytes(new Uint8Array(0))
const entityId = encodeBytes(new Uint8Array(0))
const pong = new TextEncoder().encode("PONG")
const transmission = concatBytes(authenticator, sessBytes, corrId, entityId, pong)
const batch = concatBytes(new Uint8Array([1]), encodeLarge(transmission))
return blockPad(batch)
}