@lonelyplanet/dotcom-core/src/__tests__/helpers/imgix.spec.ts

This package is meant to house some of our more common UI and shared libs across dotcom applications.

import imgix from "../../helpers/imgix";

describe("imgix", () => {
  describe("booking.com", () => {
    it("should replace aff.bstatic.com", () => {
      const result = imgix(
        "https://aff.bstatic.com/images/hotel/max500/177/1778356.jpg",
        {},
        "bdc",
      );
      expect(result).toEqual(
        "https://lpbookingcom.imgix.net/images/hotel/max500/177/1778356.jpg",
      );
    });

    it("should replace q-xx.bstatic.com", () => {
      const result = imgix(
        "https://q-xx.bstatic.com/images/hotel/max500/177/1778356.jpg",
        {},
        "bdc",
      );
      expect(result).toEqual(
        "https://lpbookingcom.imgix.net/images/hotel/max500/177/1778356.jpg",
      );
    });
  });

  describe("gadventures", () => {
    it("should replace media.gadventures.com", () => {
      const result = imgix(
        "https://media.gadventures.com/media-server/cache/e2/7a/e27ad55d69b8cea10baac7f50e526a16.jpg",
        {},
        "gadventures",
      );
      expect(result).toEqual(
        "https://lpgadventures.imgix.net/media-server/cache/e2/7a/e27ad55d69b8cea10baac7f50e526a16.jpg",
      );
    });
  });

  describe("hostelworld", () => {
    it("should replace ucd.hwstatic.com", () => {
      const result = imgix(
        "https://ucd.hwstatic.com/propertyimages/7/76525/1.jpg",
        {},
        "hostelworld",
      );
      expect(result).toEqual(
        "https://lphostelworld.imgix.net/propertyimages/7/76525/1.jpg",
      );
    });
  });

  describe("media", () => {
    it("should replace media.lonelyplanet.com", () => {
      const result = imgix(
        "https://media.lonelyplanet.com/foo.jpg",
        {},
        "media",
      );
      expect(result).toEqual("https://lonelyplanetimages.imgix.net/foo.jpg");
    });
  });

  describe("news", () => {
    it("should replace lonelyplanet.com/news/wp-content/uploads", () => {
      const result = imgix(
        "https://www.lonelyplanet.com/news/wp-content/uploads/foo.jpg",
        {},
        "news",
      );
      expect(result).toEqual("https://lonelyplanetwpnews.imgix.net/foo.jpg");
    });
  });

  describe("staticAsset", () => {
    it("should replace s3.amazonaws.com/static-asset", () => {
      const result = imgix(
        "https://s3.amazonaws.com/static-asset/op-video-sync/images/production/foo.jpg",
        {},
        "staticAsset",
      );
      expect(result).toEqual(
        "https://lonelyplanetstatic.imgix.net/op-video-sync/images/production/foo.jpg"
      );
    });
  });

  describe("staticSites", () => {
    it("should replace s3.amazonaws.com/lp-static-sites", () => {
      const result = imgix(
        "https://s3.amazonaws.com/lp-static-sites/trinity-college-dublin/assets/images/foo.jpg",
        {},
        "staticSites",
      );
      expect(result).toEqual(
        "http://lonelyplanetstaticsites.imgix.net/trinity-college-dublin/assets/images/foo.jpg"
      );
    });
  });

  describe("viator", () => {
    it("should replace cache-graphicslib.viator.com", () => {
      const result = imgix(
        "https://cache-graphicslib.viator.com/graphicslib/thumbs674x446/26200/SITours/nashville-food-and-sightseeing-tour-in-nashville-309998.jpg",
        {},
        "viator",
      );
      expect(result).toEqual(
        "https://lpviator.imgix.net/graphicslib/thumbs674x446/26200/SITours/nashville-food-and-sightseeing-tour-in-nashville-309998.jpg",
      );
    });
  });

  describe("wordpress", () => {
    it("should replace lonelyplanet.com/travel-blog/tip-article/wordpress_uploads", () => {
      const result = imgix(
        "https://www.lonelyplanet.com/travel-blog/tip-article/wordpress_uploads/foo.jpg",
        {},
        "wordpress",
      );
      expect(result).toEqual("https://lonelyplanetwp.imgix.net/foo.jpg");
    });
  });

  describe("with parameters", () => {
    it("should add params to the url", () => {
      const result = imgix(
        "http://media.lonelyplanet.com/foo.jpg",
        {
          w: 1024,
          h: 768,
        },
        "media",
      );
      expect(result).toEqual(
        "https://lonelyplanetimages.imgix.net/foo.jpg?w=1024&h=768",
      );
    });
  });

  describe("non-matching url", () => {
    it("should return the original url", () => {
      const result = imgix("http://www.anotherurl.com/foo.jpg");
      expect(result).toEqual("http://www.anotherurl.com/foo.jpg");
    });
  });

  describe("without source", () => {
    it("should handle an undefined source", () => {
      const result = imgix("https://media.lonelyplanet.com/foo.jpg", {});
      expect(result).toEqual("https://lonelyplanetimages.imgix.net/foo.jpg");
    });

    it("should handle a null string source", () => {
      const result = imgix("https://media.lonelyplanet.com/foo.jpg", {}, null);
      expect(result).toEqual("https://lonelyplanetimages.imgix.net/foo.jpg");
    });

    it("should handle a mismatched source key", () => {
      const result = imgix(
        "https://media.lonelyplanet.com/foo.jpg",
        {},
        "notakey",
      );
      expect(result).toEqual("https://media.lonelyplanet.com/foo.jpg");
    });
  });
});