diff --git a/packages/html-reporter/index.html b/packages/html-reporter/index.html
index 054507220c..970a975b12 100644
--- a/packages/html-reporter/index.html
+++ b/packages/html-reporter/index.html
@@ -20,7 +20,8 @@
-
Playwright Test Report
+ Playwright Test Report | Summary
+
diff --git a/packages/html-reporter/logo_default.svg b/packages/html-reporter/logo_default.svg
new file mode 100644
index 0000000000..7b3ca7d6c9
--- /dev/null
+++ b/packages/html-reporter/logo_default.svg
@@ -0,0 +1,9 @@
+
diff --git a/packages/html-reporter/logo_expected.svg b/packages/html-reporter/logo_expected.svg
new file mode 100644
index 0000000000..9c21caccfe
--- /dev/null
+++ b/packages/html-reporter/logo_expected.svg
@@ -0,0 +1,20 @@
+
+
+
diff --git a/packages/html-reporter/logo_flaky.svg b/packages/html-reporter/logo_flaky.svg
new file mode 100644
index 0000000000..1ddda4064c
--- /dev/null
+++ b/packages/html-reporter/logo_flaky.svg
@@ -0,0 +1,20 @@
+
+
+
diff --git a/packages/html-reporter/logo_skipped.svg b/packages/html-reporter/logo_skipped.svg
new file mode 100644
index 0000000000..277ae4bbcc
--- /dev/null
+++ b/packages/html-reporter/logo_skipped.svg
@@ -0,0 +1,20 @@
+
+
+
diff --git a/packages/html-reporter/logo_unexpected.svg b/packages/html-reporter/logo_unexpected.svg
new file mode 100644
index 0000000000..d192486534
--- /dev/null
+++ b/packages/html-reporter/logo_unexpected.svg
@@ -0,0 +1,20 @@
+
+
+
diff --git a/packages/html-reporter/src/testCaseView.tsx b/packages/html-reporter/src/testCaseView.tsx
index 507ddf4ffb..418edb58cc 100644
--- a/packages/html-reporter/src/testCaseView.tsx
+++ b/packages/html-reporter/src/testCaseView.tsx
@@ -44,6 +44,11 @@ export const TestCaseView: React.FC<{
return test?.annotations?.filter(annotation => !annotation.type.startsWith('_')) || [];
}, [test?.annotations]);
+ React.useEffect(() => {
+ document.title = `| ${test?.title}` ?? 'Playwright Test Report';
+ setSvgFavicon(test?.outcome);
+ }, [test?.outcome, test?.title]);
+
return
{test &&
{test.path.join(' › ')}
}
{test &&
{test?.title}
}
@@ -130,3 +135,18 @@ const LabelsLinkView: React.FC
) : null;
};
+
+function setSvgFavicon(outcome: 'skipped' | 'expected' | 'unexpected' | 'flaky'| undefined) {
+ // Find or create a link element for the favicon
+ let link: HTMLLinkElement | null = document.querySelector("link[rel*='icon']");
+ if (!link) {
+ link = document.createElement('link');
+ link.rel = 'icon';
+ document.getElementsByTagName('head')[0].appendChild(link);
+ }
+
+ if (!outcome)
+ link.href = '../logo_default.svg';
+ else
+ link.href = `../logo_${outcome}.svg`;
+}
\ No newline at end of file