[Tooltip] Modify Hover Logic #1002
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
michaeljaltamirano
added a commit
that referenced
this pull request
Jun 2, 2021
* [Dependencies] Update Emotion 10 to 11 (#910) * Bump all emotion packages to ^11, update emotion peerDependencies * WIP * Prefer useTheme over in-line usage that pulls in context anyway * Undo preset change * Try and update stylis version for test fix * Restore babel config, remove moduleDirectories src resolution in favor of moduleNameMapper * Restore some dependencies too * Update snapshots for new stylis version * Add Storybook emotion 11 compat * Remove some since-deleted files * Remove styled-base (included in styled, now) * Use new styled base import path to fix build * Add styled/base comment to memorialize inclusion * Try babel plugin instead for test-js regression test * Bump emotion/react * Try again without css prop plugin * Attempt to bust cache in CI * Restore css preset usage * Use built-in wrapper after fixing overwrite issue * Nest test (it) blocks in describe block * Bump @emotion packages * Test arrow on CI regression with portal container * Test container, no child * Try modifying hover selector for consistency * Try inherit * Force snapshots to update in CI after new style was not expected to show up but did (seems buggy) * Undo CI changes * Update snapshots * Fix css prop typing in stories directory * Try swapping alphabetization of hover and visited * Revert "Try swapping alphabetization of hover and visited" This reverts commit 1fc1e6a. * Try without cache * Reduce diff * Clean up stylis artifacts * Try another DialogModal change * Try more specific selector syntax * Test out what happens when we remove the initial snapshots, to see if the other new snapshots now break * Try with css usage * Try with separating svg styling for Field * Restore runInBand * Remove redundant disabled opacity text color style * Try with no cache * Try and simplify carousel styles to try and fix jest serializer * Play snapshot roulette again * Dedupe * Upgrade emotion, suppress storybook webpack babel warning * Try CI cache bust, it is reaching into other branches like the browserslist PR * Skip difficult tests * Adjust test threshold after skipping tests * Reduce config.yml diff * Some cleanup, skip precisely snapshots, not other tests * Set emotion version to patch-level * Diff reduction * Undo roundButton diff * Reduce button and field diff * Revert arrow test changes * Revert carousel style diff * Remove redundant disabled style * Try with portal container again * Revert "Undo roundButton diff" This reverts commit d9a2b75. * [TypeScript] Prefer React.FC For Component Typing (#983) * Prefer React.FC for component typing, fix prop-types errors, export Icon type * Refine code comment * Ignore new exported prop type, fix Alert component definition * Update BORDER_RADIUS_PROP_TYPES internals * Fix some storybook prop typing issues * v22.0.0-beta.1 * DialogModal type refinement (#984) * v22.0.0-beta.3 * Unskip carousel briefly * Skip carousel again * [Emotion] Prefer autoLabel: true for output (#1001) * [Container] Moves types-only definition into types.ts file (#1003) * [Tooltip] Modify Hover Logic (#1002) * Misc asterisk fix * Move body styling into TooltipBox, remove Global style application * Update test config * Drop threshold down 1%
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Roughly ~7kb of the Emotion regression is due to our including a
<Global />style in Tooltip. This PR:document.body.classListhandling.onClickfunctionality to the TooltipBoxBefore: The click behavior applies
cursor-pointerto the body so thecursor: pointerstill shows even after the tooltip is closed:before.mov
After: Behavior is simplified and fixed:
after.mov
After making this change the Bundlewatch reports a small size increase in the
nextbranch now:(+2.92KB, -1.46KB, +0.2%)TODO: Move Tooltip trigger tabbable.