Merge pull request #806 from Patternslib/thet-cal-injectonlyifurl

pat-calendar: pat-inject is only set event has a url.

Author: thet

CHANGES.md

@@ -35,8 +35,7 @@
 -   pat calendar: Store the current date and view in query parameters.
 -   pat calendar: Fetch events from the backend.
 -   pat calendar: Allow filtering/hiding events based in comparing the checkbox id with the classes of the displayed events.
--   pat calendar: Support injection of events when clicking on and event rather than redirecting to them.
-    Done by adding `pat-inject` to rendered events via some configuration options.
+-   pat calendar: Support `pat-inject` on events with a URL via `pat-inject-source` and `pat-inject-target` configuration options.
 -   pat calendar: Support `pat-switch` for rendered events via some configuration options.
 -   pat calendar: Store view, date and active categories per URL, allowing to individually customize the calendar per page.
 -   pat tooltip: Use tippy v6 based implementation.

src/pat/calendar/calendar.js

@@ -329,7 +329,8 @@ export default Base.extend({
         // pat-inject support
         const source = this.options.pat["inject-source"];
         const target = this.options.pat["inject-target"];
-        if (source || target) {
+        if (args.event.url && (source || target)) {
+            // Only set pat-inject if event has a url
             args.el.classList.add("pat-inject");
             args.el.setAttribute(
                 "data-pat-inject",

src/pat/calendar/calendar.test.js

@@ -257,6 +257,7 @@ describe("Calendar tests", () => {
     });
 
     it("Loads events and initializes them with pat-inject and pat-switch", async (done) => {
+        // pat-inject is only set if event has a url.
         const el = document.querySelector(".pat-calendar");
         el.setAttribute(
             "data-pat-calendar",
@@ -282,19 +283,19 @@ describe("Calendar tests", () => {
 
         console.log(event3.outerHTML);
 
-        expect(event1.classList.contains("pat-inject")).toBe(true);
+        expect(event1.classList.contains("pat-inject")).toBe(false);
         expect(event1.classList.contains("pat-switch")).toBe(true);
-        expect(event1.getAttribute("data-pat-inject")).toBe("target: #event-info; source: #document-body"); // prettier-ignore
+        expect(event1.hasAttribute("data-pat-inject")).toBe(false);
         expect(event1.getAttribute("data-pat-switch")).toBe("selector: #event-info; add: event-info--active; remove: event-info--inactive"); // prettier-ignore
 
         expect(event2.classList.contains("pat-inject")).toBe(true);
         expect(event2.classList.contains("pat-switch")).toBe(true);
         expect(event2.getAttribute("data-pat-inject")).toBe("target: #event-info; source: #document-body"); // prettier-ignore
         expect(event2.getAttribute("data-pat-switch")).toBe("selector: #event-info; add: event-info--active; remove: event-info--inactive"); // prettier-ignore
 
-        expect(event3.classList.contains("pat-inject")).toBe(true);
+        expect(event3.classList.contains("pat-inject")).toBe(false);
         expect(event3.classList.contains("pat-switch")).toBe(true);
-        expect(event3.getAttribute("data-pat-inject")).toBe("target: #event-info; source: #document-body"); // prettier-ignore
+        expect(event3.hasAttribute("data-pat-inject")).toBe(false);
         expect(event3.getAttribute("data-pat-switch")).toBe("selector: #event-info; add: event-info--active; remove: event-info--inactive"); // prettier-ignore
 
         global.fetch.mockClear();