test: harden mobile horizontal scroll regression coverage

Signed-off-by: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>

Author: vitormattos

playwright/e2e/mobile-pdf-horizontal-scroll.spec.ts

@@ -4,35 +4,85 @@
  */
 
 import { devices, expect, test } from '@playwright/test'
+import { login } from '../support/nc-login'
+import { setAppConfig } from '../support/nc-provisioning'
 
 test.use({
 	...devices['Pixel 7'],
 })
 
 test('PDF viewer allows horizontal scrolling on mobile viewport', async ({ page }) => {
-	// Navigate to a test page with a wide PDF
-	await page.goto('./apps/libresign')
-	
-	// Wait for the app to load
-	await expect(page.locator('[class*="pdf-editor"]')).toBeVisible({ timeout: 10000 })
-	
-	// Verify the PDF elements root container exists and is scrollable
-	const pdfRoot = page.locator('.pdf-elements-root')
-	await expect(pdfRoot).toBeVisible()
-	
-	// Check that overflow-x is set to auto (not hidden)
+	await login(
+		page.request,
+		process.env.NEXTCLOUD_ADMIN_USER ?? 'admin',
+		process.env.NEXTCLOUD_ADMIN_PASSWORD ?? 'admin',
+	)
+
+	await setAppConfig(
+		page.request,
+		'libresign', 'add_footer', '1',
+	)
+
+	await setAppConfig(
+		page.request,
+		'libresign', 'footer_template_is_default', '0',
+	)
+
+	await page.goto('./settings/admin/libresign')
+	const pdfRoot = page.locator('.footer-template-section .pdf-elements-root').first()
+	await expect(pdfRoot).toBeVisible({ timeout: 15000 })
+
+	// Check that overflow-x is set to auto (not hidden).
 	const computedStyle = await pdfRoot.evaluate((el) => {
 		return window.getComputedStyle(el).overflowX
 	})
-	
+
 	expect(computedStyle).not.toBe('hidden')
 	expect(['auto', 'scroll']).toContain(computedStyle)
-	
-	// Verify touch-action is set correctly for touch events
+
+	// Verify touch-action is set correctly for touch gestures.
 	const touchAction = await pdfRoot.evaluate((el) => {
 		return window.getComputedStyle(el).touchAction
 	})
-	
+
 	expect(touchAction).toContain('pan')
 	expect(touchAction).not.toContain('pinch-zoom')
+
+	// Validate real horizontal scrolling capability, not only style declarations.
+	const before = await pdfRoot.evaluate((el) => {
+		el.scrollLeft = 0
+		return {
+			scrollLeft: el.scrollLeft,
+			scrollWidth: el.scrollWidth,
+			clientWidth: el.clientWidth,
+		}
+	})
+
+	expect(before.scrollWidth).toBeGreaterThan(before.clientWidth)
+
+	const box = await pdfRoot.boundingBox()
+	expect(box).not.toBeNull()
+
+	if (!box) {
+		throw new Error('PDF scroll container bounding box is not available')
+	}
+
+	const y = box.y + (box.height / 2)
+	await page.mouse.move(box.x + box.width - 12, y)
+	await page.mouse.down()
+	await page.mouse.move(box.x + 12, y, { steps: 12 })
+	await page.mouse.up()
+
+	const afterGesture = await pdfRoot.evaluate((el) => el.scrollLeft)
+	// In Playwright mobile emulation, mouse drag may not trigger native touch scrolling.
+	// Keep this as an observation, while asserting actual scrollability below.
+	expect(afterGesture).toBeGreaterThanOrEqual(0)
+
+	const afterScrollLeft = await pdfRoot.evaluate((el) => {
+		const target = Math.max(el.scrollLeft + 1, el.scrollWidth - el.clientWidth)
+		el.scrollLeft = target
+		return el.scrollLeft
+	})
+
+	expect(afterScrollLeft).toBeGreaterThan(before.scrollLeft)
 })

src/components/PdfEditor/PdfEditor.vue

@@ -9,7 +9,7 @@
 			:init-file-names="fileNames"
 			:page-count-format="t('libresign', '{currentPage} of {totalPages}')"
 			:page-aria-label="getPageAriaLabel"
