Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Excluding modals from Active link check #1942

Merged
merged 11 commits into from
Mar 19, 2024
Merged

Excluding modals from Active link check #1942

Changes from 1 commit
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
c4c8034
Fix: Excluding modals from Active link check
Feb 28, 2024
31d3db6
Merge branch 'stage' into MWPW-143213
bandana147 Mar 11, 2024
f4f089d
Fix: removing pathname from check
Mar 11, 2024
3a798d2
Merge branch 'MWPW-143213' of github.com:bandana147/milo into MWPW-14…
Mar 11, 2024
b213f7b
Merge branch 'stage' into MWPW-143213
bandana147 Mar 12, 2024
18137cc
Fix: Change in check for url
Mar 13, 2024
d2a4a7f
Merge branch 'MWPW-143213' of github.com:bandana147/milo into MWPW-14…
Mar 13, 2024
5573b92
Merge branch 'stage' into MWPW-143213
bandana147 Mar 13, 2024
a4b6cec
Merge branch 'stage' into MWPW-143213
bandana147 Mar 14, 2024
b22874b
Merge branch 'stage' into MWPW-143213
bandana147 Mar 15, 2024
437e22a
Merge branch 'stage' into MWPW-143213
bandana147 Mar 19, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion libs/blocks/global-navigation/utilities/utilities.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -247,7 +247,11 @@ export const [hasActiveLink, setActiveLink, getActiveLink] = (() => {

[`${origin}${pathname}`, pathname].forEach((path) => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With this new approach, I'd test a bit more to justify the necessity of the pathname check. Say we have the following element: <a href="/path/to/page">Page</a>. We needed the pathname check for the query selector, which would have been a[href = '/path/to/page']. So we were checking an attribute value, which could have been either a full URL or just a path. Moving to the el.href approach, pathname might be irrelevant, as its result would always be a full URL.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I agree. I will make the necessary change and update the PR.

if (activeLink) return;
activeLink = area.querySelector(`a[href = '${path}'], a[href ^= '${path}?'], a[href ^= '${path}#']`);
const linkElements = area.querySelectorAll('a:not([data-modal-hash])');
activeLink = [...linkElements].find((el) => {
const regex = new RegExp(`^${path}(\\?[^#]*)?(#.*)?$`);
return regex.test(el.href);
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This could be simplified if linkElements and regex are not cached:

activeLink = [...area.querySelectorAll('a:not([data-modal-hash])')].find((el) => {
    return new RegExp(`^${path}(\\?[^#]*)?(#.*)?$`).test(el.href);
});

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And even a little further, since it doesn't need the return for the inner arrow function

activeLink = [...area.querySelectorAll('a:not([data-modal-hash])')].find((el) => new RegExp(`^${path}(\\?[^#]*)?(#.*)?$`).test(el.href));

});

if (!activeLink) return null;
Expand Down
Loading