From 82a0c1a7704e25283574b3e8854ec04a93f05180 Mon Sep 17 00:00:00 2001
From: Cyril <c.gromoff@gmail.com>
Date: Wed, 12 Nov 2025 11:23:03 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=85(frontend)=20add=20unit=20test=20for?=
 =?UTF-8?q?=20mobile=20=20rendering=20in=20docheaderinfo?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ensures numchild count is displayed correctly on mobile interface

Signed-off-by: Cyril <c.gromoff@gmail.com>
---
 CHANGELOG.md                                  |  2 +-
 .../__tests__/DocHeaderInfo.spec.tsx          | 46 +++++++++++++++++++
 2 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 src/frontend/apps/impress/src/features/docs/doc-header/__tests__/DocHeaderInfo.spec.tsx

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ddb0c215..a4300198 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,7 @@ and this project adheres to
 ### Added
 
 - ✨(frontend) enable ODT export for documents #1524
+- ✨(frontend) improve mobile UX by showing subdocs count #1540
 
 ### Fixed
 
@@ -27,7 +28,6 @@ and this project adheres to
 - ✨(frontend) create skeleton component for DocEditor #1491
 - ✨(frontend) add an EmojiPicker in the document tree and title #1381
 - ✨(frontend) ajustable left panel #1456
-- ✨(frontend) improve mobile UX by showing subdocs count #1540
 
 ### Changed
 
diff --git a/src/frontend/apps/impress/src/features/docs/doc-header/__tests__/DocHeaderInfo.spec.tsx b/src/frontend/apps/impress/src/features/docs/doc-header/__tests__/DocHeaderInfo.spec.tsx
new file mode 100644
index 00000000..93f1a499
--- /dev/null
+++ b/src/frontend/apps/impress/src/features/docs/doc-header/__tests__/DocHeaderInfo.spec.tsx
@@ -0,0 +1,46 @@
+import { render, screen } from '@testing-library/react';
+import React from 'react';
+import { describe, expect, test, vi } from 'vitest';
+
+import { AppWrapper } from '@/tests/utils';
+
+// Force mobile layout so the children count is rendered
+vi.mock('@/stores', () => ({
+  useResponsiveStore: () => ({ isDesktop: false }),
+}));
+
+// Provide stable mocks for hooks used by the component
+vi.mock('../../doc-management', async () => {
+  const actual = await vi.importActual<any>('../../doc-management');
+  return {
+    ...actual,
+    useTrans: () => ({ transRole: vi.fn((r) => String(r)) }),
+    useIsCollaborativeEditable: () => ({ isEditable: true }),
+  };
+});
+
+vi.mock('@/core', () => ({
+  useConfig: () => ({ data: {} }),
+}));
+
+vi.mock('@/hook', () => ({
+  useDate: () => ({
+    relativeDate: () => 'yesterday',
+    calculateDaysLeft: () => 5,
+  }),
+}));
+
+import { DocHeaderInfo } from '../components/DocHeaderInfo';
+
+describe('DocHeaderInfo', () => {
+  test('renders the number of sub-documents when numchild is provided (mobile layout)', () => {
+    const doc = {
+      numchild: 3,
+      updated_at: new Date().toISOString(),
+    } as any;
+
+    render(<DocHeaderInfo doc={doc} />, { wrapper: AppWrapper });
+
+    expect(screen.getByText(/Contains 3 sub-documents/i)).toBeInTheDocument();
+  });
+});