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.

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

fix(tooltip): fix infinite loop in self-managed tooltips #4269

Merged
merged 7 commits into from Apr 29, 2024

Conversation

Rocss
Copy link
Contributor

@Rocss Rocss commented Apr 15, 2024

Description

Reordering some if statements to make sure a trigger is always returned for self-managed tooltips.

Related issue(s)

Motivation and context

Fixes a bug which reproduces only when NOT in DEBUG mode. See details in the issue above.

Not sure how to add a unit test for this, since triggerElement is private and I can not check it from outside.

How has this been tested?

  • window.__swc.DEBUG === false
    1. Modified the self-managed story and replaced sp-action-button with a div
    2. No infinite loop - trigger ends up being the document
    3. No warning is thrown in the console
  • window.__swc.DEBUG === true
    1. Modified the self-managed story and replaced sp-action-button with a div
    2. No infinite loop - trigger ends up being the document
    3. Warning is thrown in the console

Screenshots (if appropriate)

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)
  • Chore (minor updates related to the tooling or maintenance of the repository, does not impact compiled assets)

Checklist

  • I have signed the Adobe Open Source CLA.
  • My code follows the code style of this project.
  • If my change required a change to the documentation, I have updated the documentation in this pull request.
  • I have read the CONTRIBUTING document.
  • I have added tests to cover my changes.
  • All new and existing tests passed.
  • I have reviewed at the Accessibility Practices for this feature, see: Aria Practices

Best practices

This repository uses conventional commit syntax for each commit message; note that the GitHub UI does not use this by default so be cautious when accepting suggested changes. Avoid the "Update branch" button on the pull request and opt instead for rebasing your branch against main.

@Rocss Rocss marked this pull request as ready for review April 15, 2024 15:04
Copy link

github-actions bot commented Apr 15, 2024

Tachometer results

Chrome

action-menu permalink

test-basic

Version Bytes Avg Time vs remote vs branch
npm latest 646 kB 131.54ms - 135.05ms - unsure 🔍
-1% - +3%
-0.98ms - +3.61ms
branch 638 kB 130.50ms - 133.46ms unsure 🔍
-3% - +1%
-3.61ms - +0.98ms
-

test-directive permalink

Version Bytes Avg Time vs remote vs branch
npm latest 603 kB 61.25ms - 62.71ms - unsure 🔍
-2% - +2%
-1.20ms - +0.97ms
branch 595 kB 61.29ms - 62.90ms unsure 🔍
-2% - +2%
-0.97ms - +1.20ms
-

test-lazy permalink

Version Bytes Avg Time vs remote vs branch
npm latest 602 kB 58.94ms - 60.09ms - unsure 🔍
-2% - +1%
-1.19ms - +0.57ms
branch 594 kB 59.16ms - 60.49ms unsure 🔍
-1% - +2%
-0.57ms - +1.19ms
-

test-open-close-directive permalink

Version Bytes Avg Time vs remote vs branch
npm latest 787 kB 1870.82ms - 1873.76ms - unsure 🔍
-0% - -0%
-5.01ms - -0.35ms
branch 780 kB 1873.17ms - 1876.78ms unsure 🔍
+0% - +0%
+0.35ms - +5.01ms
-

test-open-close permalink

Version Bytes Avg Time vs remote vs branch
npm latest 786 kB 1857.45ms - 1860.58ms - unsure 🔍
-0% - +0%
-4.15ms - +0.01ms
branch 778 kB 1859.72ms - 1862.46ms unsure 🔍
-0% - +0%
-0.01ms - +4.15ms
-

picker permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 513 kB 524.26ms - 535.04ms - unsure 🔍
-1% - +2%
-5.07ms - +9.25ms
branch 504 kB 522.85ms - 532.27ms unsure 🔍
-2% - +1%
-9.25ms - +5.07ms
-

split-button permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 721 kB 1855.23ms - 1858.09ms - unsure 🔍
-0% - -0%
-7.16ms - -1.48ms
branch 713 kB 1858.52ms - 1863.44ms unsure 🔍
+0% - +0%
+1.48ms - +7.16ms
-

