-
Notifications
You must be signed in to change notification settings - Fork 174
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.
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
Conversation
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## stage #1942 +/- ##
==========================================
- Coverage 96.32% 96.29% -0.03%
==========================================
Files 166 166
Lines 42323 42321 -2
==========================================
- Hits 40767 40754 -13
- Misses 1556 1567 +11 ☔ View full report in Codecov by Sentry. |
const linkElements = area.querySelectorAll('a:not([data-modal-hash])'); | ||
activeLink = [...linkElements].find((el) => { | ||
const regex = new RegExp(`^${path}(\\?[^#]*)?(#.*)?$`); | ||
return regex.test(el.href); | ||
}); |
There was a problem hiding this comment.
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);
});
There was a problem hiding this comment.
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));
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Would be nice if you consider Roberts feedback, but LGTM! Thanks for raising the PR 🚀
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Agree with what @robert-bogos and @mokimo suggested and I have another thought worth looking into.
@@ -247,7 +247,11 @@ export const [hasActiveLink, setActiveLink, getActiveLink] = (() => { | |||
|
|||
[`${origin}${pathname}`, pathname].forEach((path) => { |
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
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.
}); | ||
const activeLink = [ | ||
...area.querySelectorAll('a:not([data-modal-hash])'), | ||
].find((el) => new RegExp(`^${`${origin}${pathname}`}(\\?[^#]*)?(#.*)?$`).test(el.href)); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I just realized that there may be some potential for improvement for the regular expression here. Let's just use this page's URL as an example.
var { origin, pathname } = window.location;
var regex = new RegExp(`^${`${origin}${pathname}`}(\\?[^#]*)?(#.*)?$`);
// regex will be: /^https:\/\/github.com\/adobecom\/milo\/pull\/1942\/files(\?[^#]*)?(#.*)?$/
The issue is that .
, which in regular expression terms translates to any character. So regex.test('https://githubXcom/adobecom/milo/pull/1942/files');
would actually be true
.
One way to solve this would be to call an additional .replaceAll('.', '\\.')
on the string. Another would be to replace the regular expression with
const url = `${origin}${pathname}`;
const matches = endsWith(url) || startsWith(`${url}?`) || startsWith(`${url}#`); // to be adapted, just a quick example
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@overmyheadandbody Thanks for the catch with .
Will update the code as discussed.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for integrating the changes, looks good!
I have added the label "high priority" as this is a critical bug : https://jira.corp.adobe.com/browse/MWPW-143213 |
* MWPW-143648 - [Action Item] Fix float icon position (#1957) * display main image block and add inline flex to floated icon * revert inline flex rull on floated icon --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-142798 + MWPW-142872: Made the height-fit-content class to be set automatically (#1946) fixed height auto adjustment and iframe styles in modal Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-144575: Fix for commerce modal height (#2014) There's a potential CSO lurking * [MWPW-144516] Handle cross cloud menu block error (#2006) * fix(MWPW-142248): Accessibility for carousels containing focusable elements. (#1901) * MWPW-142248 * fixed linting errors * revert package.json * revert package_lock.json * Accessibility for the show-x variants of carousel * test cases for code coverage --------- Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-144575: Modal-Iframe for apps-whats-included is broken for Desktop resolutions (#2016) fixed CSS selector commerce-frame section and fragment * Sync stage with main (#2025) * [Release] Stage to Main (#2005) MWPW-143673: Load Milo fragment modals from co links #1972 MWPW-142894: fragments can lead to invalid html #1937 High Priority Caas-Marquee: Fixes integration with martech.js issues #2003 MWPW-143591 Fix Contextual Search Duplicates #1990 Zero Impact MWPW-143708 and MWPW-143712 add kodiak auto-ticketing #2002 --------- Co-authored-by: J. Casalino <casalino@adobe.com> Co-authored-by: Megan Thomas <methomas@adobe.com> Co-authored-by: ilyas Stéphane Türkben <tuerkben@adobe.com> Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: cmiqueo <64917520+cmiqueo@users.noreply.github.com> * [Release] Stage to Main (#2010) * Update martech.main.standard.min.js (#2008) --------- Co-authored-by: Chris Peyer <chrischrischris@users.noreply.github.com> * fix merge empty line --------- Co-authored-by: ilyas Stéphane Türkben <tuerkben@adobe.com> Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> Co-authored-by: J. Casalino <casalino@adobe.com> Co-authored-by: Megan Thomas <methomas@adobe.com> Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: cmiqueo <64917520+cmiqueo@users.noreply.github.com> * remove extra line * MWPW-144575: fix for the modal duplication (#2021) added checking to not create a modal when it is already present in DOM Co-authored-by: Axel Cureno Basurto <axelcureno@gmail.com> * [MWPW-137148] [PERFORMANCE] Load IMS from the same domain (#1996) * Host imslib from milo libs/deps * Fix formatting * Minor script cleanup * wp * Serve ims, launch & launch development locally. Rewrite the workflow * Remove launch dependency for now --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-142003: Mini Compare Chart Mobile styling (#1989) Co-authored-by: ilyas Stéphane Türkben <isturkben@gmail.com> Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-143202 firefox gnav not appearing bug (#1969) * try to catch error * test without breaking things * catch akamai failure * add try catch * attempt 2 to catch jsonp failure * cleanup * fix geo2 source * test using proper fetch * MWPW-143202 remove old jsonp request * MWPW-143202 catch case if resp is not ok * MWPW-143202 prevent caching of geo2 request --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * Excluding modals from Active link check (#1942) * Fix: Excluding modals from Active link check --------- Co-authored-by: Bandana Laishram <blaishram@Bandanas-MacBook-Pro.local> * [MWPW-144602] Ensure DNT functionality in top nav (#2020) * Revert "MWPW-142003: Mini Compare Chart Mobile styling" (#2041) Revert "MWPW-142003: Mini Compare Chart Mobile styling (#1989)" This reverts commit 944ae19. --------- Co-authored-by: Sean Archibeque <sean.archibeque@gmail.com> Co-authored-by: Mira Fedas <30750556+mirafedas@users.noreply.github.com> Co-authored-by: Axel Cureno Basurto <axelcureno@gmail.com> Co-authored-by: Rares Munteanu <overmyheadandbody@gmail.com> Co-authored-by: sharath-kannan <138484653+sharath-kannan@users.noreply.github.com> Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: Victor Hargrave <115231412+vhargrave@users.noreply.github.com> Co-authored-by: ilyas Stéphane Türkben <tuerkben@adobe.com> Co-authored-by: J. Casalino <casalino@adobe.com> Co-authored-by: Megan Thomas <methomas@adobe.com> Co-authored-by: cmiqueo <64917520+cmiqueo@users.noreply.github.com> Co-authored-by: Okan Sahin <39759830+mokimo@users.noreply.github.com> Co-authored-by: ilyas Stéphane Türkben <isturkben@gmail.com> Co-authored-by: Bandana Laishram <bandanalaishram@gmail.com> Co-authored-by: Bandana Laishram <blaishram@Bandanas-MacBook-Pro.local>
* MWPW-143648 - [Action Item] Fix float icon position (#1957) * display main image block and add inline flex to floated icon * revert inline flex rull on floated icon --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-142798 + MWPW-142872: Made the height-fit-content class to be set automatically (#1946) fixed height auto adjustment and iframe styles in modal Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-144575: Fix for commerce modal height (#2014) There's a potential CSO lurking * [MWPW-144516] Handle cross cloud menu block error (#2006) * fix(MWPW-142248): Accessibility for carousels containing focusable elements. (#1901) * MWPW-142248 * fixed linting errors * revert package.json * revert package_lock.json * Accessibility for the show-x variants of carousel * test cases for code coverage --------- Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-144575: Modal-Iframe for apps-whats-included is broken for Desktop resolutions (#2016) fixed CSS selector commerce-frame section and fragment * Sync stage with main (#2025) * [Release] Stage to Main (#2005) MWPW-143673: Load Milo fragment modals from co links #1972 MWPW-142894: fragments can lead to invalid html #1937 High Priority Caas-Marquee: Fixes integration with martech.js issues #2003 MWPW-143591 Fix Contextual Search Duplicates #1990 Zero Impact MWPW-143708 and MWPW-143712 add kodiak auto-ticketing #2002 --------- Co-authored-by: J. Casalino <casalino@adobe.com> Co-authored-by: Megan Thomas <methomas@adobe.com> Co-authored-by: ilyas Stéphane Türkben <tuerkben@adobe.com> Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: cmiqueo <64917520+cmiqueo@users.noreply.github.com> * [Release] Stage to Main (#2010) * Update martech.main.standard.min.js (#2008) --------- Co-authored-by: Chris Peyer <chrischrischris@users.noreply.github.com> * fix merge empty line --------- Co-authored-by: ilyas Stéphane Türkben <tuerkben@adobe.com> Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> Co-authored-by: J. Casalino <casalino@adobe.com> Co-authored-by: Megan Thomas <methomas@adobe.com> Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: cmiqueo <64917520+cmiqueo@users.noreply.github.com> * remove extra line * MWPW-144575: fix for the modal duplication (#2021) added checking to not create a modal when it is already present in DOM Co-authored-by: Axel Cureno Basurto <axelcureno@gmail.com> * [MWPW-137148] [PERFORMANCE] Load IMS from the same domain (#1996) * Host imslib from milo libs/deps * Fix formatting * Minor script cleanup * wp * Serve ims, launch & launch development locally. Rewrite the workflow * Remove launch dependency for now --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-142003: Mini Compare Chart Mobile styling (#1989) Co-authored-by: ilyas Stéphane Türkben <isturkben@gmail.com> Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * MWPW-143202 firefox gnav not appearing bug (#1969) * try to catch error * test without breaking things * catch akamai failure * add try catch * attempt 2 to catch jsonp failure * cleanup * fix geo2 source * test using proper fetch * MWPW-143202 remove old jsonp request * MWPW-143202 catch case if resp is not ok * MWPW-143202 prevent caching of geo2 request --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * Excluding modals from Active link check (#1942) * Fix: Excluding modals from Active link check --------- Co-authored-by: Bandana Laishram <blaishram@Bandanas-MacBook-Pro.local> * [MWPW-144602] Ensure DNT functionality in top nav (#2020) * Revert "MWPW-142003: Mini Compare Chart Mobile styling" (#2041) Revert "MWPW-142003: Mini Compare Chart Mobile styling (#1989)" This reverts commit 944ae19. * MWPW-144026 Update Twitter Icon to X (#2030) * Add support for bold as header if no header (#1997) * Add support for bold as header if no header * Add tracking to modal close button * separate branches * moving if on strong or B --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * [MWPW-144112] send-to-caas: point to prod end-point (#1995) [MWPW-144112] point to prod end-point * [MILO] Allow svg or media files to be located in a fragments folder (#1966) * fix if svg is located in fragments folder * update to handle any file that is not a fragment * unit test * better placement * update existing file reference no idea how this was working with the incorrect reference * add carve out for mp4 Noticed that there is code in this if statement for mp4 in the fragments folder that can't be reached * save match result so I do not have to match twice * update nameSplit to hasExtension per Slack request * update hasExtension to use include instead of length --------- Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * Consolidate MEP PR's for stage (#1975) * stash * start retro support (need to adjust replacefragment) * save progress * progress * stash * solid state * reverse mep preview check * update file for insertScript * organized unit test files * unit tests working * remove file added by override * add coverage to unit test * PR comments * use "section" to mean "section1" * no longer need to pass mep to handleFragmentCommand * Update libs/features/personalization/personalization.js Co-authored-by: Chris Peyer <chrischrischris@users.noreply.github.com> * Update libs/features/personalization/personalization.js Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * add replace action with fragment selector not on page * moving fragment that's not page unit test * [MILO][MEP] Update Manifest Type and Manifest Ordering v2 (#1980) * new branch to separate my updates from others * export matchGlob * see if removing matchGlob fixes unit test * found unit test issue * stash * unit test repair * increase coverage * stop loading disabled promos * update unit test * only download disabled manifests if needed * [MILO][MEP] MEP parameter spoof breaks if chosen experience has a comma (#1992) * change delimiter to --- * update unit tests * Deconflicting for MWPW-136727 MEP: Support for simplified selectors (#1959) * WIP * Add tests * stash * stash * stash * merge select functions * unit tests fixed * fix for test or promo type * create unit test file * fix unit test error * unit tests * improve merge of duplicate manifests * fix merge of Target with fresh manifest, add unit test * new branch to separate my updates from others * export matchGlob * see if removing matchGlob fixes unit test * found unit test issue * stash * unit test repair * increase coverage * merge conflicts * remove duplicate from merge * remove another duplicate from merge --------- Co-authored-by: ChrisChrisChris <chrischrischris@users.noreply.github.com> * more duplicates * move normalization of manifestPath to before getting variant * Unit test repair * repair utils unit test * only update path if needed * force update sample scripts * trigger try/catch --------- Co-authored-by: vivgoodrich <vivian.goodrich@gmail.com> Co-authored-by: Chris Peyer <chrischrischris@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Blaine Gunn <Blainegunn@gmail.com> * UAR integration - Quiz Sync for state in local storage and accessibility (#2032) * MWPW-139939 - Support for quiz state in local storage (#1956) * MWPW-139939 - Support for quiz state in local storage * Renders the quiz at any point as captured in local storage Resolves: [MWPW-139939](https://jira.corp.adobe.com/browse/MWPW-139939) * fix for no stored-quiz-state * remove stored quiz data when advancing to the next quiz step via handleOnNextClick() * stored quiz state unit tests * MWPW-143799 - Quiz Accessibility Refinement (#2004) * Add id to the h1 * set role and aria-labelledby on the option container * swap to role-checkbox and aria-checked for option buttons * use disabled instead of tabindex -1 Resolves: [MWPW-143799](https://jira.corp.adobe.com/browse/MWPW-143799) --------- Co-authored-by: Sean Archibeque <sean.archibeque@gmail.com> Co-authored-by: Mira Fedas <30750556+mirafedas@users.noreply.github.com> Co-authored-by: Axel Cureno Basurto <axelcureno@gmail.com> Co-authored-by: Rares Munteanu <overmyheadandbody@gmail.com> Co-authored-by: sharath-kannan <138484653+sharath-kannan@users.noreply.github.com> Co-authored-by: Robert Bogos <146744221+robert-bogos@users.noreply.github.com> Co-authored-by: Victor Hargrave <115231412+vhargrave@users.noreply.github.com> Co-authored-by: ilyas Stéphane Türkben <tuerkben@adobe.com> Co-authored-by: J. Casalino <casalino@adobe.com> Co-authored-by: Megan Thomas <methomas@adobe.com> Co-authored-by: cmiqueo <64917520+cmiqueo@users.noreply.github.com> Co-authored-by: Okan Sahin <39759830+mokimo@users.noreply.github.com> Co-authored-by: ilyas Stéphane Türkben <isturkben@gmail.com> Co-authored-by: Bandana Laishram <bandanalaishram@gmail.com> Co-authored-by: Bandana Laishram <blaishram@Bandanas-MacBook-Pro.local> Co-authored-by: Vivian A Goodrich <101133187+vgoodric@users.noreply.github.com> Co-authored-by: jedjedjedM <93785811+jedjedjedM@users.noreply.github.com> Co-authored-by: vivgoodrich <vivian.goodrich@gmail.com> Co-authored-by: Chris Peyer <chrischrischris@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Cody Lloyd <119891065+colloyd@users.noreply.github.com> Co-authored-by: Victor Hargrave <vhargrave@adobe.com>
Description
Excluding the active link check from modal link elements which removes the modal link href attribute
Related Issue
Resolves: MWPW-143213
Test URLs
CC:
Bacom:
Milo: