@cable8mm/jquery-infinite-with-template 1.0.4 → 1.1.2

package/tests/jquery.infiniteScrollWithTemplate.test.js

@@ -0,0 +1,310 @@
+/**
+ * @jest-environment jsdom
+ */
+
+const $ = require("jquery");
+require("../jquery.infiniteScrollWithTemplate.js");
+
+describe("jQuery Infinite With Template Plugin", () => {
+  let $container;
+
+  beforeEach(() => {
+    // Setup DOM
+    document.body.innerHTML = `
+      <div id="test-container"></div>
+      <div id="load-button">Load More</div>
+      <script id="test-template" type="text/x-jsrender">
+        <div class="item">{{:id}}: {{:title}}</div>
+      </script>
+    `;
+
+    $container = $("#test-container");
+    $container.empty();
+  });
+
+  afterEach(() => {
+    // Cleanup
+    $(window).off(".infiniteTemplate");
+    $(document).off(".infiniteTemplate");
+  });
+
+  describe("Initialization", () => {
+    test("should return jQuery object for chaining", () => {
+      $.ajax = jest.fn((options) => {
+        options.success({ data: [] });
+      });
+
+      const result = $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+      });
+
+      expect(result).toBeInstanceOf($);
+      expect(result).toEqual($container);
+    });
+
+    test("should require templateSelector", () => {
+      const consoleError = jest.spyOn(console, "error").mockImplementation();
+
+      $.ajax = jest.fn();
+
+      $container.infiniteTemplate({
+        dataPath: "/api/test",
+      });
+
+      expect(consoleError).toHaveBeenCalledWith(
+        "infiniteTemplate: templateSelector is required",
+      );
+      expect($.ajax).not.toHaveBeenCalled();
+
+      consoleError.mockRestore();
+    });
+
+    test("should require dataPath", () => {
+      const consoleError = jest.spyOn(console, "error").mockImplementation();
+
+      $.ajax = jest.fn();
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+      });
+
+      expect(consoleError).toHaveBeenCalledWith(
+        "infiniteTemplate: dataPath is required",
+      );
+      expect($.ajax).not.toHaveBeenCalled();
+
+      consoleError.mockRestore();
+    });
+  });
+
+  describe("Data Loading", () => {
+    test("should load data via AJAX", () => {
+      $.ajax = jest.fn((options) => {
+        options.success({
+          data: [
+            { id: 1, title: "Item 1" },
+            { id: 2, title: "Item 2" },
+          ],
+        });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        loadAtStart: true,
+      });
+
+      expect($.ajax).toHaveBeenCalled();
+      expect($.ajax).toHaveBeenCalledWith(
+        expect.objectContaining({
+          url: expect.stringContaining("/api/test"),
+          method: "GET",
+        }),
+      );
+    });
+
+    test("should pass data to template", () => {
+      $.ajax = jest.fn((options) => {
+        options.success({
+          data: [{ id: 1, title: "Item 1" }],
+        });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        loadAtStart: true,
+      });
+
+      // Verify AJAX was called with correct URL
+      expect($.ajax).toHaveBeenCalled();
+      const call = $.ajax.mock.calls[0];
+      expect(call[0].url).toContain("page=1");
+    });
+  });
+
+  describe("Callbacks", () => {
+    test("should call zeroCallback when no data", () => {
+      const zeroCallback = jest.fn();
+
+      $.ajax = jest.fn((options) => {
+        options.success({ data: [] });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        zeroCallback: zeroCallback,
+      });
+
+      expect(zeroCallback).toHaveBeenCalled();
+    });
+
+    test("should call errorCallback on AJAX error", () => {
+      const errorCallback = jest.fn();
+
+      $.ajax = jest.fn((options) => {
+        options.error(new Error("Test error"));
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        errorCallback: errorCallback,
+      });
+
+      expect(errorCallback).toHaveBeenCalled();
+    });
+
+    test("should call errorCallback on JSON parse error", () => {
+      const errorCallback = jest.fn();
+
+      $.ajax = jest.fn((options) => {
+        options.success("invalid json{");
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        errorCallback: errorCallback,
+      });
+
+      expect(errorCallback).toHaveBeenCalled();
+    });
+
+    test("should call loadingCallback", () => {
+      const loadingCallback = jest.fn();
+
+      $.ajax = jest.fn((options) => {
+        options.success({ data: [] });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        loadingCallback: loadingCallback,
+      });
+
+      expect(loadingCallback).toHaveBeenCalled();
+    });
+
+    test("should call loadedCallback", () => {
+      const loadedCallback = jest.fn();
+
+      $.ajax = jest.fn((options) => {
+        options.success({ data: [] });
+        if (options.complete) {
+          options.complete();
+        }
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        loadedCallback: loadedCallback,
+      });
+
+      expect(loadedCallback).toHaveBeenCalled();
+    });
+  });
+
+  describe("Click Loading", () => {
+    test("should load data on button click", () => {
+      $.ajax = jest.fn((options) => {
+        options.success({ data: [{ id: 1, title: "Item 1" }] });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        loadAtStart: false,
+        loadSelector: "#load-button",
+      });
+
+      expect($.ajax).not.toHaveBeenCalled();
+
+      $("#load-button").click();
+
+      expect($.ajax).toHaveBeenCalled();
+    });
+  });
+
+  describe("URL Building", () => {
+    test("should include page parameter", () => {
+      $.ajax = jest.fn((options) => {
+        expect(options.url).toContain("page=1");
+        options.success({ data: [] });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+      });
+    });
+
+    test("should include query parameters", () => {
+      $.ajax = jest.fn((options) => {
+        expect(options.url).toContain("word=test");
+        options.success({ data: [] });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        query: "word=test",
+      });
+    });
+
+    test("should add cache buster when preventCache is true", () => {
+      $.ajax = jest.fn((options) => {
+        expect(options.url).toMatch(/[?&]t=\d+/);
+        options.success({ data: [] });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        preventCache: true,
+      });
+    });
+  });
+
+  describe("Edge Cases", () => {
+    test("should handle empty data array", () => {
+      const zeroCallback = jest.fn();
+
+      $.ajax = jest.fn((options) => {
+        options.success({ data: [] });
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+        zeroCallback: zeroCallback,
+      });
+
+      expect($container.find(".item").length).toBe(0);
+      expect(zeroCallback).toHaveBeenCalled();
+    });
+
+    test("should handle JSON string response", () => {
+      $.ajax = jest.fn((options) => {
+        options.success(JSON.stringify({ data: [{ id: 1, title: "Item 1" }] }));
+      });
+
+      $container.infiniteTemplate({
+        templateSelector: "#test-template",
+        dataPath: "/api/test",
+      });
+
+      // Verify AJAX was called successfully
+      expect($.ajax).toHaveBeenCalled();
+      expect($.ajax).toHaveBeenCalledWith(
+        expect.objectContaining({
+          url: expect.any(String),
+        }),
+      );
+    });
+  });
+});