tooltip permalink

test-basic

Version Bytes Avg Time vs remote vs branch
npm latest 548 kB 34.19ms - 34.96ms - unsure 🔍
-1% - +2%
-0.25ms - +0.81ms
branch 540 kB 33.93ms - 34.65ms unsure 🔍
-2% - +1%
-0.81ms - +0.25ms
-

test-directive permalink

Version Bytes Avg Time vs remote vs branch
npm latest 646 kB 25.70ms - 26.27ms - slower ❌
10% - 13%
2.30ms - 3.06ms
branch 537 kB 23.06ms - 23.56ms faster ✔
9% - 12%
2.30ms - 3.06ms
-

test-element permalink

Version Bytes Avg Time vs remote vs branch
npm latest 652 kB 51.20ms - 52.32ms - unsure 🔍
-2% - +1%
-1.00ms - +0.53ms
branch 645 kB 51.48ms - 52.51ms unsure 🔍
-1% - +2%
-0.53ms - +1.00ms
-

test-lazy permalink

Version Bytes Avg Time vs remote vs branch
npm latest 629 kB 41.54ms - 42.76ms - unsure 🔍
-2% - +2%
-0.88ms - +0.70ms
branch 622 kB 41.75ms - 42.73ms unsure 🔍
-2% - +2%
-0.70ms - +0.88ms
-

truncated permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 525 kB 54.97ms - 56.01ms - unsure 🔍
-1% - +1%
-0.80ms - +0.57ms
branch 518 kB 55.16ms - 56.05ms unsure 🔍
-1% - +1%
-0.57ms - +0.80ms
-
Firefox

action-menu permalink

test-basic

Version Bytes Avg Time vs remote vs branch
npm latest 646 kB 267.54ms - 271.06ms - faster ✔
8% - 10%
23.22ms - 29.26ms
branch 638 kB 293.08ms - 298.00ms slower ❌
9% - 11%
23.22ms - 29.26ms
-

test-directive permalink

Version Bytes Avg Time vs remote vs branch
npm latest 603 kB 124.09ms - 126.67ms - unsure 🔍
-1% - +2%
-0.87ms - +2.15ms
branch 595 kB 123.96ms - 125.52ms unsure 🔍
-2% - +1%
-2.15ms - +0.87ms
-

test-lazy permalink

Version Bytes Avg Time vs remote vs branch
npm latest 602 kB 144.91ms - 150.73ms - slower ❌
9% - 15%
12.34ms - 19.18ms
branch 594 kB 130.25ms - 133.87ms faster ✔
9% - 13%
12.34ms - 19.18ms
-

test-open-close-directive permalink

Version Bytes Avg Time vs remote vs branch
npm latest 787 kB 1906.90ms - 1914.62ms - slower ❌
1% - 2%
22.24ms - 31.08ms
branch 780 kB 1881.95ms - 1886.25ms faster ✔
1% - 2%
22.24ms - 31.08ms
-

test-open-close permalink

Version Bytes Avg Time vs remote vs branch
npm latest 786 kB 1880.12ms - 1885.20ms - unsure 🔍
-0% - +0%
-6.35ms - +1.35ms
branch 778 kB 1882.26ms - 1888.06ms unsure 🔍
-0% - +0%
-1.35ms - +6.35ms
-

picker permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 513 kB 969.25ms - 999.15ms - unsure 🔍
-1% - +2%
-10.08ms - +22.72ms
branch 504 kB 971.16ms - 984.60ms unsure 🔍
-2% - +1%
-22.72ms - +10.08ms
-

split-button permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 721 kB 1876.76ms - 1880.12ms - unsure 🔍
-0% - -0%
-7.24ms - -1.08ms
branch 713 kB 1880.01ms - 1885.19ms unsure 🔍
+0% - +0%
+1.08ms - +7.24ms
-

tooltip permalink

test-basic

Version Bytes Avg Time vs remote vs branch
npm latest 652 kB 77.53ms - 81.63ms - slower ❌
13% - 19%
8.91ms - 13.25ms
branch 645 kB 67.80ms - 69.20ms faster ✔
12% - 16%
8.91ms - 13.25ms
-

