feat(pat navigationmarker): Also mark the anchor with current and in-path classes. Previously only the wrapper was marked.

Author: thet

src/pat/navigationmarker/navigationmarker.js

@@ -36,6 +36,7 @@ export default Base.extend({
                 : nav_item.parentNode;
 
             if (nav_url === current_url_prepared) {
+                nav_item.classList.add(this.options.currentClass);
                 wrapper.classList.add(this.options.currentClass);
             } else if (
                 // Compare the current navigation item url with a slash at the
@@ -45,6 +46,7 @@ export default Base.extend({
                 // be in the path.
                 nav_url !== portal_url
             ) {
+                nav_item.classList.add(this.options.inPathClass);
                 wrapper.classList.add(this.options.inPathClass);
             } else {
                 // Not even in path.

src/pat/navigationmarker/navigationmarker.test.js

@@ -76,63 +76,63 @@ describe("pat-navigationmarker", () => {
         const it3 = document.querySelector("a[href='../../path3']");
         const it4 = document.querySelector("a[href='https://patternslib.com/path4']");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
+        expect(document.querySelectorAll(".current").length).toBe(2);
         expect(document.querySelectorAll(".inPath").length).toBe(0);
         expect(document.querySelector(".current a")).toBe(it0);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path1");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
+        expect(document.querySelectorAll(".current").length).toBe(2);
         expect(document.querySelectorAll(".inPath").length).toBe(0);
         expect(document.querySelector(".current a")).toBe(it1);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path2");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
+        expect(document.querySelectorAll(".current").length).toBe(2);
         expect(document.querySelectorAll(".inPath").length).toBe(0);
         expect(document.querySelector(".current a")).toBe(it2);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path2/path2.1");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
-        expect(document.querySelectorAll(".inPath").length).toBe(1);
+        expect(document.querySelectorAll(".current").length).toBe(2);
+        expect(document.querySelectorAll(".inPath").length).toBe(2);
         expect(document.querySelector(".current a")).toBe(it21);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path2/path2.2");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
-        expect(document.querySelectorAll(".inPath").length).toBe(1);
+        expect(document.querySelectorAll(".current").length).toBe(2);
+        expect(document.querySelectorAll(".inPath").length).toBe(2);
         expect(document.querySelector(".current a")).toBe(it22);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path2/path2.2/path2.2.1");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
-        expect(document.querySelectorAll(".inPath").length).toBe(2);
+        expect(document.querySelectorAll(".current").length).toBe(2);
+        expect(document.querySelectorAll(".inPath").length).toBe(4);
         expect(document.querySelector(".current a")).toBe(it221);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path2/path2.2/path2.2.2");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
-        expect(document.querySelectorAll(".inPath").length).toBe(2);
+        expect(document.querySelectorAll(".current").length).toBe(2);
+        expect(document.querySelectorAll(".inPath").length).toBe(4);
         expect(document.querySelector(".current a")).toBe(it222);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path3");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
+        expect(document.querySelectorAll(".current").length).toBe(2);
         expect(document.querySelectorAll(".inPath").length).toBe(0);
         expect(document.querySelector(".current a")).toBe(it3);
 
         instance.clear_items();
         instance.mark_items("https://patternslib.com/path4");
 
-        expect(document.querySelectorAll(".current").length).toBe(1);
+        expect(document.querySelectorAll(".current").length).toBe(2);
         expect(document.querySelectorAll(".inPath").length).toBe(0);
         expect(document.querySelector(".current a")).toBe(it4);
     });