// @vitest-environment jsdom import { beforeAll, describe, expect, it, vi } from 'vitest'; import { ReaderView } from '../src/ui/reader-view.ts'; import { createNativePageHost, type NativePageRequest } from '../src/ui/native-page.ts'; import { androidPageHost, serialisePage } from '../src/core/android-platform.ts'; import type { AndroidBridge } from '../src/android-bridge.ts'; import type { BookDoc } from '../src/formats/types.ts'; /** * The native page path. * * This is the one place where the Android client does something the H5 client * cannot, and the property that makes it safe is the fallback: a host either * draws the page or says no, and "no" has to put the page back in the WebView * with nothing left over. Every test here is about that contract, because the * failure mode it guards against — a blank screen where a page should be — is * invisible to the type system and only shows up on a device. */ beforeAll(() => { // jsdom has no object URLs, which the DOM fallback path uses for page images. if (!URL.createObjectURL) { Object.defineProperty(URL, 'createObjectURL', { value: () => 'blob:stub', writable: true }); } if (!URL.revokeObjectURL) { Object.defineProperty(URL, 'revokeObjectURL', { value: () => undefined, writable: true }); } }); function fixedDoc(): BookDoc { return { format: 'cbz', layout: 'fixed', render: 'image', direction: 'ltr', sections: [ { id: 'p0.png', label: '第 1 页', image: { mediaType: 'image/png', bytes: new Uint8Array([1]) }, depth: 0, render: 'image', path: 'p0.png' }, { id: 'p1.png', label: '第 2 页', image: { mediaType: 'image/png', bytes: new Uint8Array([2]) }, depth: 0, render: 'image', path: 'p1.png' }, ], toc: [], styles: [], resources: new Map(), orderedByBook: true, }; } function docWithPdf(): BookDoc { return { format: 'pdf', layout: 'fixed', render: 'document', direction: 'ltr', sections: [{ id: 'pdf', label: 'PDF', html: '', depth: 0, render: 'document' }], toc: [], styles: [], resources: new Map(), orderedByBook: true, }; } /** * The reading surface lives inside a shadow root by design, so queries have to * go through the host element. Querying the app document would pass on a * regression that leaked the book into the shell. */ function flowOf(viewInstance: ReaderView): ShadowRoot { const host = viewInstance.elementHost?.shadowRoot; if (!host) throw new Error('no shadow root: the book content is not where it should be'); return host; } /** * The reading surface, reached the way a test must: through the shadow root. */ function view(doc: BookDoc, pageHost?: ReturnType): ReaderView { const container = document.createElement('div'); document.body.append(container); return new ReaderView({ container, doc, ...(pageHost ? { pageHost } : {}), }); } describe('ReaderView with a native page host', () => { it('hands a fixed-layout page to the host and leaves the DOM flow empty', async () => { const requests: NativePageRequest[] = []; const host = createNativePageHost(async (request) => { requests.push(request); return true; }, () => undefined); const viewInstance = view(fixedDoc(), host); await viewInstance.open(0, 0); expect(requests).toHaveLength(1); expect(requests[0]!.sectionId).toBe('p0.png'); expect(requests[0]!.mode).toBe('image'); // A stale DOM page under the native one is the bug this asserts against: // the reader would see the previous page's markup through any transparent // part of the new one. expect(flowOf(viewInstance).querySelectorAll('.fixed-page')).toHaveLength(0); }); it('draws the page in the DOM when the host declines', async () => { const host = createNativePageHost(async () => false, () => undefined); const viewInstance = view(fixedDoc(), host); await viewInstance.open(0, 0); expect(flowOf(viewInstance).querySelectorAll('.fixed-page')).toHaveLength(1); expect(flowOf(viewInstance).querySelectorAll('.fixed-page img')).toHaveLength(1); }); it('renders reflowable sections in the DOM without asking the native host', async () => { const host = createNativePageHost(async () => true, () => undefined); const show = vi.spyOn(host, 'show'); const doc: BookDoc = { format: 'epub', layout: 'reflowable', render: 'reflowable', direction: 'ltr', sections: [{ id: 'ch1.xhtml', label: '第一章', html: '

正文

', depth: 0 }], toc: [], styles: [], resources: new Map(), orderedByBook: true, }; const viewInstance = view(doc, host); await viewInstance.open(0, 0); // EPUB layout is the product's differentiator and has exactly one // implementation; asking the shell to draw it would be a second one. expect(show).not.toHaveBeenCalled(); }); it('does not offer a page to the host while fit width is selected', async () => { // Native drawing centres the page; "fit width" asks for it to fill // horizontally. A native renderer can only do that by cropping (losing // panels) or by growing its own scroll surface (a second renderer), so the // page stays in the WebView and the setting keeps working. const show = vi.fn(async () => true); const host = createNativePageHost(show, () => undefined); const container = document.createElement('div'); document.body.append(container); const viewInstance = new ReaderView({ container, doc: fixedDoc(), pageHost: host }); viewInstance.applySettings({ fit: 'width' }); await viewInstance.open(0, 0); expect(show).not.toHaveBeenCalled(); expect(flowOf(viewInstance).querySelectorAll('.fixed-page img')).toHaveLength(1); }); it('does not ask the host to draw a document, which it cannot embed', async () => { const requests: NativePageRequest[] = []; const host = createNativePageHost(async (request) => { requests.push(request); return false; }, () => undefined); const viewInstance = view(docWithPdf(), host); await viewInstance.open(0, 0); // The request is made — the view does not special-case formats — and the // host is expected to decline, which is asserted by the DOM having drawn it. expect(requests).toHaveLength(1); expect(requests[0]!.mode).toBe('document'); expect(flowOf(viewInstance).querySelectorAll('.fixed-page')).toHaveLength(1); }); it('without a host, behaves exactly like the browser build', async () => { const viewInstance = view(fixedDoc()); await viewInstance.open(0, 0); expect(flowOf(viewInstance).querySelectorAll('.fixed-page img')).toHaveLength(1); }); }); describe('serialisePage', () => { it('carries bytes as base64 so a JS interface can accept them', () => { const payload = JSON.parse(serialisePage({ sectionId: 'p1.png', mode: 'image', mediaType: 'image/png', bytes: new Uint8Array([0x89, 0x50, 0x4e, 0x47]), fit: 'contain', })) as Record; expect(payload['sectionId']).toBe('p1.png'); expect(payload['mode']).toBe('image'); expect(payload['mediaType']).toBe('image/png'); expect(atob(payload['bytes']!)).toBe('\u0089PNG'); }); it('omits bytes rather than sending an empty payload', () => { const payload = JSON.parse(serialisePage({ sectionId: 'p.png', mode: 'image', fit: 'contain' })) as Record; expect('bytes' in payload).toBe(false); }); it('survives a page image larger than the argument-list limit', () => { // `String.fromCharCode(...bytes)` throws RangeError somewhere around 100k // arguments, which on a real device would look like "native rendering does // not work on big pages" rather than a crash in an encoder. const bytes = new Uint8Array(300_000).fill(7); const payload = JSON.parse(serialisePage({ sectionId: 'big.png', mode: 'image', bytes, fit: 'contain' })) as Record; expect(atob(payload['bytes']!).length).toBe(300_000); }); }); describe('androidPageHost', () => { it('gives the browser a PDF blob instead of an empty fixed page', async () => { const { loadPdf } = await import('../src/formats/pdf.ts'); const pdf = await loadPdf(new TextEncoder().encode('%PDF-1.7 fixture')); const reader = view(pdf); try { await reader.open(0); const frame = flowOf(reader).querySelector('iframe'); expect(frame).not.toBeNull(); expect(frame?.src).toMatch(/^blob:/); } finally { reader.dispose(); } }); function bridge(overrides: Partial = {}): AndroidBridge { return { shellVersion: () => 2, deviceLabel: () => 'Pixel 7', connectivity: () => 'online', watchConnectivity: () => undefined, toast: () => undefined, hasNetwork: () => true, viewport: () => '{}', cacheUsage: () => '{}', diagnostics: () => '{}', renderPage: () => true, hidePage: () => undefined, canOpenDocument: () => false, ...overrides, }; } it('is absent on a shell that predates the renderer', () => { // An old APK must keep working. Refusing to run would be the wrong trade for // an optimisation. expect(androidPageHost(bridge({ shellVersion: () => 1 }))).toBeNull(); }); it('is absent when the bridge is missing the method despite its version', () => { const partial = bridge(); delete (partial as { renderPage?: unknown }).renderPage; expect(androidPageHost(partial)).toBeNull(); }); it('declines reflowable and document modes without calling across the bridge', async () => { const renderPage = vi.fn(() => true); const host = androidPageHost(bridge({ renderPage }))!; expect(await host.show({ sectionId: 'x', mode: 'reflowable', fit: 'contain' })).toBe(false); expect(await host.show({ sectionId: 'x', mode: 'document', fit: 'contain' })).toBe(false); expect(renderPage).not.toHaveBeenCalled(); }); it('treats a throwing bridge as a decline rather than an error', async () => { const host = androidPageHost( bridge({ renderPage: () => { throw new Error('renderer died'); }, }), )!; // The reader must still see the page, drawn by the WebView. await expect(host.show({ sectionId: 'p.png', mode: 'image', fit: 'contain' })).resolves.toBe(false); }); it('passes an image page through and reports success', async () => { const calls: string[] = []; const host = androidPageHost(bridge({ renderPage: (request) => (calls.push(request), true) }))!; expect(await host.show({ sectionId: 'p.png', mode: 'image', mediaType: 'image/png', fit: 'contain' })).toBe(true); expect(calls).toHaveLength(1); expect(JSON.parse(calls[0]!)['sectionId']).toBe('p.png'); }); });