Add delay to shore up snapshots (#3415)

iterative · Mar 7, 2023 · f18d98c · f18d98c
1 parent 8728e94
commit f18d98c
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 8 deletions.
diff --git a/webview/src/stories/Plots.stories.tsx b/webview/src/stories/Plots.stories.tsx
@@ -19,7 +19,10 @@ import comparisonPlotsFixture from 'dvc/src/test/fixtures/plotsDiff/comparison'
 import plotsRevisionsFixture from 'dvc/src/test/fixtures/plotsDiff/revisions'
 import smoothTemplatePlotContent from 'dvc/src/test/fixtures/plotsDiff/template/smoothTemplatePlot'
 import { truncateVerticalTitle } from 'dvc/src/plots/vega/util'
-import { CHROMATIC_VIEWPORTS, DISABLE_CHROMATIC_SNAPSHOTS } from './util'
+import {
+  CHROMATIC_VIEWPORTS_WITH_DELAY,
+  DISABLE_CHROMATIC_SNAPSHOTS
+} from './util'
 import { Plots } from '../plots/components/Plots'
 
 import './test-vscode-styles.scss'
@@ -99,7 +102,7 @@ const Template: Story<{
 }
 
 export const WithData = Template.bind({})
-WithData.parameters = CHROMATIC_VIEWPORTS
+WithData.parameters = CHROMATIC_VIEWPORTS_WITH_DELAY
 
 export const WithEmptyCheckpoints = Template.bind({})
 WithEmptyCheckpoints.args = {
@@ -213,7 +216,7 @@ AllLarge.args = {
     }
   }
 }
-AllLarge.parameters = CHROMATIC_VIEWPORTS
+AllLarge.parameters = CHROMATIC_VIEWPORTS_WITH_DELAY
 
 export const AllSmall = Template.bind({})
 AllSmall.args = {
@@ -235,7 +238,7 @@ AllSmall.args = {
     }
   }
 }
-AllSmall.parameters = CHROMATIC_VIEWPORTS
+AllSmall.parameters = CHROMATIC_VIEWPORTS_WITH_DELAY
 
 export const VirtualizedPlots = Template.bind({})
 VirtualizedPlots.args = {
@@ -252,7 +255,7 @@ VirtualizedPlots.args = {
     template: manyTemplatePlots(125)
   }
 }
-VirtualizedPlots.parameters = CHROMATIC_VIEWPORTS
+VirtualizedPlots.parameters = CHROMATIC_VIEWPORTS_WITH_DELAY
 
 export const ZoomedInPlot = Template.bind({})
 ZoomedInPlot.play = async ({ canvasElement }) => {
@@ -291,7 +294,10 @@ SmoothTemplate.args = {
   }
 }
 SmoothTemplate.parameters = {
-  chromatic: { ...CHROMATIC_VIEWPORTS.chromatic, disableSnapshot: true }
+  chromatic: {
+    ...CHROMATIC_VIEWPORTS_WITH_DELAY.chromatic,
+    disableSnapshot: true
+  }
 }
 
 export const ScrolledHeaders = Template.bind({})

diff --git a/webview/src/stories/util.ts b/webview/src/stories/util.ts
@@ -63,9 +63,10 @@ const viewportsWidths = Object.values(viewports)
   })
   .filter(Boolean)
 
-export const CHROMATIC_VIEWPORTS = {
-  chromatic: { viewports: viewportsWidths }
+export const CHROMATIC_VIEWPORTS_WITH_DELAY = {
+  chromatic: { delay: 500, viewports: viewportsWidths }
 }
+
 export const DISABLE_CHROMATIC_SNAPSHOTS = {
   chromatic: { disableSnapshot: true }
 }