Function Fetcher

packages/xstate-solid/test/useActor.test.tsx:93–127

(props: {
    onFetch: () => Promise<any>;
    persistedState?: typeof persistedFetchState;
  })

  const persistedFetchState = actorRef.getPersistedSnapshot();

  const Fetcher = (props: {
    onFetch: () => Promise<any>;
    persistedState?: typeof persistedFetchState;
  }) => {
    const mergedProps = mergeProps(
      {
        onFetch: () => new Promise((res) => res('some data'))
      },
      props
    );
    const [snapshot, send] = useActor(
      fetchMachine.provide({
        actors: {
          fetchData: fromPromise(mergedProps.onFetch)
        }
      }),
      {
        snapshot: mergedProps.persistedState
      }
    );

    return (
      <Switch fallback={null}>
        <Match when={snapshot.matches('idle')}>
          <button onclick={(_) => send({ type: 'FETCH' })}>Fetch</button>;
        </Match>
        <Match when={snapshot.matches('loading')}>
          <div>Loading...</div>
        </Match>
        <Match when={snapshot.matches('success')}>
          Success! Data: <div data-testid="data">{snapshot.context.data}</div>
        </Match>
      </Switch>
    );
  };

  it('should work (default initial snapshot)', async () => {
    render(() => (