diff --git a/src/Carousel/Carousel.js b/src/Carousel/Carousel.js index e662111..52296ca 100644 --- a/src/Carousel/Carousel.js +++ b/src/Carousel/Carousel.js @@ -606,9 +606,9 @@ export class Carousel extends Base { } if (slide.$el) { - let curentIndex = parseInt(slide.$el.dataset.index, 10) || 0; + let curentIndex = slide.$el.dataset.index; - if (curentIndex !== slide.index) { + if (!curentIndex || parseInt(curentIndex, 10) !== slide.index) { slide.$el.dataset.index = slide.index; // Lazy load images diff --git a/tests/3_carousel_test.js b/tests/3_carousel_test.js index 63345d8..a655ccb 100644 --- a/tests/3_carousel_test.js +++ b/tests/3_carousel_test.js @@ -644,4 +644,38 @@ describe("Carousel", function () { destroyInstance(instance); }); + + it("supports lazy loading", async function () { + const instance = createInstance({ + markup: ``, + }); + + let nodes = [...instance.$track.querySelectorAll("[data-lazy-src]")]; + + expect(nodes.length).to.equal(5); + + expect(nodes[0].src).to.equal("https://lipsum.app/id/1/300x200"); + expect(nodes[1].src).to.equal("https://lipsum.app/id/2/300x200"); + expect(nodes[2].src).to.equal(""); + expect(nodes[3].src).to.equal(""); + expect(nodes[4].src).to.equal("https://lipsum.app/id/5/300x200"); + + destroyInstance(instance); + }); });