Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
f447a7b
commit 3cd4727
Showing
33 changed files
with
400 additions
and
19 deletions.
There are no files selected for viewing
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
describe('Pog visual dark mode regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Pog-dark'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Pog-dark', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
describe('Pog visual regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Pog'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Pog', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
describe('Toast visual dark mode regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Toast-dark'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Toast-dark', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
describe('Toast visual regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Toast'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Toast', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
describe('Tooltip visual dark mode regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Tooltip-dark'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').find('button').first().focus(); | ||
|
||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Tooltip-dark', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
describe('Tooltip visual regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Tooltip'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').find('button').first().focus(); | ||
|
||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Tooltip', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
describe('Upsell dark mode visual regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Upsell-dark'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Upsell-dark', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
describe('Upsell visual regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Upsell'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Upsell', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
describe('Video visual regression check', () => { | ||
beforeEach(() => { | ||
cy.visit('/visual-test/Video'); | ||
}); | ||
|
||
it('Compares snapshots', () => { | ||
cy.get('[data-test-id="visual-test"]').toMatchImageSnapshot({ | ||
name: 'Video', | ||
imageConfig: { | ||
threshold: 0.001, | ||
thresholdType: 'percent', | ||
}, | ||
}); | ||
}); | ||
}); |
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+9.86 KB
cypress/integration/visual-test/__image_snapshots__/Toast-dark #0.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+3.6 KB
cypress/integration/visual-test/__image_snapshots__/Tooltip-dark #0.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+23.5 KB
cypress/integration/visual-test/__image_snapshots__/Upsell-dark #0.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
// @flow strict | ||
import { type Node } from 'react'; | ||
import { Text, Flex, Pog, Box, ColorSchemeProvider } from 'gestalt'; | ||
|
||
export default function Screenshot(): Node { | ||
return ( | ||
<ColorSchemeProvider colorScheme="dark"> | ||
<Box color="white" display="inlineBlock" padding={1}> | ||
<Flex direction="column" gap={4}> | ||
<Flex gap={4}> | ||
<Flex direction="column" gap={1}> | ||
<Text>Default</Text> | ||
<Pog icon="heart" iconColor="red" /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Hovered</Text> | ||
<Pog icon="heart" iconColor="red" hovered /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Focused</Text> | ||
<Pog icon="heart" iconColor="red" focused /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Active</Text> | ||
<Pog icon="heart" iconColor="red" active /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Selected</Text> | ||
<Pog icon="heart" iconColor="red" selected /> | ||
</Flex> | ||
</Flex> | ||
</Flex> | ||
</Box> | ||
</ColorSchemeProvider> | ||
); | ||
} |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
// @flow strict | ||
import { type Node } from 'react'; | ||
import { Pog, Text, Flex, Box } from 'gestalt'; | ||
|
||
export default function Screenshot(): Node { | ||
return ( | ||
<Box color="white" display="inlineBlock" padding={1}> | ||
<Flex direction="column" gap={4}> | ||
<Flex gap={4}> | ||
<Flex direction="column" gap={1}> | ||
<Text>Default</Text> | ||
<Pog icon="heart" iconColor="red" /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Hovered</Text> | ||
<Pog icon="heart" iconColor="red" hovered /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Focused</Text> | ||
<Pog icon="heart" iconColor="red" focused /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Active</Text> | ||
<Pog icon="heart" iconColor="red" active /> | ||
</Flex> | ||
<Flex direction="column" gap={1}> | ||
<Text>Selected</Text> | ||
<Pog icon="heart" iconColor="red" selected /> | ||
</Flex> | ||
</Flex> | ||
</Flex> | ||
</Box> | ||
); | ||
} |
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
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
// @flow strict | ||
import { Fragment, type Node } from 'react'; | ||
import { ColorSchemeProvider, Toast, Button, Link, Text, Image, Box } from 'gestalt'; | ||
|
||
export default function Snapshot(): Node { | ||
return ( | ||
<ColorSchemeProvider colorScheme="dark"> | ||
<Box color="white"> | ||
<Toast | ||
button={<Button key="button-key" text="Undo" size="lg" />} | ||
text="Home decor" | ||
thumbnail={ | ||
<Image | ||
alt="Modern ceramic vase pin." | ||
naturalHeight={564} | ||
naturalWidth={564} | ||
src="https://i.ibb.co/Lx54BCT/stock1.jpg" | ||
/> | ||
} | ||
/> | ||
</Box> | ||
</ColorSchemeProvider> | ||
); | ||
} |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
// @flow strict | ||
import { Fragment, type Node } from 'react'; | ||
import { Toast, Button, Link, Text, Image } from 'gestalt'; | ||
|
||
export default function Snapshot(): Node { | ||
return ( | ||
<Toast | ||
button={<Button key="button-key" text="Undo" size="lg" />} | ||
text="Home decor" | ||
thumbnail={ | ||
<Image | ||
alt="Modern ceramic vase pin." | ||
naturalHeight={564} | ||
naturalWidth={564} | ||
src="https://i.ibb.co/Lx54BCT/stock1.jpg" | ||
/> | ||
} | ||
/> | ||
); | ||
} |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
// @flow strict | ||
import { type Node } from 'react'; | ||
import { ColorSchemeProvider, Tooltip, IconButton, Box } from 'gestalt'; | ||
|
||
export default function Snapshot(): Node { | ||
return ( | ||
<ColorSchemeProvider colorScheme="dark"> | ||
<Box color="white" padding={4} width={150}> | ||
<Tooltip idealDirection="right" inline text="Share" accessibilityLabel=""> | ||
<IconButton | ||
accessibilityLabel="Share this Pin" | ||
bgColor="white" | ||
icon="share" | ||
iconColor="darkGray" | ||
inline | ||
size="lg" | ||
/> | ||
</Tooltip> | ||
</Box> | ||
</ColorSchemeProvider> | ||
); | ||
} |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
// @flow strict | ||
import { type Node } from 'react'; | ||
import { Tooltip, IconButton, Box } from 'gestalt'; | ||
|
||
export default function Snapshot(): Node { | ||
return ( | ||
<Box color="white" padding={4} width={150}> | ||
<Tooltip idealDirection="right" inline text="Share" accessibilityLabel=""> | ||
<IconButton | ||
accessibilityLabel="Share this Pin" | ||
bgColor="white" | ||
icon="share" | ||
iconColor="darkGray" | ||
inline | ||
size="lg" | ||
/> | ||
</Tooltip> | ||
</Box> | ||
); | ||
} |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
// @flow strict | ||
import { type Node } from 'react'; | ||
import { Upsell, Box, ColorSchemeProvider, Icon } from 'gestalt'; | ||
|
||
export default function Snapshot(): Node { | ||
return ( | ||
<ColorSchemeProvider colorScheme="dark"> | ||
<Box color="white" padding={5}> | ||
<Upsell | ||
dismissButton={{ | ||
accessibilityLabel: 'Dismiss banner', | ||
onDismiss: () => {}, | ||
}} | ||
imageData={{ | ||
component: <Icon icon="pinterest" accessibilityLabel="" color="darkGray" size={32} />, | ||
}} | ||
message="Earn $60 of ads credit, and give $30 of ads credit to a friend" | ||
primaryAction={{ | ||
href: 'https://pinterest.com', | ||
label: 'Send invite', | ||
accessibilityLabel: 'Invite friend to use ads', | ||
target: 'blank', | ||
}} | ||
title="Give $30, get $60 in ads credit" | ||
/> | ||
</Box> | ||
</ColorSchemeProvider> | ||
); | ||
} |
Oops, something went wrong.