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

Jump to bottom

fix: maintain open state when hovering over 'floating' tooltip content #2840

Merged
merged 2 commits into from
Mar 1, 2024
Merged

fix: maintain open state when hovering over 'floating' tooltip content #2840

merged 2 commits into from
Mar 1, 2024

Conversation

awgraves
Copy link
Contributor

@awgraves awgraves commented Feb 29, 2024 •
edited
Loading

Overview

Adds event listeners to mouse overing a floating tooltip so it remains open.
Previously, the floating variant would close whenever mousing over the tooltip content.

PR Checklist

  • Related to designs:
  • Related to JIRA ticket: DOT-79
  • I have run this code to verify it works
  • This PR includes unit tests for the code change
  • This PR includes testing instructions tests for the code change
  • The alpha package of this PR is passing end-to-end tests in all relevant Codecademy repositories

Testing Instructions

  1. visit the prod storybook page for the tooltip. Go to the first example and set the placement as floating. Note that mousing over the tooltip example causes it to close (most of the time).
    Screenshot 2024-02-29 at 4 13 06 PM

  2. now visit the new storybook page and confirm the fix - tooltip should stay open when mousing over the popover content.
    new_storybook

PR Links and Envs

Repository PR Link PR Env
Monolith Monolith PR Monolith Env
Portal Portal Link Portal Env

@awgraves awgraves requested a review from a team as a code owner February 29, 2024 15:02
@awgraves awgraves changed the title fix: fixes hover state for 'floating' tooltips fix: maintain open state when hovering over 'floating' tooltip content Feb 29, 2024
@dreamwasp
Copy link
Contributor

we're actually currently working on an overhaul of tooltips! in progress branch here + our accessibility proposal if you're curious!

@awgraves
Copy link
Contributor Author

we're actually currently working on an overhaul of tooltips! in progress branch here + our accessibility proposal if you're curious!

@dreamwasp nice! my change is related to a test.io audit for a feature we need to launch by Monday.
Is that WIP branch going in soon, or should we just go with this smaller PR for now?

(btw sorry i should have made this PR draft as im still waiting on alpha build - forgot it auto tagged people when opening a pr!)

@awgraves awgraves marked this pull request as draft February 29, 2024 15:21
@dreamwasp
Copy link
Contributor

no worries, just wanted to share for visibility. i'll check out this pr once the pkgs built and all the good stuff, hoping to have new tooltips shipped later next week

@awgraves awgraves force-pushed the agraves.DOT-79.fix-floating-tooltip-mouseevent branch from c04f647 to 7041765 Compare February 29, 2024 22:06
@codecademydev
Copy link
Collaborator

📬Published Alpha Packages:

@codecademy/[email protected]
@codecademy/[email protected]
@codecademy/[email protected]

@codecademydev
Copy link
Collaborator

🚀 Styleguide deploy preview ready!

https://65e102132724213c07d8b869--gamut-preview.netlify.app

Deploy Logs

@awgraves awgraves marked this pull request as ready for review February 29, 2024 22:39
@aresnik11 aresnik11 requested a review from dreamwasp February 29, 2024 22:51
dreamwasp
dreamwasp approved these changes Mar 1, 2024
View reviewed changes
Copy link
Contributor

@dreamwasp dreamwasp left a comment

Choose a reason for hiding this comment

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

love this, i think the only things failing are jest snapshot tests in your integration PRs! i hadn't implement this behavior yet on my in-progress tooltip branch so this is super helpful thank youu!! ✨

@awgraves awgraves added the Ship It :shipit: Automerge this PR when possible label Mar 1, 2024
@codecademydev codecademydev merged commit cde4828 into main Mar 1, 2024
22 of 23 checks passed
@codecademydev codecademydev deleted the agraves.DOT-79.fix-floating-tooltip-mouseevent branch March 1, 2024 18:38
@codecademydev codecademydev removed the Ship It :shipit: Automerge this PR when possible label Mar 1, 2024
@dreamwasp dreamwasp mentioned this pull request Mar 6, 2024
Merged
codecademydev pushed a commit that referenced this pull request Mar 6, 2024
@dreamwasp
chore(ToolTip): Revert "fix: maintain open state when hovering over '…
19926ad 
…floating' tooltip content"

Reverts #2840 -- breaks click handlers on tooltips
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@dreamwasp dreamwasp dreamwasp approved these changes

@BandanaKM BandanaKM Awaiting requested review from BandanaKM BandanaKM is a code owner automatically assigned from Codecademy/gamut

@aresnik11 aresnik11 Awaiting requested review from aresnik11 aresnik11 is a code owner automatically assigned from Codecademy/gamut

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@awgraves @dreamwasp @codecademydev