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

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

Closed
1 task done
Rocss opened this issue Apr 15, 2024 · 0 comments · Fixed by #4269
Closed
1 task done

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

Rocss opened this issue Apr 15, 2024 · 0 comments · Fixed by #4269
Labels
bug Something isn't working Component: Tooltip triage An issue needing triage

Comments

@Rocss
Copy link
Contributor

Rocss commented Apr 15, 2024

Code of conduct

  • I agree to follow this project's code of conduct.

Impacted component(s)

sp-tooltip

Expected behavior

Given the below code:

    <sp-icon-help>
        <sp-tooltip self-managed>Help is on the way</sp-tooltip>
    </sp-icon-help>

And given that no focusable element can be found in the parent tree of the sp-tooltip, I expect that the focusable element to end up being the document, and that a warning would be thrown when window.__swc.DEBUG === true so that I am instructed on how to provide an accessible, focusable trigger for my tooltip.

Actual behavior

When window.__swc.DEBUG === true, the search loop is closed and the trigger is the document.
We get the expected warnings in the console.

However, when window.__swc.DEBUG === false, nothing is ever returned from the search loop, ending up in an infinite loop.

While this is a problem resulting from an incorrect usage of self-managed, developers may ignore the warnings in the console, as it does not create a loop in environments where DEBUG is true and end up with the infinite loop in production.

Screenshots

No response

What browsers are you seeing the problem in?

No response

How can we reproduce this issue?

  1. In the code below, replace window.__swc.DEBUG with false (or directly in the browser console)
  2. Open the Tooltip self-managed storybook
  3. Remove the focusable element and replace it with a div
  4. Check console
  5. See error

Sample code that illustrates the problem

while (!triggerElement?.matches?.(focusableSelector)) {
            start =
                triggerElement.assignedSlot || (triggerElement as HTMLElement);
            root = start.getRootNode();
            /* c8 ignore next 13 */
            if (window.__swc.DEBUG) {
                if (root === document) {
                    window.__swc.warn(
                        this,
                        `Self managed [${this.localName}](https://app.slack.com/client/E23RE8G4F/$%7Bthis.localName%7D) elements walk up the composed tree to acquire a trigger element. No trigger element was found before the document.`,
                        'https://opensource.adobe.com/spectrum-web-components/components/tooltip#self-managed-overlays',
                        {
                            level: 'high',
                        }
                    );
                    return root as HTMLElement;
                }
            }
            triggerElement = (start.parentElement ||
                (root as ShadowRoot).host ||
                /* c8 ignore next 1 */
                root) as HTMLElement;
        }
        return triggerElement;

Logs taken while reproducing problem

No response

@Rocss Rocss added bug Something isn't working triage An issue needing triage labels Apr 15, 2024
@Rocss Rocss linked a pull request Apr 15, 2024 that will close this issue
13 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working Component: Tooltip triage An issue needing triage
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant