test(playwright): test that all images are loaded in print view

Signed-off-by: Jonas <jonas@freesources.org>

Author: mejo-

playwright/e2e/collective-print.spec.ts

@@ -0,0 +1,56 @@
+/**
+ * SPDX-FileCopyrightText: 2026 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { expect } from '@playwright/test'
+import { test } from '../support/fixtures/create-collectives.ts'
+
+test.describe('Collective print view', () => {
+	test('loads all images before opening print dialog', async ({ user, page, collective }) => {
+		// Create two pages each with an image. The second page is below initial viewport.
+		for (let i = 0; i < 2; i++) {
+			const collectivePage = await collective.createPage({
+				title: `Page with image ${i}`,
+				user,
+				page,
+			})
+			const src = await collectivePage.uploadImage({
+				filename: 'test.png',
+				user,
+				page,
+			})
+			await collectivePage.setContent({
+				content: `# Image ${i}\n\n![image ${i}](${src})\n`,
+				user,
+				page,
+			})
+		}
+
+		// Stub window.print so the real print dialog doesn't block the test
+		await page.addInitScript(() => {
+			(window as Window & { __printCalls?: number }).__printCalls = 0
+			window.print = () => {
+				(window as Window & { __printCalls?: number }).__printCalls! += 1
+			}
+		})
+
+		await page.goto(`/index.php/apps/collectives/_/print/${collective.getCollectiveUrlPart()}`)
+
+		await expect(page.getByText('Preparing collective for exporting or printing'))
+			.toBeVisible()
+		await expect(page.getByText('Preparing collective for exporting or printing'))
+			.toBeHidden({ timeout: 30000 })
+
+		const printCalls = await page.evaluate(() => (window as Window & { __printCalls?: number }).__printCalls)
+		expect(printCalls).toBeGreaterThan(0)
+
+		const imgs = page.locator('div.ProseMirror figure.image img.image__main')
+		const count = await imgs.count()
+		expect(count).toBe(2)
+		for (let i = 0; i < count; i++) {
+			const naturalWidth = await imgs.nth(i).evaluate((el: HTMLImageElement) => el.naturalWidth)
+			expect(naturalWidth, `image ${i} should have loaded`).toBeGreaterThan(0)
+		}
+	})
+})

playwright/support/fixtures/CollectivePage.ts

@@ -6,6 +6,8 @@
 import type { Page } from '@playwright/test'
 import type { User } from './User.ts'
 
+import { readFileSync } from 'node:fs'
+import { resolve } from 'node:path'
 import { webdavUrl } from '../helpers/urls.ts'
 
 type CollectivePageData = {
@@ -156,4 +158,43 @@ export class CollectivePage {
 		const content = `## Link\n\n[${linkText}](${linkUrl})`
 		await this.setContent({ content, user, page })
 	}
+
+	async uploadImage({ filename, mimetype = 'image/png', user, page }: {
+		filename: string
+		mimetype?: string
+		user: User
+		page: Page
+	}): Promise<string> {
+		const attachmentsDir = `.attachments.${this.data.id}`
+
+		// MKCOL is idempotent enough: 201 = created, 405 = already exists
+		const dirUrl = webdavUrl(
+			user.account.userId,
+			this.data.collectivePath,
+			this.data.filePath,
+			attachmentsDir,
+		)
+		const mkcol = await page.request.fetch(dirUrl, { method: 'MKCOL' })
+		if (![201, 405].includes(mkcol.status())) {
+			throw new Error(`MKCOL ${dirUrl} failed: ${mkcol.status()}`)
+		}
+
+		const filepath = resolve(import.meta.dirname, 'files', filename)
+		await page.request.put(
+			webdavUrl(
+				user.account.userId,
+				this.data.collectivePath,
+				this.data.filePath,
+				attachmentsDir,
+				filename,
+			),
+			{
+				headers: { 'Content-Type': mimetype },
+				data: readFileSync(filepath),
+				failOnStatusCode: true,
+			},
+		)
+
+		return `${attachmentsDir}/${filename}`
+	}
 }