London | 25-SDC-July | Fatma Arslantas | Sprint 1 | Hashtag slowing down my browser

front-end/tests/hashtag.spec.mjs

@@ -0,0 +1,30 @@
+import { test, expect } from "@playwright/test";
+
+test.describe("Hashtag View Tests", () => {
+
+  test("should only make one fetch request (no infinite loop)", async ({ page }) => {
+
+    // How many requests go to the server
+    let fetchCount = 0;
+
+    // Network requests
+    page.on("request", (request) => {
+      if (
+        request.url().includes("hashtag") && 
+        request.resourceType() === "fetch"
+      ) {
+        fetchCount++;
+      }
+    });
+
+    // Go to the hashtag page
+    await page.goto("/#/hashtag/do");
+
+    // Wait for a short time (0.5 seconds)
+    await page.waitForTimeout(500);
+
+    // We expect only 1 or 2 requests. 
+    expect(fetchCount).toBeLessThan(3); 
+  });
+
+});

front-end/views/hashtag.mjs

@@ -17,7 +17,10 @@ import {createHeading} from "../components/heading.mjs";
 function hashtagView(hashtag) {
   destroy();
 
-  apiService.getBloomsByHashtag(hashtag);
+  const formattedHashtag = hashtag.startsWith('#') ? hashtag : `#${hashtag}`;
+  if (state.currentHashtag !== formattedHashtag) {
+    apiService.getBloomsByHashtag(hashtag);
+  }
 
   renderOne(
     state.isLoggedIn,