-			:auto-fit-zoom="enableAutoFitZoom"
+			:auto-fit-zoom="true"
 			:read-only="readOnly"
 			:emit-object-click="true"
 			:hide-selection-ui="readOnly"
@@ -130,7 +130,6 @@ type PdfElementsInstance = {
 	selectedDocIndex?: number
 	autoFitZoom?: boolean
 	scale?: number
-	visualScale?: number
 	commitZoom?: () => void
 }
 
@@ -161,17 +160,6 @@ const emit = defineEmits<{
 
 const pdfElements = ref<PdfElementsInstance | null>(null)
 
-// Auto-fit can fight user zoom on touch devices; keep one-shot fit from endInit and let user control zoom afterwards.
-const enableAutoFitZoom = computed(() => {
-	const isTouchDevice = typeof window !== 'undefined'
-		&& (
-			(window.matchMedia?.('(pointer: coarse)').matches ?? false)
-			|| 'ontouchstart' in window
-			|| (typeof navigator !== 'undefined' && navigator.maxTouchPoints > 0)
-		)
-	return !isTouchDevice
-})
-
 const ignoreClickOutsideSelectors = computed(() => ['.action-item__popper', '.action-item'])
 
 const toolbarStyleVars = computed(() => ({
@@ -218,10 +206,6 @@ function getPageAriaLabel({ docIndex, docName, totalDocs, pageNumber, totalPages
 
 async function endInit(event: EndInitPayload) {
 	await nextTick()
-	if (!pdfElements.value?.autoFitZoom && pdfElements.value?.adjustZoomToFit) {
-		pdfElements.value.adjustZoomToFit()
-	}
-
 	await nextTick()
 	const measurement = await calculatePdfMeasurement()
 	emit('pdf-editor:end-init', { ...event, measurement })
@@ -327,8 +311,6 @@ function cancelAdding() {
 	pdfElements.value?.cancelAdding()
 }
 
-
-
 async function addSigner(signer: SignerSummaryRecord | SignerDetailRecord, visibleElement: VisibleElementRecord, options: { documentIndex?: number } = {}) {
 	if (!pdfElements.value || !visibleElement.coordinates) {
 		return
@@ -401,7 +383,6 @@ defineExpose({
 	findObjectLocation,
 	startAddingSigner,
 	cancelAdding,
-
 	addSigner,
 	waitForPageRender,
 	getTotalObjectsCount,

src/tests/components/FooterTemplateEditor.spec.ts

@@ -199,4 +199,15 @@ describe('FooterTemplateEditor.vue', () => {
 
 		expect(wrapper.vm.zoomLevel).toBe(120)
 	})
+
+	it('applies zoom level to PDFElements instance scale for preview', async () => {
+		const wrapper = createWrapper()
+		await flushPromises()
+
+		wrapper.vm.pdfPreview = { scale: 1 }
+		wrapper.vm.zoomLevel = 130
+		wrapper.vm.updateScale()
+
+		expect(wrapper.vm.pdfPreview.scale).toBe(1.3)
+	})
 })

src/tests/components/PdfEditor/PdfEditor.spec.ts

@@ -744,9 +744,8 @@ describe('PdfEditor Component - Business Rules', () => {
 	})
 
 	describe('RULE: endInit emits measured dimensions', () => {
-		it('adjusts zoom when auto-fit is disabled and emits page measurements', async () => {
+		it('emits page measurements after init', async () => {
 			Object.assign(getPdfElements(), {
-				autoFitZoom: false,
 				adjustZoomToFit: vi.fn(),
 				pdfDocuments: [
 					{
@@ -761,7 +760,7 @@ describe('PdfEditor Component - Business Rules', () => {
 
 			await wrapper.vm.endInit({ ready: true })
 
-			expect(getPdfElements().adjustZoomToFit).toHaveBeenCalledTimes(1)
+			expect(getPdfElements().adjustZoomToFit).not.toHaveBeenCalled()
 			expect(wrapper.emitted('pdf-editor:end-init')?.[0]?.[0]).toEqual({
 				ready: true,
 				measurement: {