[Feature]: Render URLs in HTML reporter title as clickable links

[dirtydiesel46]

🚀 Feature Request

From Playwright 1.53.0 release notes, on the section as per below found in https://playwright.dev/docs/release-notes#version-1.53

New option in 'html' reporter to set the title of a specific test run:

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['html', { title: 'Custom test run #1028' }]]
});

Problem:

Currently, if a URL is included in the title option for the HTML reporter, it is rendered as a plain string. It would be much more useful if Playwright could detect and render these URLs as clickable tag hyperlinks.

This would allow teams to embed dynamic and relevant links - such as to the the specific environment and/or baseUrl under test, or a link to the logs for given baseUrl - directly into the report's header for quick navigation.

Example

Example Configuration

Consider the following playwright.config.ts:

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['html', { 
    title: 'Test run for build based on https://playwright.dev/docs/release-notes#version-1.53' 
  }]]
});

Current Behavior

The title in the HTML report is displayed as the plain text string:

Test run for build based on https://playwright.dev/docs/release-notes#version-1.53

Desired Behavior

The title should be rendered with a clickable link:

Test run for build based on https://playwright.dev/docs/release-notes#version-1.53

Motivation

This small enhancement would significantly improve the usability of the HTML report by making relevant resources instantly accessible.