From 65cc438dfbd1b55dea24e75615515637e44d4e81 Mon Sep 17 00:00:00 2001
From: Caleb Stauffer <crstauf@users.noreply.github.com>
Date: Wed, 19 Jul 2023 13:37:34 -0400
Subject: [PATCH 1/4] add waiting notice and support missing script

---
 output/html/web_vitals.php | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/output/html/web_vitals.php b/output/html/web_vitals.php
index f3241a38b..c8443dd69 100644
--- a/output/html/web_vitals.php
+++ b/output/html/web_vitals.php
@@ -34,6 +34,15 @@ public function name() {
 	 * @return void
 	 */
 	public function output() {
+		if ( ! wp_script_is( 'web-vitals', 'enqueued' ) && ! wp_script_is( 'web-vitals', 'done' ) ) {
+			$this->before_non_tabular_output();
+			/* translators: %s: Script handle. */
+			$notice = sprintf( __( 'Script %s is not available.' ), 'query-monitor' ), 'web-vitals' );
+			echo $this->build_notice( $notice );
+			$this->after_non_tabular_output();
+			return;
+		}
+		
 		$this->before_tabular_output();
 		echo '<thead>';
 
@@ -47,19 +56,24 @@ public function output() {
 		echo '</thead>';
 
 		echo '<tbody id="qm-web-vitals-inner">';
+			echo '<tr class="waiting">';
+				echo '<td colspan="4">';
+					echo '<div class="qm-none"><p>Waiting for data...</p></div>';
+				echo '</td>';
+			echo '</tr>';
 		echo '</tbody>';
 
 		$this->after_tabular_output();
 		echo '<script>
 		// Insert the web vital into the qm-web-vitals div.
 		function insertWebVital( webVital ) {
-			console.log( { webVital } );
 			var webVitalsDiv = document.getElementById( "qm-web-vitals-inner" );
 			var divToAdd = document.createElement("tr");
 			divToAdd.innerHTML = "<td>" + webVital.name + "</td>" +
 				"<td>" + webVital.value + "</td>" +
 				"<td>" + webVital.rating + "</td>" +
 				"<td><pre class=\"qm-pre-wrap\"><code>" + JSON.stringify( webVital ) + "</code></pre></td>";
+    			webVitalsDiv.querySelector( ".waiting" )?.remove();
 			webVitalsDiv.appendChild( divToAdd );
 		}
 

From a12eb48f9fddec86235afa4ed4f68c438c7c8656 Mon Sep 17 00:00:00 2001
From: Caleb Stauffer <crstauf@users.noreply.github.com>
Date: Wed, 19 Jul 2023 13:38:22 -0400
Subject: [PATCH 2/4] fix nesting

---
 output/html/web_vitals.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/output/html/web_vitals.php b/output/html/web_vitals.php
index c8443dd69..afee99255 100644
--- a/output/html/web_vitals.php
+++ b/output/html/web_vitals.php
@@ -73,7 +73,7 @@ function insertWebVital( webVital ) {
 				"<td>" + webVital.value + "</td>" +
 				"<td>" + webVital.rating + "</td>" +
 				"<td><pre class=\"qm-pre-wrap\"><code>" + JSON.stringify( webVital ) + "</code></pre></td>";
-    			webVitalsDiv.querySelector( ".waiting" )?.remove();
+			webVitalsDiv.querySelector( ".waiting" )?.remove();
 			webVitalsDiv.appendChild( divToAdd );
 		}
 

From f130bb4a967592b6aa90acfd4e7b1b1263e13d6a Mon Sep 17 00:00:00 2001
From: Caleb Stauffer <develop+github@calebstauffer.com>
Date: Wed, 19 Jul 2023 13:46:27 -0400
Subject: [PATCH 3/4] change script handle and version

---
 dispatchers/Html.php       | 4 ++--
 output/html/web_vitals.php | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/dispatchers/Html.php b/dispatchers/Html.php
index 6c82b4bfd..ca5fc4cbc 100644
--- a/dispatchers/Html.php
+++ b/dispatchers/Html.php
@@ -237,10 +237,10 @@ public function enqueue_assets() {
 		// Only load if the wp-admin bar is visible.
 		if ( is_admin_bar_showing() ) {
 			wp_enqueue_script(
-				'web-vitals',
+				'qm-web-vitals',
 				$this->qm->plugin_url( 'assets/web-vitals.js' ),
 				array(),
-				QM_VERSION,
+				'3.3.2',
 				true
 			);
 		}
diff --git a/output/html/web_vitals.php b/output/html/web_vitals.php
index afee99255..ca4674577 100644
--- a/output/html/web_vitals.php
+++ b/output/html/web_vitals.php
@@ -34,7 +34,7 @@ public function name() {
 	 * @return void
 	 */
 	public function output() {
-		if ( ! wp_script_is( 'web-vitals', 'enqueued' ) && ! wp_script_is( 'web-vitals', 'done' ) ) {
+		if ( ! wp_script_is( 'qm-web-vitals', 'enqueued' ) && ! wp_script_is( 'qm-web-vitals', 'done' ) ) {
 			$this->before_non_tabular_output();
 			/* translators: %s: Script handle. */
 			$notice = sprintf( __( 'Script %s is not available.' ), 'query-monitor' ), 'web-vitals' );
@@ -42,7 +42,7 @@ public function output() {
 			$this->after_non_tabular_output();
 			return;
 		}
-		
+
 		$this->before_tabular_output();
 		echo '<thead>';
 

From 7063e3b2b1653e9132ba6c694ac4748938748f36 Mon Sep 17 00:00:00 2001
From: Caleb Stauffer <develop+github@calebstauffer.com>
Date: Wed, 19 Jul 2023 13:46:42 -0400
Subject: [PATCH 4/4] remove extra parenthesis

---
 output/html/web_vitals.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/output/html/web_vitals.php b/output/html/web_vitals.php
index ca4674577..674a3d7ef 100644
--- a/output/html/web_vitals.php
+++ b/output/html/web_vitals.php
@@ -37,7 +37,7 @@ public function output() {
 		if ( ! wp_script_is( 'qm-web-vitals', 'enqueued' ) && ! wp_script_is( 'qm-web-vitals', 'done' ) ) {
 			$this->before_non_tabular_output();
 			/* translators: %s: Script handle. */
-			$notice = sprintf( __( 'Script %s is not available.' ), 'query-monitor' ), 'web-vitals' );
+			$notice = sprintf( __( 'Script %s is not available.', 'query-monitor' ), 'qm-web-vitals' );
 			echo $this->build_notice( $notice );
 			$this->after_non_tabular_output();
 			return;