Pog, Toast, Tooltip, Upsell, Video: add visual diff testing and screenshot to description in VSCode (Flow extension) #2057
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
AlbertCarreras
force-pushed
the
visDiffs5
branch
6 times, most recently
from
4765c22
to
6c51203
Compare
AlbertCarreras
changed the title
AlbertCarreras
force-pushed
the
visDiffs5
branch
2 times, most recently
from
3cd4727
to
cd5a0bf
Compare
✅ Deploy Preview for gestalt ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
AlbertCarreras
force-pushed
the
visDiffs5
branch
from
cd5a0bf
to
87c32d5
Compare
dangerismycat
approved these changes
Apr 8, 2022
| @@ -0,0 +1,15 @@ | |||
| describe('Pog visual dark mode regression check', () => { | |||
There was a problem hiding this comment.
Should these files be Flow typed? Have we been add Flow annotations to the other visual test files?
There was a problem hiding this comment.
Have we been add Flow annotations to the other visual test files?
NO
packages/gestalt/src/Pog.js
Outdated
| @@ -89,7 +89,11 @@ type Props = {| | |||
| /** | |||
| * [Pog](https://gestalt.pinterest.systems/pog) is a lower-level functional component to show the active, hovered, & focused states of [IconButton](https://gestalt.pinterest.systems/pog/iconbutton). | |||
| * | |||
| *This abstraction to allow for links that look like IconButton. | |||
| * This abstraction to allow for links that look like IconButton. | |||
There was a problem hiding this comment.
(pre-existing) typo: "This is an abstraction to allow for…"
| @@ -40,6 +40,10 @@ type Props = {| | |||
| * [Toasts](https://gestalt.pinterest.systems/toast) can educate people on the content of the screen, provide confirmation when people complete an action, or simply communicate a short message. | |||
| * | |||
| * Toast is purely visual. In order to properly handle the showing and dismissing of Toasts, as well as any animations, you will need to implement a Toast manager. | |||
| * | |||
| * ⚠️ Please note: Toast is not currently supported in dark mode. | |||
packages/gestalt/src/Upsell.js
Outdated
| @@ -131,7 +131,9 @@ type Props = {| | |||
| /** | |||
| * [Upsells](https://gestalt.pinterest.systems/upsell) are banners that display short messages that focus on promoting an action or upgrading something the user already has. | |||
| * | |||
| * ⚠️ Please note: Upsell is not currently supported in dark mode. | |||
| * ⚠️ Please note: Upsells is not currently supported in dark mode. | |||
There was a problem hiding this comment.
typo: Upsell should be singular
AlbertCarreras
force-pushed
the
visDiffs5
branch
from
87c32d5
to
055c81b
Compare
AlbertCarreras
force-pushed
the
visDiffs5
branch
from
055c81b
to
e1f1493
Compare
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.
Summary
What changed?
Pog, Toast, Tooltip, Upsell, Video: add visual diff testing and screenshot to description in VSCode (Flow extension)
Why?
Provide basic visual testing coverage for most Gestalt components and link screenshots to VSCode's Flow extension that shows component screenshot below the component description on hover for better in-editor documentation.
OKR: