also check resolved url for is-active checks

patrickarlt · Feb 24, 2019 · cb5dedc · cb5dedc
1 parent db8b3da
commit cb5dedc
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/lib/helpers/link-helper.js b/lib/helpers/link-helper.js
@@ -50,8 +50,12 @@ module.exports = function(acetate) {
       } else if (options.requireExactMatch) {
         isActive = currentUrl === resolvedUrl;
       } else {
-        let parsedUrl = url.parse(finalUrl);
-        isActive = currentUrl.match(parsedUrl.pathname) && finalUrl !== "/";
+        let parsedFinalUrl = url.parse(finalUrl);
+        let parsedResolvedUrl = url.parse(resolvedUrl);
+        isActive =
+          (currentUrl.match(parsedResolvedUrl.pathname) ||
+            currentUrl.match(parsedFinalUrl.pathname)) &&
+          finalUrl !== "/";
       }
 
       const classes = isActive

diff --git a/test/Acetate.test.js b/test/Acetate.test.js
@@ -313,6 +313,7 @@ test("should create anchors code with a built in helper", t => {
     {% link '/nested/', 'Page', currentUrl='/' %}
     {% link '/nested/', 'Page', currentUrl='/nested/' %}
     {% link relativePath + '/nested/page/', 'Link With relativePath' %}
+    {% link '../../../latest/guide/', 'Guide', currentUrl='/latest/guide/create-a-starter-app/' %}
     `;
 
   const page = createPage("nested/page/index.html", template);
@@ -337,6 +338,7 @@ test("should create anchors code with a built in helper", t => {
     <a href="/nested/">Page</a>
     <a href="/nested/" class="is-active">Page</a>
     <a href="../../nested/page/" class="is-active">Link With relativePath</a>
+    <a href="../../../latest/guide/" class="is-active">Guide</a>
   `;
 
   return acetate.renderPage(page).then(output => {