[Question] Why `waitBrowserMetricsStable` before considering `scOpt.skip`?

[YutaUra]

Suppose you have a component that randomly changes its display every frame. For example, you could animate :tada: and If the behavior of the component is not deterministic and random numbers are used, VRT may want to skip it, but it may be useful for the UI catalog.

If the :tada: animation is an infinite loop, await win.waitBrowserMetricsStable(); will never be resolved because the display will always be changing. In this case, even if VRT is set to skip with skip: true, a timeout occurs and an error occurs.

https://github.com/reg-viz/storycap/blob/master/packages/storycap/src/client/trigger-screenshot.ts#L94-L97

[Quramy]

Storycap waits for waitBrowserMetricsStable because UI frameworks(e.g. React, Vue.js, ...) can mutate DOM asynchronously. And Storycap cannot get scOpt unless DOM is stable.

You should stop to loop infinite DOM update in screenshot context.

// your component or story

import { isScreenshot } from "storycap"

export default () => (
  !isScreenshot() ? <InfiniteUpdateComponent /> : <DummyComponent />
)

[YutaUra]

Hi, Quramy. Thanks for answering. I'll give it a try for now.