Fix #5038: Enhance test case querySelector/querySelectorAll reliability with ensuring element existance #5039

balajis-qb · 2024-08-19T10:14:51Z

Issue
Currently in our project test cases, in many places we followed a format like container.querySelector('...') ?? new HTMLElement() or container.querySelectorAll('...') ?? []. In most of these cases, we wrote a test case on top of it. But this way of using a fallback null elements won't help us to test the actual cases, as missing elements are replaced by new ones, allowing tests to pass whey they shouldn't.

Contribution
To address this, a new utility function has been developed that throws an error if the querySelector result is null or if querySelectorAll returns an empty array. This ensures that missing elements are caught early and improves the reliability of our test cases.

This is just a test case update and it won't affect the source code, but just the way we're currently checking null elements. This PR mainly focus to replace the code like container.querySelector('...') ?? new HTMLElement() or container.querySelectorAll('...') ?? [] with safer way to access the elements.

Screenshots

Contribution checklist

I have followed the contributing guidelines.
I have added sufficient test coverage for my changes.
I have formatted my code with Prettier and checked for linting issues with ESLint for code readability.

…ctor/querySelectorAll Closes Hacker0x01#5038

…afeQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

… safeQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…All with safeQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…h safeQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…l with safeQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

pullrequest

✅ This pull request was sent to the PullRequest network for review. Expert reviewers are now being matched to your request based on the code's requirements. Stay tuned!

What to expect from this code review:

Comments posted to any areas of potential concern or improvement.
Detailed feedback or actions needed to resolve issues that are found.
Turnaround times vary, but we aim to be swift.

@balajis-qb you can click here to see the review status or cancel the code review job.

pullrequest

PullRequest Breakdown

Reviewable lines of change

+ 1,075
- 570

85% TSX (tests)
15% TypeScript (tests)

Type of change

Feature - These changes are adding a new feature or improvement to existing code.

…afeQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…ySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…afeQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…Selector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…feQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…eQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…QuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…feQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…QuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

…feQuerySelector/safeQuerySelectorAll to ensure element existence - This change prevents tests from passing with unexpected null elements, enhancing test reliability and catching potential issues earlier. Closes Hacker0x01#5038

pullrequest

Good work here overall. I appreciate the detailed description, and showing the code for the safeQuerySelector functions. I only had a couple comments trying to clarify how undefined/null values are expected to be handled. All other comments were very minor or just suggestions. Thanks for the PR, it was a pleasure.

Frank T

Reviewed with ❤️ by PullRequest

src/test/calendar_icon.test.tsx

src/test/calendar_test.test.tsx

pullrequest · 2024-08-19T16:29:36Z

src/test/day_test.test.tsx

-        container.querySelector(".react-datepicker__day") ?? new HTMLElement(),
-      );
+
+      const dayElement = safeQuerySelector(container, ".react-datepicker__day");


Following up on previous comments, are there any test cases where we would expect safeQuerySelector to throw an error?

◽ Clarify Intent

Frank T

pullrequest · 2024-08-19T16:29:36Z

src/test/timepicker_test.test.tsx

+    if (lis.length < 2) {
+      throw new Error("Time list items must be at least 2");
+    }
+    fireEvent.click(lis[1]!);


Instead of adding the ! non null assertion here when calling onclick, consider adding to the if block above and throwing an error message if value is null or undefined.

🔹 Improve Readability (Nice to have)

Frank T

Thanks for the suggestion Frank. Actually I didn't add it in the if condition as we have already checked for the value existence case and as per the test case it shouldn't have any null or undefined values. I also updated the code post your suggestion and now we are not having any redundant if condition checks everywhere. Can you please review it once and let me know if you feel any improvement is needed?

pullrequest · 2024-08-19T16:29:36Z

