From 0e296407668be01bcf30cea2d04084241494db0f Mon Sep 17 00:00:00 2001
From: ConnorYoh <40631091+ConnorYoh@users.noreply.github.com>
Date: Mon, 30 Mar 2026 11:27:55 +0100
Subject: [PATCH] fix: get all Playwright E2E tests loading and expand CI to
 run full suite (#6009)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Fix Playwright E2E tests and expand CI to run full suite

### Problem

The full Playwright suite was broken in two ways:

1. **`ConvertE2E.spec.ts` crashed at import time** —
`conversionEndpointDiscovery.ts` imported a React hook at the top level,
which pulled in the entire component tree. That chain eventually
required `material-symbols-icons.json` (a generated file that didn't
exist), crashing module resolution before any tests ran.

2. **CI only ran cert validation tests** — both `build.yml` and
`nightly.yml` hardcoded `src/core/tests/certValidation` as the test
path, silently ignoring everything else.

### Changes

**`ConvertE2E.spec.ts` — complete rewrite**
The old tests were useless in practice: all 9 dynamic conversion tests
were permanently skipped unless a real Spring Boot backend was running
(they called a live `/api/v1/config/endpoints-enabled` endpoint at
module load time). Replaced with 4 focused tests that use `page.route()`
mocking — no backend required, same pattern as
`CertificateValidationE2E`.

New tests cover:
- Convert button absent before a format pair is selected
- Successful PDF→PNG conversion shows a download button (mocked API
response)
- API error surfaces as an error notification
- Convert button appears and is enabled after selecting valid formats

**`conversionEndpointDiscovery.ts` — deleted**
Only existed to support the old tests. The `useConversionEndpoints`
React hook it exported was never imported anywhere else.

**`ReviewToolStep.tsx`**
Added `data-testid="download-result-button"` to the download button —
required for the happy-path test assertion.

**CI workflows (`build.yml`, `nightly.yml`)**
- Added a `Generate icons` step before Playwright runs (`node
scripts/generate-icons.js`) — the icon JSON is generated by `npm run
dev` locally but skipped by `npm ci` in CI
- Removed the `src/core/tests/certValidation` path filter so the full
suite runs
---
 .github/workflows/build.yml                   |   4 +-
 .github/workflows/nightly.yml                 |   5 +-
 .../tools/shared/ReviewToolStep.tsx           |   1 +
 .../src/core/tests/convert/ConvertE2E.spec.ts | 609 +++++-------------
 .../helpers/conversionEndpointDiscovery.ts    | 325 ----------
 frontend/src/core/tools/Convert.tsx           |   2 +-
 6 files changed, 160 insertions(+), 786 deletions(-)
 delete mode 100644 frontend/src/core/tests/helpers/conversionEndpointDiscovery.ts

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 5c0326e4af..d5c8285d45 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -236,10 +236,12 @@ jobs:
           cache-dependency-path: frontend/package-lock.json
       - name: Install frontend dependencies
         run: cd frontend && npm ci
+      - name: Generate icons
+        run: cd frontend && node scripts/generate-icons.js
       - name: Install Playwright (chromium only)
         run: cd frontend && npx playwright install chromium --with-deps
       - name: Run E2E tests (chromium)
-        run: cd frontend && npx playwright test src/core/tests/certValidation --project=chromium
+        run: cd frontend && npx playwright test --project=chromium
       - name: Upload Playwright report
         if: always()
         uses: actions/upload-artifact@bbbca2ddaa5d8feaa63e36b76fdaad77386f024f # v7.0.0
diff --git a/.github/workflows/nightly.yml b/.github/workflows/nightly.yml
index 95da59725d..b3a13e233d 100644
--- a/.github/workflows/nightly.yml
+++ b/.github/workflows/nightly.yml
@@ -35,11 +35,14 @@ jobs:
       - name: Install frontend dependencies
         run: cd frontend && npm ci
 
+      - name: Generate icons
+        run: cd frontend && node scripts/generate-icons.js
+
       - name: Install all Playwright browsers
         run: cd frontend && npx playwright install --with-deps
 
       - name: Run E2E tests (all browsers)
-        run: cd frontend && npx playwright test src/core/tests/certValidation
+        run: cd frontend && npx playwright test
 
       - name: Upload Playwright report
         if: always()
diff --git a/frontend/src/core/components/tools/shared/ReviewToolStep.tsx b/frontend/src/core/components/tools/shared/ReviewToolStep.tsx
index c67d933f1d..019bb14d36 100644
--- a/frontend/src/core/components/tools/shared/ReviewToolStep.tsx
+++ b/frontend/src/core/components/tools/shared/ReviewToolStep.tsx
@@ -123,6 +123,7 @@ function ReviewStepContent<TParams = unknown>({
       )}
       {operation.downloadUrl && (
         <Button
+          data-testid="download-result-button"
           leftSection={<DownloadIcon />}
           color="blue"
           fullWidth
diff --git a/frontend/src/core/tests/convert/ConvertE2E.spec.ts b/frontend/src/core/tests/convert/ConvertE2E.spec.ts
index 2d2e387a27..0fe33854db 100644
--- a/frontend/src/core/tests/convert/ConvertE2E.spec.ts
+++ b/frontend/src/core/tests/convert/ConvertE2E.spec.ts
@@ -1,491 +1,184 @@
 /**
  * End-to-End Tests for Convert Tool
  *
- * These tests dynamically discover available conversion endpoints and test them.
- * Tests are automatically skipped if the backend endpoint is not available.
- *
- * Run with: npm run test:e2e or npx playwright test
+ * All backend API calls are mocked via page.route() — no real backend required.
+ * The Vite dev server must be running (handled by playwright.config.ts webServer).
  */
 
-import { test, expect, Page } from '@playwright/test';
-import {
-  conversionDiscovery,
-  type ConversionEndpoint
-} from '@app/tests/helpers/conversionEndpointDiscovery';
-import * as path from 'path';
-import * as fs from 'fs';
+import { test, expect, type Page } from '@playwright/test';
+import path from 'path';
 
-// Test configuration
-const BASE_URL = process.env.BASE_URL || 'http://localhost:5173';
+const FIXTURES_DIR = path.join(__dirname, '../test-fixtures');
+const SAMPLE_PDF = path.join(FIXTURES_DIR, 'sample.pdf');
 
-/**
- * Resolves test fixture paths dynamically based on current working directory.
- * Works from both top-level project directory and frontend subdirectory.
- */
-function resolveTestFixturePath(filename: string): string {
-  const cwd = process.cwd();
+// ---------------------------------------------------------------------------
+// Endpoint availability map — all conversion endpoints enabled
+// ---------------------------------------------------------------------------
+const MOCK_ENDPOINTS_AVAILABILITY = Object.fromEntries(
+  [
+    'pdf-to-img', 'img-to-pdf', 'pdf-to-word', 'file-to-pdf', 'pdf-to-text',
+    'pdf-to-html', 'pdf-to-xml', 'pdf-to-csv', 'pdf-to-xlsx', 'pdf-to-pdfa',
+    'pdf-to-pdfx', 'pdf-to-presentation', 'pdf-to-markdown', 'pdf-to-cbz',
+    'pdf-to-cbr', 'pdf-to-epub', 'html-to-pdf', 'svg-to-pdf', 'markdown-to-pdf',
+    'eml-to-pdf', 'cbz-to-pdf', 'cbr-to-pdf',
+  ].map((k) => [k, { enabled: true }])
+);
 
-  // Try frontend/src/tests/test-fixtures/ first (from top-level)
-  const topLevelPath = path.join(cwd, 'frontend', 'src', 'tests', 'test-fixtures', filename);
-  if (fs.existsSync(topLevelPath)) {
-    return topLevelPath;
-  }
+// ---------------------------------------------------------------------------
+// Helper: mock all standard app APIs needed to load the main UI
+// ---------------------------------------------------------------------------
+async function mockAppApis(page: Page) {
+  // Backend probe — must return UP so Landing shows app in anonymous mode
+  await page.route('**/api/v1/info/status', (route) =>
+    route.fulfill({ json: { status: 'UP' } })
+  );
 
-  // Try src/tests/test-fixtures/ (from frontend directory)
-  const frontendPath = path.join(cwd, 'src', 'tests', 'test-fixtures', filename);
-  if (fs.existsSync(frontendPath)) {
-    return frontendPath;
-  }
+  // App config — enableLogin:false puts the app in anonymous mode
+  await page.route('**/api/v1/config/app-config', (route) =>
+    route.fulfill({
+      json: { enableLogin: false, languages: ['en-GB'], defaultLocale: 'en-GB' },
+    })
+  );
 
-  // Try relative path from current test file location
-  const relativePath = path.join(__dirname, '..', 'test-fixtures', filename);
-  if (fs.existsSync(relativePath)) {
-    return relativePath;
-  }
+  // Auth — fallback if anything calls auth/me
+  await page.route('**/api/v1/auth/me', (route) =>
+    route.fulfill({
+      json: { id: 1, username: 'testuser', email: 'test@example.com', roles: ['ROLE_USER'] },
+    })
+  );
 
-  // Fallback to the original path format (should work from top-level)
-  return path.join('.', 'frontend', 'src', 'tests', 'test-fixtures', filename);
+  // Endpoint availability — queried by ConvertSettings
+  await page.route('**/api/v1/config/endpoints-availability', (route) =>
+    route.fulfill({ json: MOCK_ENDPOINTS_AVAILABILITY })
+  );
+
+  // Single-endpoint check — queried by Convert.tsx for the execute button
+  await page.route('**/api/v1/config/endpoint-enabled*', (route) =>
+    route.fulfill({ json: true })
+  );
+
+  // Group-enabled check
+  await page.route('**/api/v1/config/group-enabled*', (route) =>
+    route.fulfill({ json: true })
+  );
+
+  // Footer info — non-critical
+  await page.route('**/api/v1/ui-data/footer-info', (route) =>
+    route.fulfill({ json: {} })
+  );
+
+  // Proprietary endpoints — silence proxy errors in the Vite dev server
+  await page.route('**/api/v1/proprietary/**', (route) =>
+    route.fulfill({ json: {} })
+  );
 }
 
-// Test file paths (dynamically resolved based on current working directory)
-const TEST_FILES = {
-  pdf: resolveTestFixturePath('sample.pdf'),
-  docx: resolveTestFixturePath('sample.docx'),
-  doc: resolveTestFixturePath('sample.doc'),
-  pptx: resolveTestFixturePath('sample.pptx'),
-  ppt: resolveTestFixturePath('sample.ppt'),
-  xlsx: resolveTestFixturePath('sample.xlsx'),
-  xls: resolveTestFixturePath('sample.xls'),
-  png: resolveTestFixturePath('sample.png'),
-  jpg: resolveTestFixturePath('sample.jpg'),
-  jpeg: resolveTestFixturePath('sample.jpeg'),
-  gif: resolveTestFixturePath('sample.gif'),
-  bmp: resolveTestFixturePath('sample.bmp'),
-  tiff: resolveTestFixturePath('sample.tiff'),
-  webp: resolveTestFixturePath('sample.webp'),
-  md: resolveTestFixturePath('sample.md'),
-  eml: resolveTestFixturePath('sample.eml'),
-  html: resolveTestFixturePath('sample.html'),
-  txt: resolveTestFixturePath('sample.txt'),
-  xml: resolveTestFixturePath('sample.xml'),
-  csv: resolveTestFixturePath('sample.csv')
-};
-
-// File format to test file mapping
-const getTestFileForFormat = (format: string): string => {
-  const formatMap: Record<string, string> = {
-    'pdf': TEST_FILES.pdf,
-    'docx': TEST_FILES.docx,
-    'doc': TEST_FILES.doc,
-    'pptx': TEST_FILES.pptx,
-    'ppt': TEST_FILES.ppt,
-    'xlsx': TEST_FILES.xlsx,
-    'xls': TEST_FILES.xls,
-    'office': TEST_FILES.docx, // Default office file
-    'image': TEST_FILES.png, // Default image file
-    'png': TEST_FILES.png,
-    'jpg': TEST_FILES.jpg,
-    'jpeg': TEST_FILES.jpeg,
-    'gif': TEST_FILES.gif,
-    'bmp': TEST_FILES.bmp,
-    'tiff': TEST_FILES.tiff,
-    'webp': TEST_FILES.webp,
-    'md': TEST_FILES.md,
-    'eml': TEST_FILES.eml,
-    'html': TEST_FILES.html,
-    'txt': TEST_FILES.txt,
-    'xml': TEST_FILES.xml,
-    'csv': TEST_FILES.csv
-  };
-
-  return formatMap[format] || TEST_FILES.pdf; // Fallback to PDF
-};
-
-// Expected file extensions for target formats
-const getExpectedExtension = (toFormat: string): string => {
-  const extensionMap: Record<string, string> = {
-    'pdf': '.pdf',
-    'docx': '.docx',
-    'pptx': '.pptx',
-    'txt': '.txt',
-    'html': '.zip', // HTML is zipped
-    'xml': '.xml',
-    'csv': '.csv',
-    'md': '.md',
-    'image': '.png', // Default for image conversion
-    'png': '.png',
-    'jpg': '.jpg',
-    'jpeg': '.jpeg',
-    'gif': '.gif',
-    'bmp': '.bmp',
-    'tiff': '.tiff',
-    'webp': '.webp',
-    'pdfa': '.pdf'
-  };
-
-  return extensionMap[toFormat] || '.pdf';
-};
-
-/**
- * Helper function to upload files through the modal system
- */
-async function uploadFileViaModal(page: Page, filePath: string) {
-  // Click the Files button in the QuickAccessBar to open the modal
-  await page.click('[data-testid="files-button"]');
-
-  // Wait for the modal to open
+// ---------------------------------------------------------------------------
+// Helper: upload a file through the Files modal
+// Uses the HiddenFileInput (data-testid="file-input") which has the correct
+// onChange handler. Waits for the modal to auto-close after upload.
+// ---------------------------------------------------------------------------
+async function uploadFile(page: Page, filePath: string) {
+  await page.getByTestId('files-button').click();
   await page.waitForSelector('.mantine-Modal-overlay', { state: 'visible', timeout: 5000 });
-  //await page.waitForSelector('[data-testid="file-upload-modal"]', { timeout: 5000 });
-
-  // Upload the file through the modal's file input
-  await page.setInputFiles('input[type="file"]', filePath);
-
-  // Wait for the file to be processed and the modal to close
-  await page.waitForSelector('[data-testid="file-upload-modal"]', { state: 'hidden' });
-
-  // Wait for the file thumbnail to appear in the main interface
-  await page.waitForSelector('[data-testid="file-thumbnail"]', { timeout: 10000 });
+  await page.locator('[data-testid="file-input"]').setInputFiles(filePath);
+  // Modal auto-closes after file is selected
+  await page.waitForSelector('.mantine-Modal-overlay', { state: 'hidden', timeout: 10000 });
 }
 
-/**
- * Generic test function for any conversion
- */
-async function testConversion(page: Page, conversion: ConversionEndpoint) {
-  const expectedExtension = getExpectedExtension(conversion.toFormat);
-
-  console.log(`Testing ${conversion.endpoint}: ${conversion.fromFormat} → ${conversion.toFormat}`);
-
-  // File should already be uploaded, click the Convert tool button
-  await page.click('[data-testid="tool-convert"]');
-
-  // Wait for the FileEditor to load in convert mode with file thumbnails
-  await page.waitForSelector('[data-testid="file-thumbnail"]', { timeout: 5000 });
-
-  // Click the file thumbnail checkbox to select it in the FileEditor
-  await page.click('[data-testid="file-thumbnail-checkbox"]');
-
-  // Wait for the conversion settings to appear after file selection
+// ---------------------------------------------------------------------------
+// Helper: navigate to the Convert tool panel
+// Tools use data-tour="tool-button-{key}" anchors in the ToolPanel.
+// After clicking, the URL changes to /convert and the settings appear.
+// ---------------------------------------------------------------------------
+async function navigateToConvert(page: Page) {
+  await page.locator('[data-tour="tool-button-convert"]').click();
   await page.waitForSelector('[data-testid="convert-from-dropdown"]', { timeout: 5000 });
-
-  // Select FROM format
-  await page.click('[data-testid="convert-from-dropdown"]');
-  const fromFormatOption = page.locator(`[data-testid="format-option-${conversion.fromFormat}"]`);
-  await fromFormatOption.scrollIntoViewIfNeeded();
-  await fromFormatOption.click();
-
-  // Select TO format
-  await page.click('[data-testid="convert-to-dropdown"]');
-  const toFormatOption = page.locator(`[data-testid="format-option-${conversion.toFormat}"]`);
-  await toFormatOption.scrollIntoViewIfNeeded();
-  await toFormatOption.click();
-
-  // Handle format-specific options
-  if (conversion.toFormat === 'image' || ['png', 'jpg', 'jpeg', 'gif', 'bmp', 'tiff', 'webp'].includes(conversion.toFormat)) {
-    // Set image conversion options if they appear
-    const imageOptionsVisible = await page.locator('[data-testid="image-options-section"]').isVisible().catch(() => false);
-    if (imageOptionsVisible) {
-      // Click the color type dropdown and select "Color"
-      await page.click('[data-testid="color-type-select"]');
-      await page.getByRole('option', { name: 'Color' }).click();
-
-      // Set DPI value
-      await page.fill('[data-testid="dpi-input"]', '150');
-
-      // Click the output type dropdown and select "Multiple"
-      await page.click('[data-testid="output-type-select"]');
-
-      await page.getByRole('option', { name: 'single' }).click();
-    }
-  }
-
-  if (conversion.fromFormat === 'image' && conversion.toFormat === 'pdf') {
-    // Set PDF creation options if they appear
-    const pdfOptionsVisible = await page.locator('[data-testid="pdf-options-section"]').isVisible().catch(() => false);
-    if (pdfOptionsVisible) {
-      // Click the color type dropdown and select "Color"
-      await page.click('[data-testid="color-type-select"]');
-      await page.locator('[data-value="color"]').click();
-    }
-  }
-
-  if (conversion.fromFormat === 'pdf' && conversion.toFormat === 'csv') {
-    // Set CSV extraction options if they appear
-    const csvOptionsVisible = await page.locator('[data-testid="csv-options-section"]').isVisible().catch(() => false);
-    if (csvOptionsVisible) {
-      // Set specific page numbers for testing (test pages 1-2)
-      await page.fill('[data-testid="page-numbers-input"]', '1-2');
-    }
-  }
-
-  // Start conversion
-  await page.click('[data-testid="convert-button"]');
-
-  // Wait for conversion to complete (with generous timeout)
-  await page.waitForSelector('[data-testid="download-button"]', { timeout: 60000 });
-
-  // Verify download is available
-  const downloadButton = page.locator('[data-testid="download-button"]');
-  await expect(downloadButton).toBeVisible();
-
-  // Start download and verify file
-  const downloadPromise = page.waitForEvent('download');
-  await downloadButton.click();
-  const download = await downloadPromise;
-
-  // Verify file extension
-  expect(download.suggestedFilename()).toMatch(new RegExp(`\\${expectedExtension}$`));
-
-  // Save and verify file is not empty
-  const path = await download.path();
-  if (path) {
-    const fs = require('fs');
-    const stats = fs.statSync(path);
-    expect(stats.size).toBeGreaterThan(0);
-
-    // Format-specific validations
-    if (conversion.toFormat === 'pdf' || conversion.toFormat === 'pdfa') {
-      // Verify PDF header
-      const buffer = fs.readFileSync(path);
-      const header = buffer.toString('utf8', 0, 4);
-      expect(header).toBe('%PDF');
-    }
-
-    if (conversion.toFormat === 'txt') {
-      // Verify text content exists
-      const content = fs.readFileSync(path, 'utf8');
-      expect(content.length).toBeGreaterThan(0);
-    }
-
-    if (conversion.toFormat === 'csv') {
-      // Verify CSV content contains separators
-      const content = fs.readFileSync(path, 'utf8');
-      expect(content).toContain(',');
-    }
-  }
 }
 
-// Discover conversions at module level before tests are defined
-let availableConversions: ConversionEndpoint[] = [];
-let unavailableConversions: ConversionEndpoint[] = [];
-
-// Pre-populate conversions synchronously for test generation
-(async () => {
-  try {
-    availableConversions = await conversionDiscovery.getAvailableConversions();
-    unavailableConversions = await conversionDiscovery.getUnavailableConversions();
-  } catch (error) {
-    console.error('Failed to discover conversions during module load:', error);
-  }
-})();
-
-test.describe('Convert Tool E2E Tests', () => {
-
-  test.beforeAll(async () => {
-    // Re-discover to ensure fresh data at test time
-    console.log('Re-discovering available conversion endpoints...');
-    availableConversions = await conversionDiscovery.getAvailableConversions();
-    unavailableConversions = await conversionDiscovery.getUnavailableConversions();
-
-    console.log(`Found ${availableConversions.length} available conversions:`);
-    availableConversions.forEach(conv => {
-      console.log(`  ✓ ${conv.endpoint}: ${conv.fromFormat} → ${conv.toFormat}`);
-    });
-
-    if (unavailableConversions.length > 0) {
-      console.log(`Found ${unavailableConversions.length} unavailable conversions:`);
-      unavailableConversions.forEach(conv => {
-        console.log(`  ✗ ${conv.endpoint}: ${conv.fromFormat} → ${conv.toFormat}`);
-      });
-    }
-  });
+// ---------------------------------------------------------------------------
+// Helper: select the TO format in the convert dropdown
+// The FROM format is auto-detected from the uploaded file (e.g. PDF → "Document (PDF)").
+// Opening the TO dropdown renders format-option-{value} buttons in a portal.
+// ---------------------------------------------------------------------------
+async function selectToFormat(page: Page, toValue: string) {
+  await page.getByTestId('convert-to-dropdown').click();
+  await page.getByTestId(`format-option-${toValue}`).click();
+}
 
+// ---------------------------------------------------------------------------
+// Tests
+// ---------------------------------------------------------------------------
+test.describe('Convert Tool', () => {
   test.beforeEach(async ({ page }) => {
-    // Navigate to the homepage
-    await page.goto(`${BASE_URL}`);
-
-    // Wait for the page to load
-    await page.waitForLoadState('networkidle');
-
-    // Wait for the QuickAccessBar to appear
+    await mockAppApis(page);
+    await page.goto('/?bypassOnboarding=true');
     await page.waitForSelector('[data-testid="files-button"]', { timeout: 10000 });
   });
 
-  test.describe('Dynamic Conversion Tests', () => {
+  test('convert button is disabled before a TO format is selected', async ({ page }) => {
+    await uploadFile(page, SAMPLE_PDF);
+    await navigateToConvert(page);
 
-    // Generate a test for each potentially available conversion
-    // We'll discover all possible conversions and then skip unavailable ones at runtime
-    test('PDF to PNG conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-        endpoint: '/api/v1/convert/pdf/img',
-        fromFormat: 'pdf',
-        toFormat: 'png',
-        description: '',
-        apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('PDF to DOCX conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-        endpoint: '/api/v1/convert/pdf/word',
-        fromFormat: 'pdf',
-        toFormat: 'docx',
-        description: '',
-        apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('DOCX to PDF conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-          endpoint: '/api/v1/convert/file/pdf',
-          fromFormat: 'docx',
-          toFormat: 'pdf',
-          description: '',
-          apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('Image to PDF conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-        endpoint: '/api/v1/convert/img/pdf',
-        fromFormat: 'png',
-        toFormat: 'pdf',
-        description: '',
-        apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('PDF to TXT conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-        endpoint: '/api/v1/convert/pdf/text',
-        fromFormat: 'pdf',
-        toFormat: 'txt',
-        description: '',
-        apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('PDF to HTML conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-        endpoint: '/api/v1/convert/pdf/html',
-        fromFormat: 'pdf',
-        toFormat: 'html',
-        description: '',
-        apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('PDF to XML conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-        endpoint: '/api/v1/convert/pdf/xml',
-        fromFormat: 'pdf',
-        toFormat: 'xml',
-        description: '',
-        apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('PDF to CSV conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-        endpoint: '/api/v1/convert/pdf/csv',
-        fromFormat: 'pdf',
-        toFormat: 'csv',
-        description: '',
-        apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
-
-    test('PDF to PDFA conversion', async ({ page }) => {
-      const conversion: ConversionEndpoint = {
-          endpoint: '/api/v1/convert/pdf/pdfa',
-          fromFormat: 'pdf',
-          toFormat: 'pdfa',
-          description: '',
-          apiPath: ''
-      };
-      const isAvailable = availableConversions.some(c => c.apiPath === conversion.endpoint);
-      test.skip(!isAvailable, `Endpoint ${conversion.endpoint} is not available`);
-
-      const testFile = getTestFileForFormat(conversion.fromFormat);
-      await uploadFileViaModal(page, testFile);
-
-      await testConversion(page, conversion);
-    });
+    // FROM is auto-detected as PDF; TO not selected → button visible but disabled
+    const convertBtn = page.getByTestId('convert-button');
+    await expect(convertBtn).toBeVisible({ timeout: 3000 });
+    await expect(convertBtn).toBeDisabled();
   });
 
-  test.describe('Static Tests', () => {
+  test('successful PDF to PNG conversion shows download option', async ({ page }) => {
+    // Minimal valid PNG header (8 bytes signature + padding)
+    const fakePng = Buffer.from([
+      0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a,
+      ...Array(504).fill(0),
+    ]);
 
-    // Test that disabled conversions don't appear in dropdowns when they shouldn't
-    test('should not show conversion button when no valid conversions available', async ({ page }) => {
-      // This test ensures the convert button is disabled when no valid conversion is possible
-      await uploadFileViaModal(page, TEST_FILES.pdf);
+    await page.route('**/api/v1/convert/pdf/img', (route) =>
+      route.fulfill({
+        status: 200,
+        contentType: 'image/png',
+        headers: { 'Content-Disposition': 'attachment; filename="sample.png"' },
+        body: fakePng,
+      })
+    );
 
-      // Click the Convert tool button
-      await page.click('[data-testid="tool-convert"]');
+    await uploadFile(page, SAMPLE_PDF);
+    await navigateToConvert(page);
+    await selectToFormat(page, 'png');
+    await page.getByTestId('convert-button').click();
 
-      // Wait for convert mode and select file
-      await page.waitForSelector('[data-testid="file-thumbnail"]', { timeout: 5000 });
-      await page.click('[data-testid="file-thumbnail-checkbox"]');
+    await expect(page.getByTestId('download-result-button')).toBeVisible({ timeout: 10000 });
+  });
 
-      // Don't select any formats - convert button should not exist
-      const convertButton = page.locator('[data-testid="convert-button"]');
-      await expect(convertButton).toHaveCount(0);
-    });
+  test('conversion API error shows error notification', async ({ page }) => {
+    await page.route('**/api/v1/convert/pdf/img', (route) =>
+      route.fulfill({
+        status: 500,
+        contentType: 'text/plain',
+        body: 'Internal server error: conversion failed',
+      })
+    );
+
+    await uploadFile(page, SAMPLE_PDF);
+    await navigateToConvert(page);
+    await selectToFormat(page, 'png');
+    await page.getByTestId('convert-button').click();
+
+    // Mantine Notification renders as role="alert"
+    await expect(page.getByRole('alert').first()).toBeVisible({ timeout: 5000 });
+  });
+
+  test('convert button becomes enabled after selecting a valid TO format', async ({ page }) => {
+    await uploadFile(page, SAMPLE_PDF);
+    await navigateToConvert(page);
+
+    // Before selecting TO format — button visible but disabled
+    const convertBtn = page.getByTestId('convert-button');
+    await expect(convertBtn).toBeVisible({ timeout: 3000 });
+    await expect(convertBtn).toBeDisabled();
+
+    // After selecting PNG as TO format — button enabled
+    await selectToFormat(page, 'png');
+    await expect(convertBtn).toBeEnabled({ timeout: 3000 });
   });
 });
-
diff --git a/frontend/src/core/tests/helpers/conversionEndpointDiscovery.ts b/frontend/src/core/tests/helpers/conversionEndpointDiscovery.ts
deleted file mode 100644
index 6ff8d5d7c9..0000000000
--- a/frontend/src/core/tests/helpers/conversionEndpointDiscovery.ts
+++ /dev/null
@@ -1,325 +0,0 @@
-/**
- * Conversion Endpoint Discovery for E2E Testing
- *
- * Uses the backend's endpoint configuration API to discover available conversions
- */
-
-import { useMultipleEndpointsEnabled } from '@app/hooks/useEndpointConfig';
-
-export interface ConversionEndpoint {
-  endpoint: string;
-  fromFormat: string;
-  toFormat: string;
-  description: string;
-  apiPath: string;
-}
-
-// Complete list of conversion endpoints based on EndpointConfiguration.java
-const ALL_CONVERSION_ENDPOINTS: ConversionEndpoint[] = [
-  {
-    endpoint: 'pdf-to-img',
-    fromFormat: 'pdf',
-    toFormat: 'image',
-    description: 'Convert PDF to images (PNG, JPG, GIF, etc.)',
-    apiPath: '/api/v1/convert/pdf/img'
-  },
-  {
-    endpoint: 'img-to-pdf',
-    fromFormat: 'image',
-    toFormat: 'pdf',
-    description: 'Convert images to PDF',
-    apiPath: '/api/v1/convert/img/pdf'
-  },
-  {
-    endpoint: 'pdf-to-pdfa',
-    fromFormat: 'pdf',
-    toFormat: 'pdfa',
-    description: 'Convert PDF to PDF/A',
-    apiPath: '/api/v1/convert/pdf/pdfa'
-  },
-  {
-    endpoint: 'file-to-pdf',
-    fromFormat: 'office',
-    toFormat: 'pdf',
-    description: 'Convert office files to PDF',
-    apiPath: '/api/v1/convert/file/pdf'
-  },
-  {
-    endpoint: 'pdf-to-word',
-    fromFormat: 'pdf',
-    toFormat: 'docx',
-    description: 'Convert PDF to Word document',
-    apiPath: '/api/v1/convert/pdf/word'
-  },
-  {
-    endpoint: 'pdf-to-presentation',
-    fromFormat: 'pdf',
-    toFormat: 'pptx',
-    description: 'Convert PDF to PowerPoint presentation',
-    apiPath: '/api/v1/convert/pdf/presentation'
-  },
-  {
-    endpoint: 'pdf-to-text',
-    fromFormat: 'pdf',
-    toFormat: 'txt',
-    description: 'Convert PDF to plain text',
-    apiPath: '/api/v1/convert/pdf/text'
-  },
-  {
-    endpoint: 'pdf-to-html',
-    fromFormat: 'pdf',
-    toFormat: 'html',
-    description: 'Convert PDF to HTML',
-    apiPath: '/api/v1/convert/pdf/html'
-  },
-  {
-    endpoint: 'pdf-to-xml',
-    fromFormat: 'pdf',
-    toFormat: 'xml',
-    description: 'Convert PDF to XML',
-    apiPath: '/api/v1/convert/pdf/xml'
-  },
-  {
-    endpoint: 'html-to-pdf',
-    fromFormat: 'html',
-    toFormat: 'pdf',
-    description: 'Convert HTML to PDF',
-    apiPath: '/api/v1/convert/html/pdf'
-  },
-  {
-    endpoint: 'url-to-pdf',
-    fromFormat: 'url',
-    toFormat: 'pdf',
-    description: 'Convert web page to PDF',
-    apiPath: '/api/v1/convert/url/pdf'
-  },
-  {
-    endpoint: 'markdown-to-pdf',
-    fromFormat: 'md',
-    toFormat: 'pdf',
-    description: 'Convert Markdown to PDF',
-    apiPath: '/api/v1/convert/markdown/pdf'
-  },
-  {
-    endpoint: 'pdf-to-csv',
-    fromFormat: 'pdf',
-    toFormat: 'csv',
-    description: 'Extract CSV data from PDF',
-    apiPath: '/api/v1/convert/pdf/csv'
-  },
-  {
-    endpoint: 'pdf-to-xlsx',
-    fromFormat: 'pdf',
-    toFormat: 'xlsx',
-    description: 'Extract Excel spreadsheet from PDF',
-    apiPath: '/api/v1/convert/pdf/xlsx'
-  },
-  {
-    endpoint: 'pdf-to-markdown',
-    fromFormat: 'pdf',
-    toFormat: 'md',
-    description: 'Convert PDF to Markdown',
-    apiPath: '/api/v1/convert/pdf/markdown'
-  },
-  {
-    endpoint: 'eml-to-pdf',
-    fromFormat: 'eml',
-    toFormat: 'pdf',
-    description: 'Convert email (EML) to PDF',
-    apiPath: '/api/v1/convert/eml/pdf'
-  },
-  {
-    endpoint: 'pdf-to-epub',
-    fromFormat: 'pdf',
-    toFormat: 'epub',
-    description: 'Convert PDF to EPUB/AZW3',
-    apiPath: '/api/v1/convert/pdf/epub'
-  },
-  {
-    endpoint: 'eml-to-pdf', // MSG uses same endpoint as EML
-    fromFormat: 'msg',
-    toFormat: 'pdf',
-    description: 'Convert Outlook email (MSG) to PDF',
-    apiPath: '/api/v1/convert/eml/pdf'
-  }
-];
-
-export class ConversionEndpointDiscovery {
-  private baseUrl: string;
-  private cache: Map<string, boolean> | null = null;
-  private cacheExpiry: number = 0;
-  private readonly CACHE_DURATION = 5 * 60 * 1000; // 5 minutes
-
-  constructor(baseUrl: string = process.env.BACKEND_URL || 'http://localhost:8080') {
-    this.baseUrl = baseUrl;
-  }
-
-  /**
-   * Get all available conversion endpoints by checking with backend
-   */
-  async getAvailableConversions(): Promise<ConversionEndpoint[]> {
-    const endpointStatuses = await this.getEndpointStatuses();
-
-    return ALL_CONVERSION_ENDPOINTS.filter(conversion =>
-      endpointStatuses.get(conversion.endpoint) === true
-    );
-  }
-
-  /**
-   * Get all unavailable conversion endpoints
-   */
-  async getUnavailableConversions(): Promise<ConversionEndpoint[]> {
-    const endpointStatuses = await this.getEndpointStatuses();
-
-    return ALL_CONVERSION_ENDPOINTS.filter(conversion =>
-      endpointStatuses.get(conversion.endpoint) === false
-    );
-  }
-
-  /**
-   * Check if a specific conversion is available
-   */
-  async isConversionAvailable(endpoint: string): Promise<boolean> {
-    const endpointStatuses = await this.getEndpointStatuses();
-    return endpointStatuses.get(endpoint) === true;
-  }
-
-  /**
-   * Get available conversions grouped by source format
-   */
-  async getConversionsByFormat(): Promise<Record<string, ConversionEndpoint[]>> {
-    const availableConversions = await this.getAvailableConversions();
-
-    const grouped: Record<string, ConversionEndpoint[]> = {};
-
-    availableConversions.forEach(conversion => {
-      if (!grouped[conversion.fromFormat]) {
-        grouped[conversion.fromFormat] = [];
-      }
-      grouped[conversion.fromFormat].push(conversion);
-    });
-
-    return grouped;
-  }
-
-  /**
-   * Get supported target formats for a given source format
-   */
-  async getSupportedTargetFormats(fromFormat: string): Promise<string[]> {
-    const availableConversions = await this.getAvailableConversions();
-
-    return availableConversions
-      .filter(conversion => conversion.fromFormat === fromFormat)
-      .map(conversion => conversion.toFormat);
-  }
-
-  /**
-   * Get all supported source formats
-   */
-  async getSupportedSourceFormats(): Promise<string[]> {
-    const availableConversions = await this.getAvailableConversions();
-
-    const sourceFormats = new Set(
-      availableConversions.map(conversion => conversion.fromFormat)
-    );
-
-    return Array.from(sourceFormats);
-  }
-
-  /**
-   * Get endpoint statuses from backend using batch API
-   */
-  private async getEndpointStatuses(): Promise<Map<string, boolean>> {
-    // Return cached result if still valid
-    if (this.cache && Date.now() < this.cacheExpiry) {
-      return this.cache;
-    }
-
-    try {
-      const endpointNames = ALL_CONVERSION_ENDPOINTS.map(conv => conv.endpoint);
-      const endpointsParam = endpointNames.join(',');
-
-      const response = await fetch(
-        `${this.baseUrl}/api/v1/config/endpoints-enabled?endpoints=${encodeURIComponent(endpointsParam)}`
-      );
-
-      if (!response.ok) {
-        throw new Error(`Failed to fetch endpoint statuses: ${response.status} ${response.statusText}`);
-      }
-
-      const statusMap: Record<string, boolean> = await response.json();
-
-      // Convert to Map and cache
-      this.cache = new Map(Object.entries(statusMap));
-      this.cacheExpiry = Date.now() + this.CACHE_DURATION;
-
-      console.log(`Retrieved status for ${Object.keys(statusMap).length} conversion endpoints`);
-      return this.cache;
-
-    } catch (error) {
-      console.error('Failed to get endpoint statuses:', error);
-
-      // Fallback: assume all endpoints are disabled
-      const fallbackMap = new Map<string, boolean>();
-      ALL_CONVERSION_ENDPOINTS.forEach(conv => {
-        fallbackMap.set(conv.endpoint, false);
-      });
-
-      return fallbackMap;
-    }
-  }
-
-  /**
-   * Utility to create a skipping condition for tests
-   */
-  static createSkipCondition(endpoint: string, discovery: ConversionEndpointDiscovery) {
-    return async () => {
-      const available = await discovery.isConversionAvailable(endpoint);
-      return !available;
-    };
-  }
-
-  /**
-   * Get detailed conversion info by endpoint name
-   */
-  getConversionInfo(endpoint: string): ConversionEndpoint | undefined {
-    return ALL_CONVERSION_ENDPOINTS.find(conv => conv.endpoint === endpoint);
-  }
-
-  /**
-   * Get all conversion endpoints (regardless of availability)
-   */
-  getAllConversions(): ConversionEndpoint[] {
-    return [...ALL_CONVERSION_ENDPOINTS];
-  }
-}
-
-// Export singleton instance for reuse across tests
-export const conversionDiscovery = new ConversionEndpointDiscovery();
-
-/**
- * React hook version for use in components (wraps the class)
- */
-export function useConversionEndpoints() {
-  const endpointNames = ALL_CONVERSION_ENDPOINTS.map(conv => conv.endpoint);
-  const { endpointStatus, loading, error, refetch } = useMultipleEndpointsEnabled(endpointNames);
-
-  const availableConversions = ALL_CONVERSION_ENDPOINTS.filter(
-    conv => endpointStatus[conv.endpoint] === true
-  );
-
-  const unavailableConversions = ALL_CONVERSION_ENDPOINTS.filter(
-    conv => endpointStatus[conv.endpoint] === false
-  );
-
-  return {
-    availableConversions,
-    unavailableConversions,
-    allConversions: ALL_CONVERSION_ENDPOINTS,
-    endpointStatus,
-    loading,
-    error,
-    refetch,
-    isConversionAvailable: (endpoint: string) => endpointStatus[endpoint] === true
-  };
-}
diff --git a/frontend/src/core/tools/Convert.tsx b/frontend/src/core/tools/Convert.tsx
index e74c46fef4..53dd1be196 100644
--- a/frontend/src/core/tools/Convert.tsx
+++ b/frontend/src/core/tools/Convert.tsx
@@ -37,7 +37,7 @@ const Convert = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = convertOperation.files.length > 0 || convertOperation.downloadUrl !== null;
+  const hasResults = convertOperation.files.length > 0 || convertOperation.downloadUrl !== null || !!convertOperation.errorMessage;
   const settingsCollapsed = hasResults;
 
   // When operation completes, flag the next selection change to skip reset