Using random data (faker)

[bfanger]

I've been using generated random data for my (storybook) stories.

faker-js generates realistic data, using 2 juli 2022 vs a 27 september 2022 in combination with John Doe vs a Mr. Adrienne Schowalter II affects how the components looks.

This highlights where we can tweak the component to make ik look nice for many circumstances.

When I use faker in histoire, it doesn't work as i'd expect.

<script lang="ts">
  import { faker } from "@faker-js/faker/locale/en";
  import type { Hst as Histoire } from "@histoire/plugin-svelte";

  export let Hst: Histoire;

  let title = faker.lorem.sentence();
</script>

<Hst.Story title="Example">
  <h1>{title}</h1>

  <svelte:fragment slot="controls">
    <Hst.Text title="title" bind:value={title} />
  </svelte:fragment>
</Hst.Story>

As the component is executed in both in the preview iframe and in the controls sidebar the value(s) of name are different.

Is there a solution for storing/syncing random state in a story?

[rasselbock]

Have you looked into initializing Faker with the same seed wherever it's being called from? https://fakerjs.dev/api/mersenne.html#seed