chore: update github actions and add missing integration tests

Author: hakenprog

.github/workflows/main.yml

@@ -37,21 +37,14 @@ jobs:
         continue-on-error: true
         run: yarn list
 
-      # - name: Install dependencies in playground
-      #   run: yarn install
-      #   working-directory: ./playground
-      - run: yarn install
+      - name: Install dependencies
+        run: yarn install
 
       - name: Install Playwright Browsers
         run: npx playwright install --with-deps
 
       - name: Build Playground
         run:  yarn dev:build
 
-
-      # - name: Build the playground
-      #   run: yarn build
-      #   working-directory: ./playground
-
       - name: Execute tests
         run: yarn test

src/runtime/plugin.ts

@@ -41,7 +41,7 @@ export default defineNuxtPlugin((nuxtApp) => {
     };
 
     // Exit if the last entry is the same as the new entry
-    if (isRepeatedEntry(data, sessionId)) return;
+    if (isRepeatedEntry(data, dataObject)) return;
 
     // Add the new item to the data array
     data.value.unshift(dataObject);

src/runtime/utm.ts

@@ -63,8 +63,19 @@ export const getAdditionalInfo = (): AdditionalInfo => {
 
 export const isRepeatedEntry = (
   data: Ref<DataObject[]>,
-  currentSessionID: string
+  currentEntry: DataObject
 ): boolean => {
   const lastEntry = data.value?.[0];
-  return lastEntry && lastEntry.sessionId === currentSessionID;
+  const lastUtm = lastEntry?.utmParams;
+  const newUtm = currentEntry.utmParams;
+
+  return (
+    lastEntry &&
+    lastUtm.utm_campaign === newUtm.utm_campaign &&
+    lastUtm.utm_content === newUtm.utm_content &&
+    lastUtm.utm_medium === newUtm.utm_medium &&
+    lastUtm.utm_source === newUtm.utm_source &&
+    lastUtm.utm_term === newUtm.utm_term &&
+    lastEntry.sessionId === currentEntry.sessionId
+  );
 };

test/integration.test.ts

@@ -1,3 +1,4 @@
+import { DataObject } from 'nuxt-utm';
 import { describe, it, expect, beforeEach } from "vitest";
 import { fileURLToPath } from "node:url";
 import { setup, $fetch, createPage } from "@nuxt/test-utils";
@@ -17,8 +18,9 @@ describe("ssr", async () => {
   });
 
   describe("UTM params", () => {
-    let utmParamsArray: any[];
+    let utmParamsArray: DataObject[];
     let page: Page;
+
     beforeEach(async () => {
       page = await createPage(
         "/?utm_source=test_source&utm_medium=test_medium&utm_campaign=test_campaign&utm_term=test_term&utm_content=test_content"
@@ -32,6 +34,7 @@ describe("ssr", async () => {
     it("Stores  data in local storage", async () => {
       expect(utmParamsArray?.[0]).toBeDefined();
     });
+
     it("Stores UTM params", async () => {
       expect(utmParamsArray?.[0].utmParams).toEqual({
         utm_campaign: "test_campaign",
@@ -41,5 +44,50 @@ describe("ssr", async () => {
         utm_term: "test_term",
       });
     });
+
+    it("Doesn't store anything after a page reload with the same UTM params and session", async () => {
+      await page.reload();
+      const rawData = await page?.evaluate(() =>
+        window.localStorage.getItem("nuxt-utm-data")
+      );
+      utmParamsArray = await JSON.parse(rawData ?? "[]");
+      expect(utmParamsArray.length).toEqual(1);
+    });
+
+    it("Stores a new value if the UTM params are different but the session is the same", async () => {
+      const urlBase = page.url().split("?")[0];
+      await page.goto(
+        `${urlBase}/?utm_source=test_source2&utm_medium=test_medium2&utm_campaign=test_campaign2&utm_term=test_term2&utm_content=test_content2`
+      );
+      const rawData = await page.evaluate(() =>
+        localStorage.getItem("nuxt-utm-data")
+      );
+      utmParamsArray = await JSON.parse(rawData ?? "[]");
+      expect(utmParamsArray[0].utmParams).toEqual({
+        utm_campaign: "test_campaign2",
+        utm_content: "test_content2",
+        utm_medium: "test_medium2",
+        utm_source: "test_source2",
+        utm_term: "test_term2",
+      });
+    });
+
+    it("Stores a new value if the UTM params are the same but the session is different", async () => {
+      await page.evaluate(() =>
+        sessionStorage.setItem("nuxt-utm-session-id", "old-session")
+      );
+      await page.reload();
+      const rawData = await page.evaluate(() =>
+        localStorage.getItem("nuxt-utm-data")
+      );
+      utmParamsArray = await JSON.parse(rawData ?? "[]");
+      expect(utmParamsArray[0].utmParams).toEqual({
+        utm_campaign: "test_campaign",
+        utm_content: "test_content",
+        utm_medium: "test_medium",
+        utm_source: "test_source",
+        utm_term: "test_term",
+      });
+    });
   });
 });

test/unit.test.ts

@@ -72,19 +72,22 @@ describe("getUtmParams function", () => {
 
 describe("isRepeatedEntry function", () => {
   let data: Ref<DataObject[]>;
+  let newUtmItem: DataObject;
   beforeEach(() => {
     data = ref<DataObject[]>(JSON.parse(`[${utmItem}]`));
+    newUtmItem = JSON.parse(utmItem);
   });
 
   it("Returns true if the utm params and the session already exists in local storage", () => {
-    expect(isRepeatedEntry(data, "beai1gx7dg")).toBeTruthy();
+    expect(isRepeatedEntry(data, newUtmItem)).toBeTruthy();
   });
   it("Returns false if the utm params are the same but the session is different", () => {
-    expect(isRepeatedEntry(data, "newSession")).toBeFalsy();
+    newUtmItem.sessionId = "New Session";
+    expect(isRepeatedEntry(data, newUtmItem)).toBeFalsy();
   });
   it("Returns false if the utm params are different but the session is the same", () => {
-    const data = ref<DataObject[]>(JSON.parse(`[${utmItem}]`));
-    expect(isRepeatedEntry(data, "newSession")).toBeFalsy();
+    newUtmItem.utmParams.utm_content = "New UTM content"
+    expect(isRepeatedEntry(data, newUtmItem)).toBeFalsy();
   });
 });