test-directive permalink

Version Bytes Avg Time vs remote vs branch
npm latest 633 kB 50.80ms - 51.52ms - faster ✔
10% - 18%
5.25ms - 10.91ms
branch 524 kB 56.44ms - 62.04ms slower ❌
10% - 21%
5.25ms - 10.91ms
-

test-element permalink

Version Bytes Avg Time vs remote vs branch
npm latest 652 kB 109.80ms - 114.52ms - faster ✔
0% - 6%
0.09ms - 7.47ms
branch 645 kB 113.10ms - 118.78ms slower ❌
0% - 7%
0.09ms - 7.47ms
-

test-lazy permalink

Version Bytes Avg Time vs remote vs branch
npm latest 629 kB 90.24ms - 94.28ms - unsure 🔍
-5% - +2%
-4.37ms - +2.33ms
branch 622 kB 90.61ms - 95.95ms unsure 🔍
-3% - +5%
-2.33ms - +4.37ms
-

truncated permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 525 kB 96.21ms - 101.87ms - unsure 🔍
-5% - +3%
-4.63ms - +3.31ms
branch 518 kB 96.92ms - 102.48ms unsure 🔍
-3% - +5%
-3.31ms - +4.63ms
-

@Rajdeepc Rajdeepc requested a review from a team April 16, 2024 04:20
Copy link
Collaborator

@Westbrook Westbrook left a comment

Choose a reason for hiding this comment

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

Do we have tests that prove that if it finds document it doesn't bind listeners? A Tooltip in this situation should not work in any way, it should only dispatch the Dev Mode warning.

@Rocss
Copy link
Contributor Author

Rocss commented Apr 23, 2024

@Westbrook As it is right now it does bind event listeners on the document.
May I suggest that get triggerElement() would return null if no focusable element was found in the parent chain, instead of document?
Looking at the Overlay class, it seems like it is allowed to be null:

Overlay.triggerElement: HTMLElement | VirtualTrigger | null

Copy link

changeset-bot bot commented Apr 25, 2024

⚠️ No Changeset found

Latest commit: 114c1d5

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Copy link
Collaborator

@Westbrook Westbrook left a comment

Choose a reason for hiding this comment

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

Do we have tests that prove that if it finds document it doesn't bind listeners? A Tooltip in this situation should not work in any way, it should only dispatch the Dev Mode warning.

If not, we can land this on the presumption it works, as it seems to not be working for you otherwise.

@Rocss
Copy link
Contributor Author

Rocss commented Apr 29, 2024

@Westbrook I added a unit test which fails before this change. Let me know if this would be enough in this scenario, or else I'm happy to implement other checks as well!
P.S. The Lighthouse check hates me 😅 , is there something I am missing which would resolve the preview link of this PR?

);

await elementUpdated(el);
expect(documentEventsSpy.callCount).to.equal(0);
Copy link
Collaborator

Choose a reason for hiding this comment

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

Can we confirm it doesn't attach to anything else, too?

Suggested change
expect(documentEventsSpy.callCount).to.equal(0);
expect(documentEventsSpy.callCount).to.equal(0);
expect(el.overlayElement?.triggerElement).to.be.null;

Copy link
Collaborator

@Westbrook Westbrook left a comment

Choose a reason for hiding this comment

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

For Lighthouse/a preview URL, your branch name is too long. 🙈 We won't count it against you 😉

This is a good test, with that one extra expectation and a rebase to main we should be good to go here. Thanks for finding tis issue!

Copy link
Collaborator

@Westbrook Westbrook left a comment

Choose a reason for hiding this comment

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

:shipit: Thank you, thank you!

@Westbrook Westbrook merged commit b66ee49 into main Apr 29, 2024
47 of 49 checks passed
@Westbrook Westbrook deleted the rocss/self-managed-tooltip-infinite-loop branch April 29, 2024 14:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug]: self-managed Tooltip creates infinite loop when no focusable trigger is found
2 participants