package/tests/setup.js

@@ -0,0 +1,16 @@
+// Mock jQuery and jsRender for testing
+global.jQuery = require("jquery");
+global.$ = global.jQuery;
+
+// Use actual jsrender
+const jsrender = require("jsrender");
+global.jsrender = jsrender;
+global.$.templates = jsrender.templates;
+
+// Mock window.location
+Object.defineProperty(window, "location", {
+  value: {
+    origin: "http://localhost:8080",
+  },
+  writable: true,
+});

package/examples/data_sources.ajax

@@ -1,84 +0,0 @@
-{
-    "data": [
-        {
-            "id": 886,
-            "title": "ZjLn9jCi1w8nsFSye6A2q9cuu78U88(word=None)"
-        },
-        {
-            "id": 91,
-            "title": "VVTFOrWminUAi8E3whuFiyi76sf6L3(word=None)"
-        },
-        {
-            "id": 654,
-            "title": "Roc3yFmOHpm4Koj8hhuRr5fBNAUcxZ(word=None)"
-        },
-        {
-            "id": 788,
-            "title": "zR7rzbUz81pPYFxvm3NBDFGCUqB0cy(word=None)"
-        },
-        {
-            "id": 7,
-            "title": "1OHxyIMH9DahoskhqVbCFINH3aVysn(word=None)"
-        },
-        {
-            "id": 915,
-            "title": "9kX2B97YL0onvcE4nRETuACESX9YIM(word=None)"
-        },
-        {
-            "id": 125,
-            "title": "jc5fTJ5Y1QzYOtQy6XhiMlRxq05KAc(word=None)"
-        },
-        {
-            "id": 362,
-            "title": "rsoNXzq590AQzf6Hp0Gi8rHQfaz9KI(word=None)"
-        },
-        {
-            "id": 101,
-            "title": "1msDlWisPm0Q9oUofPdhgjOHuZtlep(word=None)"
-        },
-        {
-            "id": 206,
-            "title": "nev0CvpOKc1E0zUuvTrgMUluSowoz5(word=None)"
-        },
-        {
-            "id": 544,
-            "title": "aIMdZ9LAf5SDl9hmeFIqzCMgU2joOx(word=None)"
-        },
-        {
-            "id": 415,
-            "title": "ikYBbV7nA4S2LPCWk2TYXQ4H5Vp7ia(word=None)"
-        },
-        {
-            "id": 717,
-            "title": "H6u32LKXqbgU8rx7UTjsALjKfUPZru(word=None)"
-        },
-        {
-            "id": 536,
-            "title": "JuyIiHNlLn0H97APMtB5ng72GAVzBr(word=None)"
-        },
-        {
-            "id": 554,
-            "title": "e8cbqBh9ifoEI2nFqyryDBwE87Boy2(word=None)"
-        },
-        {
-            "id": 111,
-            "title": "yCJNeoMlqkuNazccgeKwMoj2d9xC6v(word=None)"
-        },
-        {
-            "id": 134,
-            "title": "2qZpgg3lJ3djS5RG5IZzZjdtf7Y9IJ(word=None)"
-        },
-        {
-            "id": 523,
-            "title": "LC84RteVTWGuAgDDhknpb7jREpqdfY(word=None)"
-        },
-        {
-            "id": 946,
-            "title": "q0NnpnSWosOwbxIYQE3ZiMbuqJKG40(word=None)"
-        },
-        {
-            "id": 30,
-            "title": "sHc5R2u1W0T45AMxQRx73gAFbGHXk0(word=None)"
-        }
-    ]
-}