Add loadProject store test

Author: microbit-grace

src/__mocks__/zustand.ts

@@ -0,0 +1,57 @@
+// Copied from https://zustand.docs.pmnd.rs/guides/testing#jest
+// __mocks__/zustand.ts
+import * as zustand from "zustand";
+import { act } from "@testing-library/react";
+
+const { create: actualCreate, createStore: actualCreateStore } =
+  jest.requireActual<typeof zustand>("zustand");
+
+// a variable to hold reset functions for all stores declared in the app
+export const storeResetFns = new Set<() => void>();
+
+const createUncurried = <T>(stateCreator: zustand.StateCreator<T>) => {
+  const store = actualCreate(stateCreator);
+  const initialState = store.getInitialState();
+  storeResetFns.add(() => {
+    store.setState(initialState, true);
+  });
+  return store;
+};
+
+// when creating a store, we get its initial state, create a reset function and add it in the set
+export const create = (<T>(stateCreator: zustand.StateCreator<T>) => {
+  console.log("zustand create mock");
+
+  // to support curried version of create
+  return typeof stateCreator === "function"
+    ? createUncurried(stateCreator)
+    : createUncurried;
+}) as typeof zustand.create;
+
+const createStoreUncurried = <T>(stateCreator: zustand.StateCreator<T>) => {
+  const store = actualCreateStore(stateCreator);
+  const initialState = store.getInitialState();
+  storeResetFns.add(() => {
+    store.setState(initialState, true);
+  });
+  return store;
+};
+
+// when creating a store, we get its initial state, create a reset function and add it in the set
+export const createStore = (<T>(stateCreator: zustand.StateCreator<T>) => {
+  console.log("zustand createStore mock");
+
+  // to support curried version of createStore
+  return typeof stateCreator === "function"
+    ? createStoreUncurried(stateCreator)
+    : createStoreUncurried;
+}) as typeof zustand.createStore;
+
+// reset all stores after each test run
+afterEach(() => {
+  act(() => {
+    storeResetFns.forEach((resetFn) => {
+      resetFn();
+    });
+  });
+});

src/store.test.ts

@@ -0,0 +1,50 @@
+import { act, renderHook } from "@testing-library/react";
+import { useStore } from "./store";
+import { Project } from "@microbit/makecode-embed/react";
+import { makecodeIcons } from "./utils/icons";
+import { GestureData } from "./model";
+
+const projectHeader = {
+  target: "microbit",
+  targetVersion: "7.0.42",
+  editor: "blocksprj",
+  name: "Simple AI exercise timer",
+  meta: {},
+  pubId: "",
+  pubCurrent: false,
+  id: "f102d806-f767-45c6-3af3-35b3be9dbdcd",
+  recentUse: 1728049865,
+  modificationTime: 1728049865,
+  path: "Simple-AI-exercise-timer",
+  cloudCurrent: false,
+  saveId: null,
+  githubCurrent: false,
+  _rev: "",
+  isDeleted: false,
+  cloudVersion: "",
+  cloudLastSyncTime: 1,
+};
+
+const gestureData = [
+  { name: "action1", ID: 1, icon: makecodeIcons.Heart, recordings: [] },
+  { name: "action2", ID: 2, icon: makecodeIcons.House, recordings: [] },
+] as GestureData[];
+
+const sampleProject: Project = {
+  header: projectHeader,
+  text: {
+    "README.md": "",
+    "autogenerated.ts": "",
+    "dataset.json": JSON.stringify({ data: gestureData }),
+  },
+};
+
+describe("loadProject", () => {
+  test("imports gesture data", () => {
+    const { result } = renderHook(() => useStore());
+    act(() => result.current.loadProject(sampleProject));
+
+    expect(result.current.gestures.length).toEqual(gestureData.length);
+    expect(result.current.model).toEqual(undefined);
+  });
+});