src/test/timepicker_test.test.tsx

    expect(getInputString()).toBe("February 28, 2018 12:30 AM");
  });

  it("should return focus to input once time is selected", async () => {
-    document.body.appendChild(div ?? new HTMLElement()); // So we can check the dom later for activeElement
+    document.body.appendChild(div); // So we can check the dom later for activeElement


Should we check that div is not null/undefined before calling the appendChild?

🔸 Error Handling (Important)

Frank T

An error is already thrown in that situation.

Jacob

Hi Frank, Actually here the div is initialized manually by us in the beforeEach block. So, I feel we don't need to check for the null value here.

src/test/year_picker_test.test.tsx

pullrequest

Throughout, there are many locations where a new temporary variable is introduced immediately preceding a call (such as focus). These do not appear to be necessary and in my opinion would be better left inline as they currently are.

I would also recommend two other helper methods: one for obtaining a specific index or throwing an error and one for asserting a value is non-nullish. The latter could accept T | null | undefined| and return T` to assist the type system and permit method chaining.

Jacob

Reviewed with ❤️ by PullRequest

pullrequest · 2024-08-19T18:18:35Z

src/test/calendar_test.test.tsx

+        calendar,
+        ".react-datepicker__month-dropdown-container",
+      );
+      const select = safeQuerySelector(monthDropdownContainer, "select");


Have you considered letting safeQuerySelector accept more arguments (optionally, of course) to avoid calls like this? I wouldn't think it would be too difficult using the spread operator and a loop.

🔹 Simplify Code (Nice to have)

Jacob

Thank you for this wonderful suggestion Jacob. I added a new class based helper for this.

Now wherever the chain of querySelector calls is required, we can use the class based helper SafeElementWrapper.

Currently I updated the above mentioned call only with SafeElementWrapper. But still I added many code with unnecessary temporary variables. Maybe I'll create a new PR and replace all those entries to use SafeElementWrapper. I hope that's okay for you.

I didn't update the existing safeQuerySelector and SafeQuerySelectorAll helper to simplify the other parts of the code where the chain of method calls are not required and there we can use the safeQuerySelector or safeQuerySelectorAll normally like querySelector or querySelectorAll

Kindly review the code and let me know if any changes required.

Yes, that's definitely an improvement! I have no issue having it in a separate PR; it's your code after all. The new wrapper looks solid.

Jacob

…be null - As the safeQuerySelector automatically throws if the element is not found, additionally checking for null value is not needed

… the safeQuerySelector automatically throws an error if the element is not found

…und element is less than the minExpected param

…ed no of elements and remove the redundant throw error logic

codecov · 2024-08-25T16:37:05Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 96.53%. Comparing base (be3740d) to head (767c3b9).
Report is 46 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #5039   +/-   ##
=======================================
  Coverage   96.53%   96.53%           
=======================================
  Files          29       29           
  Lines        3343     3374   +31     
  Branches     1398     1423   +25     
=======================================
+ Hits         3227     3257   +30     
+ Misses        116      114    -2     
- Partials        0        3    +3

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

…n to avoid unnecessary temporary variables

… avoid a temporary variable usage

…feElementWrapper

balajis-qb · 2024-08-26T08:00:08Z

Thank you Frank/Jacob for your valuable feedback and review. I updated the code as per your suggestions and updated the comments/resolved for all the corresponding threads. Kindly let me know if you have any more suggestions to improve this PR.

pullrequest

PullRequest reviewed the updates made to #5039 since our last review was posted. This includes comments that have been posted by non-PullRequest reviewers. No further issues were found.

Reviewed by:

Frank T

balajis-qb · 2024-08-28T07:13:11Z

Hi @martijnrusschen, Can you help us move this PR? I worked on all the suggestions provided by the reviewers.

martijnrusschen · 2024-08-28T17:39:35Z

Sorry, I was on holiday. Will get this moving now.

balajis-qb · 2024-08-29T07:04:26Z

Thank you @martijnrusschen

<h3>Snyk has created this PR to upgrade react-datepicker from 7.3.0 to 7.4.0.</h3> :information_source: Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project. <hr/> - The recommended version is **1 version** ahead of your current version. - The recommended version was released **21 days ago**, on 2024-09-22. The recommended version fixes: Severity | Issue | PriorityScore (*) | Exploit Maturity | :-------------------------:|:-------------------------|-------------------------|:------------------------- <img src="https://res.cloudinary.com/snyk/image/upload/w_20,h_20/v1561977819/icon/m.png" width="20" height="20" title="medium severity"/> | Cross-site Scripting (XSS)<br/> [SNYK-JS-SUMMERNOTE-568471](https://snyk.io/vuln/SNYK-JS-SUMMERNOTE-568471) | **226/1000** <br/> **Why?** CVSS 4.3 | No Known Exploit (*) Note that the real score may have changed since the PR was raised. <details> <summary><b>Release notes</b></summary> <br/> <details> <summary>Package name: <b>react-datepicker</b></summary> <ul> <li> <b>7.4.0</b> - <a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/releases/tag/v7.4.0">2024-09-22</a></br><h2>What's Changed</h2> <ul> <li>Remove usages of react-onclickoutside to support React 19 by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/hamidrezahanafi/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/hamidrezahanafi">@ hamidrezahanafi</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2412103917" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4979" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4979/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4979">#4979</a></li> <li>Fix <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2416063876" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4986" data-hovercard-type="issue" data-hovercard-url="/Hacker0x01/react-datepicker/issues/4986/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/issues/4986">#4986</a>: 🐛🎨 Update the hover style to be applied only to the non-disabled calendar items by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/balajis-qb/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/balajis-qb">@ balajis-qb</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2416086259" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4987" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4987/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4987">#4987</a></li> <li>The classname "react-datepicker-ignore-onclickoutside" is not applied to custom input by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/Zulaxy/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/Zulaxy">@ Zulaxy</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2420869932" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4996" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4996/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4996">#4996</a></li> <li>Fix <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2431722168" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5010" data-hovercard-type="issue" data-hovercard-url="/Hacker0x01/react-datepicker/issues/5010/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/issues/5010">#5010</a>: 🐛 Restrict the focus to the disabled months/quarter/year using the initial Tab key navigation by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/balajis-qb/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/balajis-qb">@ balajis-qb</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2431821034" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5011" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5011/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5011">#5011</a></li> <li>Fix <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2472956006" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5038" data-hovercard-type="issue" data-hovercard-url="/Hacker0x01/react-datepicker/issues/5038/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/issues/5038">#5038</a>: Enhance test case querySelector/querySelectorAll reliability with ensuring element existance by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/balajis-qb/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/balajis-qb">@ balajis-qb</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2472989577" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5039" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5039/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5039">#5039</a></li> <li>Simplify event handlers by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/laug/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/laug">@ laug</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2481262055" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5045" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5045/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5045">#5045</a></li> <li>Fix "Cannot find module 'date-fns/types' ..." by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/Svish/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/Svish">@ Svish</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2440090618" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5020" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5020/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5020">#5020</a></li> <li>Parse date range by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/laug/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/laug">@ laug</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2494941097" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5060" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5060/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5060">#5060</a></li> <li>chore: upgrade yarn to v4 and other dependencies by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/abnud11/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/abnud11">@ abnud11</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2435658073" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5014" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5014/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5014">#5014</a></li> <li>♻️🧪 Refactor test cases with SafeElementWrapper querySelector chain to eliminate the unnecessary temporary variable by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/balajis-qb/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/balajis-qb">@ balajis-qb</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2496807574" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5062" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5062/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5062">#5062</a></li> <li>test: fix a test that would always fail if run on first day of month by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/laug/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/laug">@ laug</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2500715660" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5069" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5069/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5069">#5069</a></li> <li>🐛 Resolve the double-click focus issue of Time input and custom time component example by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/balajis-qb/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/balajis-qb">@ balajis-qb</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2525079285" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5088" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5088/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5088">#5088</a></li> <li>✏️ Fix the time input's placeholder typo by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/balajis-qb/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/balajis-qb">@ balajis-qb</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2527652653" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5092" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5092/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5092">#5092</a></li> <li>Added option to hide time caption by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/Qubitza/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/Qubitza">@ Qubitza</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2536567163" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5100" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5100/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5100">#5100</a></li> </ul> <h2>New Contributors</h2> <ul> <li><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/hamidrezahanafi/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/hamidrezahanafi">@ hamidrezahanafi</a> made their first contribution in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2412103917" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4979" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4979/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4979">#4979</a></li> <li><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/Zulaxy/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/Zulaxy">@ Zulaxy</a> made their first contribution in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2420869932" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4996" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4996/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4996">#4996</a></li> <li><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/laug/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/laug">@ laug</a> made their first contribution in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2481262055" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5045" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5045/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5045">#5045</a></li> <li><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/Svish/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/Svish">@ Svish</a> made their first contribution in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2440090618" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5020" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5020/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5020">#5020</a></li> <li><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/abnud11/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/abnud11">@ abnud11</a> made their first contribution in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2435658073" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5014" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5014/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5014">#5014</a></li> <li><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/Qubitza/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/Qubitza">@ Qubitza</a> made their first contribution in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2536567163" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#5100" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/5100/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/5100">#5100</a></li> </ul> <p><strong>Full Changelog</strong>: <a class="commit-link" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/compare/v7.3.0...v7.4.0"><tt>v7.3.0...v7.4.0</tt></a></p> </li> <li> <b>7.3.0</b> - <a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/releases/tag/v7.3.0">2024-07-08</a></br><h2>What's Changed</h2> <ul> <li>Add multiple months visual selection by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/luistorres/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/luistorres">@ luistorres</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2379832420" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4944" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4944/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4944">#4944</a></li> <li>fix badge in docs site by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/yuki0410-dev/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/yuki0410-dev">@ yuki0410-dev</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2381833379" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4947" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4947/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4947">#4947</a></li> <li>Fix <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2369448845" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4933" data-hovercard-type="issue" data-hovercard-url="/Hacker0x01/react-datepicker/issues/4933/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/issues/4933">#4933</a>: 🐛Remove the auto set of the '--keyboard-selected' class from the disabled dates while switching to the next or the previous view by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/balajis-qb/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/balajis-qb">@ balajis-qb</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2388170031" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4955" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4955/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4955">#4955</a></li> <li>fix style for quarter by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/asada-no4/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/asada-no4">@ asada-no4</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2382176895" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4948" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4948/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4948">#4948</a></li> <li>fix DatePickerProps by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/yuki0410-dev/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/yuki0410-dev">@ yuki0410-dev</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2367874910" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4932" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4932/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4932">#4932</a></li> </ul> <h2>New Contributors</h2> <ul> <li><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/luistorres/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/luistorres">@ luistorres</a> made their first contribution in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="2379832420" data-permission-text="Title is private" data-url="Hacker0x01/react-datepicker#4944" data-hovercard-type="pull_request" data-hovercard-url="/Hacker0x01/react-datepicker/pull/4944/hovercard" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/pull/4944">#4944</a></li> </ul> <p><strong>Full Changelog</strong>: <a class="commit-link" href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/compare/v7.2.0...v7.3.0"><tt>v7.2.0...v7.3.0</tt></a></p> </li> </ul> from <a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/releases">react-datepicker GitHub release notes</a> </details> </details> <details> <summary><b>Commit messages</b></summary> </br> <details> <summary>Package name: <b>react-datepicker</b></summary> <ul> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/5454eb6e26741c97ba3111bba563b9d762e988f9">5454eb6</a> Publish new API docs (automated commit)</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/ac5f224155b9caf04db0ccb9ca903d370554dfac">ac5f224</a> 7.4.0</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/6903813e5b915dd31bc1ba84f8379f63b6a77b36">6903813</a> Merge pull request #5093 from Hacker0x01/dependabot/npm_and_yarn/lint-staged-15.2.10</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/1a24832050934df63aa6b03cb0710652eb9144b5">1a24832</a> Merge pull request #5094 from Hacker0x01/dependabot/npm_and_yarn/typescript-eslint/parser-8.6.0</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/becab92779f791ac9380ecea205d186d83ea67c8">becab92</a> Merge pull request #5095 from Hacker0x01/dependabot/npm_and_yarn/types/jest-29.5.13</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/8619218f2cc84b53746d684ad8e22e593a47b7a1">8619218</a> Merge pull request #5098 from Hacker0x01/dependabot/npm_and_yarn/docs-site/sass-1.79.1</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/3e28fca807f0f096cd299a5607b56d79c22b9993">3e28fca</a> Merge pull request #5100 from Qubitza/main</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/342d370eaff4c9109441be7e9f0c6a29c45a3705">342d370</a> fix: improved code readability</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/017183dd9b58cf75b9b933c905d3dc1ae3f03200">017183d</a> test: shows custom time caption</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/2771fe419dbdf2463fd431c7f734cf93bf2b6bd7">2771fe4</a> test: hides time caption</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/aea8f6df6d66201f01b9ad05e2680016e9d5e91b">aea8f6d</a> feat: hide time caption</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/3a8d7e4ecd8bfe596fee917197b03ebf8919a681">3a8d7e4</a> chore(deps-dev): bump sass from 1.78.0 to 1.79.1 in /docs-site</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/c874de2c593061164bb9f4fd943a82cf8adf89e7">c874de2</a> chore(deps-dev): bump @ types/jest from 29.5.12 to 29.5.13</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/c0b68cae47b41415f4c7e75ed44873dfae8ab894">c0b68ca</a> chore(deps-dev): bump @ typescript-eslint/parser from 7.18.0 to 8.6.0</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/a5240d2d7eeb1f48db576bd6d31bd1f0cbe6d6bf">a5240d2</a> chore(deps-dev): bump lint-staged from 15.2.9 to 15.2.10</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/f75e1e60555fd48bf22ebd1b698c80f47ac788ff">f75e1e6</a> Merge pull request #5089 from Hacker0x01/dependabot/npm_and_yarn/examples/hello-world/express-4.21.0</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/50ceb5d41a445caacc57d7927bbfa2a2b4e7ccaf">50ceb5d</a> Merge pull request #5090 from Hacker0x01/dependabot/npm_and_yarn/docs-site/express-4.21.0</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/e85adf3d3d9a11540ee64e06e2043a2f8c44b9b7">e85adf3</a> Merge pull request #5092 from qburst/issue-4949/fix/placeholder-typo</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/81ab24deed16b6c569ee10f875c9e133dd36dd3a">81ab24d</a> ✏️ Fix the time input's placeholder typo</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/18be5fae4bceb27880cce276403d77b5bc4fa048">18be5fa</a> chore(deps): bump express from 4.19.2 to 4.21.0 in /docs-site</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/5c5a7e00afaa97527a3fc0b037ca43c03e51b01b">5c5a7e0</a> chore(deps): bump express from 4.19.2 to 4.21.0 in /examples/hello-world</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/d080ec3d593cdc992de7a48d55ab97a9bef552c6">d080ec3</a> Merge pull request #5082 from Hacker0x01/dependabot/npm_and_yarn/sass-1.78.0</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/553cdca22cf10b32fafb388428dd78eb93dcd5c9">553cdca</a> Merge pull request #5086 from Hacker0x01/dependabot/npm_and_yarn/rollup-4.21.3</li> <li><a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/commit/c0b68b11901f52243caaaf85c426876e0bd88dc4">c0b68b1</a> Merge pull request #5087 from Hacker0x01/dependabot/npm_and_yarn/eslint-plugin-react-7.36.1</li> </ul> <a href="https://snyk.io/redirect/github/Hacker0x01/react-datepicker/compare/c550195e21191b920bebe7c1430ce22cd39ef03a...5454eb6e26741c97ba3111bba563b9d762e988f9">Compare</a> </details> </details> <hr/> **Note:** *You are seeing this because you or someone else with access to this repository has authorized Snyk to open upgrade PRs.* For more information: <img src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiIxNWY4ODBkNi1hNjMzLTQ1ZWItYThmOS1jMDI4ZmI3NDQ3NDQiLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjE1Zjg4MGQ2LWE2MzMtNDVlYi1hOGY5LWMwMjhmYjc0NDc0NCJ9fQ==" width="0" height="0"/> 🧐 [View latest project report](https://app.snyk.io/org/dawoudio/project/e27b08aa-e5d2-4b10-8303-630a69d0b669?utm_source=github&utm_medium=referral&page=upgrade-pr) 🛠 [Adjust upgrade PR settings](https://app.snyk.io/org/dawoudio/project/e27b08aa-e5d2-4b10-8303-630a69d0b669/settings/integration?utm_source=github&utm_medium=referral&page=upgrade-pr) 🔕 [Ignore this dependency or unsubscribe from future upgrade PRs](https://app.snyk.io/org/dawoudio/project/e27b08aa-e5d2-4b10-8303-630a69d0b669/settings/integration?pkg=react-datepicker&utm_source=github&utm_medium=referral&page=upgrade-pr#auto-dep-upgrades)

Balaji Sridharan added 6 commits August 19, 2024 15:34

✨ Added a utility function to ensure element existence with querySele…

df7a973

…ctor/querySelectorAll Closes Hacker0x01#5038

pullrequest bot reviewed Aug 19, 2024

View reviewed changes

Balaji Sridharan added 11 commits August 19, 2024 15:51

balajis-qb force-pushed the issue-5038/refactor/test/ensure-element-existance branch from 4902bc9 to 26eec62 Compare August 19, 2024 10:22

pullrequest bot reviewed Aug 19, 2024

View reviewed changes

pullrequest bot approved these changes Aug 20, 2024

View reviewed changes

Balaji Sridharan added 4 commits August 25, 2024 17:59

♻️ Remove the redundant check of the safeQuerySelector result to not …

ee22340

…be null - As the safeQuerySelector automatically throws if the element is not found, additionally checking for null value is not needed

♻️ Refactor safeQuerySelector not toBe null test block to notThrow as…

72cc390

… the safeQuerySelector automatically throws an error if the element is not found

♻️ Update the safeQuerySelectorAll helper to throw an error if the fo…

e5d0568

…und element is less than the minExpected param

♻️ Refactor the usage of safeQuerySelectorAll to also pass the requir…

3723386

…ed no of elements and remove the redundant throw error logic

pullrequest bot approved these changes Aug 25, 2024

View reviewed changes

✨ Add SafeElementWrapper utility to support safe query selection chai…

b98b908

…n to avoid unnecessary temporary variables

Balaji Sridharan added 2 commits August 26, 2024 12:14

♻️ Update a calendar_test test case to use SafeQuerySelector chain to…

26c63bd

… avoid a temporary variable usage

🧪✅ Add test cases for safeQuerySelector, safeQuerySelectorAll, and Sa…

767c3b9

…feElementWrapper

pullrequest bot approved these changes Aug 26, 2024

View reviewed changes

pullrequest bot reviewed Aug 26, 2024

View reviewed changes

martijnrusschen merged commit 000bbd9 into Hacker0x01:main Aug 28, 2024
6 checks passed

omaration21 mentioned this pull request Nov 8, 2024

[Snyk] Upgrade react-datepicker from 7.4.0 to 7.5.0 omaration21/sandersapp#15

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix #5038: Enhance test case querySelector/querySelectorAll reliability with ensuring element existance #5039

Fix #5038: Enhance test case querySelector/querySelectorAll reliability with ensuring element existance #5039

balajis-qb commented Aug 19, 2024 •

edited

Loading

pullrequest bot left a comment

pullrequest bot left a comment •

edited

Loading

pullrequest bot left a comment

pullrequest bot Aug 19, 2024

balajis-qb Aug 26, 2024

pullrequest bot Aug 19, 2024

balajis-qb Aug 26, 2024

pullrequest bot Aug 19, 2024

pullrequest bot Aug 19, 2024

balajis-qb Aug 26, 2024

pullrequest bot left a comment

pullrequest bot Aug 19, 2024

balajis-qb Aug 26, 2024

pullrequest bot Aug 26, 2024

balajis-qb Aug 26, 2024

codecov bot commented Aug 25, 2024 •

edited

Loading

balajis-qb commented Aug 26, 2024

pullrequest bot left a comment

balajis-qb commented Aug 28, 2024

martijnrusschen commented Aug 28, 2024

balajis-qb commented Aug 29, 2024 •

edited

Loading

Fix #5038: Enhance test case querySelector/querySelectorAll reliability with ensuring element existance #5039

Fix #5038: Enhance test case querySelector/querySelectorAll reliability with ensuring element existance #5039

Conversation

balajis-qb commented Aug 19, 2024 • edited Loading

Screenshots

Contribution checklist

pullrequest bot left a comment

Choose a reason for hiding this comment

pullrequest bot left a comment • edited Loading

Choose a reason for hiding this comment

PullRequest Breakdown

pullrequest bot left a comment

Choose a reason for hiding this comment

pullrequest bot Aug 19, 2024

Choose a reason for hiding this comment

◽ Clarify Intent

balajis-qb Aug 26, 2024

Choose a reason for hiding this comment

pullrequest bot Aug 19, 2024

Choose a reason for hiding this comment

🔹 Improve Readability (Nice to have)

balajis-qb Aug 26, 2024

Choose a reason for hiding this comment

pullrequest bot Aug 19, 2024

Choose a reason for hiding this comment

🔸 Error Handling (Important)

pullrequest bot Aug 19, 2024

Choose a reason for hiding this comment

balajis-qb Aug 26, 2024

Choose a reason for hiding this comment

pullrequest bot left a comment

Choose a reason for hiding this comment

pullrequest bot Aug 19, 2024

Choose a reason for hiding this comment

🔹 Simplify Code (Nice to have)

balajis-qb Aug 26, 2024

Choose a reason for hiding this comment

pullrequest bot Aug 26, 2024

Choose a reason for hiding this comment

balajis-qb Aug 26, 2024

Choose a reason for hiding this comment

codecov bot commented Aug 25, 2024 • edited Loading

Codecov Report

balajis-qb commented Aug 26, 2024

pullrequest bot left a comment

Choose a reason for hiding this comment

balajis-qb commented Aug 28, 2024

martijnrusschen commented Aug 28, 2024

balajis-qb commented Aug 29, 2024 • edited Loading

balajis-qb commented Aug 19, 2024 •

edited

Loading

pullrequest bot left a comment •

edited

Loading

codecov bot commented Aug 25, 2024 •

edited

Loading

balajis-qb commented Aug 29, 2024 •

edited

Loading