From a9526377a2b4b2c5b34d73b389c6f56ce320b23d Mon Sep 17 00:00:00 2001 From: Huang Xin Date: Sat, 20 Jun 2026 11:33:47 +0800 Subject: [PATCH] fix(reader): stretch Duokan fullscreen cover to fill the page (#4679) Bump foliate-js so paginated Duokan full-page covers (data-duokan-page-fullscreen) render with object-fit: fill instead of contain. The cover now fills the whole page, distorting to fit when the aspect ratio differs, matching Duokan's native full-page render. Adds a browser test asserting the fullscreen cover computes object-fit: fill. Co-authored-by: Claude Opus 4.8 (1M context) --- .../paginator-duokan-cover.browser.test.ts | 19 +++++++++++++++++++ packages/foliate-js | 2 +- 2 files changed, 20 insertions(+), 1 deletion(-) diff --git a/apps/readest-app/src/__tests__/document/paginator-duokan-cover.browser.test.ts b/apps/readest-app/src/__tests__/document/paginator-duokan-cover.browser.test.ts index 05938081..21393302 100644 --- a/apps/readest-app/src/__tests__/document/paginator-duokan-cover.browser.test.ts +++ b/apps/readest-app/src/__tests__/document/paginator-duokan-cover.browser.test.ts @@ -104,6 +104,25 @@ describe('Paginator Duokan fullscreen cover (#4379)', () => { expect(img!.offsetHeight).toBeGreaterThan(0); }); + it('stretches the fullscreen cover to fill the page (object-fit: fill)', async () => { + paginator = createPaginator(); + paginator.open(book); + + const stabilized = waitForStabilized(paginator); + await paginator.goTo({ index: 0 }); + await stabilized; + + const img = getCoverImg(paginator); + expect(img).toBeTruthy(); + await waitForImgLoaded(img!); + await waitForVisibleHeight(img!); + + // The fullscreen treatment stretches the cover edge-to-edge, ignoring the + // image's aspect ratio, to match Duokan's native full-page rendering. + const cs = img!.ownerDocument.defaultView!.getComputedStyle(img!); + expect(cs.objectFit).toBe('fill'); + }); + it('shows the cover image in scrolled mode', async () => { paginator = createPaginator(); paginator.open(book); diff --git a/packages/foliate-js b/packages/foliate-js index 18d304bd..828d6132 160000 --- a/packages/foliate-js +++ b/packages/foliate-js @@ -1 +1 @@ -Subproject commit 18d304bd6201fb65fac20b7e39cfc630d4f2db1b +Subproject commit 828d6132ea4ad973657b68832f18757dbb289f85