From 638a9681cfbaa8a5f439f56c915bd17b0185be78 Mon Sep 17 00:00:00 2001
From: Camillo Bruni <camillobruni@users.noreply.github.com>
Date: Thu, 25 Jan 2024 11:21:55 +0100
Subject: [PATCH] Update document title (#354)

Use a "data-title" attribute for each section to update document.title.
---
 index.html         | 6 +++---
 resources/main.mjs | 8 ++++++++
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index 4f288be58..a796c839b 100644
--- a/index.html
+++ b/index.html
@@ -49,7 +49,7 @@
                 </div>
             </section>
 
-            <section id="summary">
+            <section id="summary" data-title="Results Summary">
                 <a href="#home" class="logo">
                     <img srcset="resources/logo@2x.png 2x" src="resources/logo.png" alt="Speedometer" />
                     <div class="version">3.0</div>
@@ -69,7 +69,7 @@ <h1>Score</h1>
                 </div>
             </section>
 
-            <section id="details">
+            <section id="details" data-title="Results Details">
                 <a href="#home" class="logo">
                     <img srcset="resources/logo@2x.png 2x" src="resources/logo.png" alt="Speedometer" />
                     <div class="version">3.0</div>
@@ -103,7 +103,7 @@ <h2>Detailed Metrics</h2>
                 </div>
             </section>
 
-            <section id="about">
+            <section id="about" data-title="About">
                 <a href="#home" class="logo">
                     <img srcset="resources/logo@2x.png 2x" src="resources/logo.png" alt="Speedometer" />
                     <div class="version">3.0</div>
diff --git a/resources/main.mjs b/resources/main.mjs
index 672fb8e68..f38753ec6 100644
--- a/resources/main.mjs
+++ b/resources/main.mjs
@@ -351,10 +351,18 @@ class MainBenchmarkClient {
         if (hash === "#home" || hash === "") {
             if (window.location.hash !== hash)
                 window.location.hash = "#home";
+            hash = "#home";
             this._removeLocationHash();
         } else {
             window.location.hash = hash;
         }
+        this._updateDocumentTitle(hash);
+    }
+
+    _updateDocumentTitle(hash) {
+        const maybeSection = document.querySelector(hash);
+        const sectionTitle = maybeSection?.getAttribute("data-title") ?? "";
+        document.title = `Speedometer 3 ${sectionTitle}`.trimEnd();
     }
 
     _removeLocationHash() {