Update tests

Author: TaiSakuma

src/utils/monaco-editor/__tests__/editor.spec.ts

@@ -1,33 +1,87 @@
 import { describe, it, expect } from "vitest";
-import { ref, nextTick } from "vue";
+import { ref, nextTick, unref, isRef } from "vue";
+import type { Ref } from "vue";
+
+import fc from "fast-check";
 
 import { withAsyncSetup } from "@/tests/test-utils";
 import { useMonacoEditor } from "..";
 
-describe("useMonacoEditor()", () => {
-  it("Editor is created", async () => {
-    let result!: Awaited<ReturnType<typeof useMonacoEditor>>;
-    const element = ref(document.createElement("div"));
-    const source = ref("# Hello, world!");
-    await withAsyncSetup(async () => {
-      result = await useMonacoEditor({ element, source });
-    });
-    const { editor, model } = result;
-    expect(editor.value).toBeDefined();
-    expect(model.value?.getValue()).toBe("# Hello, world!");
+import { fcSource, fcLanguage } from "./model.spec";
+
+const fcElement = () =>
+  fc
+    .oneof(
+      fc.integer().map(() => document.createElement("div")),
+      fc.constant(undefined)
+    )
+    .chain(
+      (element): fc.Arbitrary<HTMLElement | Ref<HTMLElement | undefined>> =>
+        element === undefined
+          ? fc.constant(ref(element))
+          : fc.oneof(fc.constant(element), fc.constant(ref(element)))
+    );
+
+const fcMode = () =>
+  fc.option(fc.constantFrom("viewer" as const, "editor" as const), { nil: undefined });
+
+const fcUseMonacoEditorOptions = () =>
+  fc.record(
+    {
+      element: fcElement(),
+      mode: fcMode(),
+      source: fcSource(),
+      language: fcLanguage(),
+    },
+    { requiredKeys: ["element"] }
+  );
+
+describe("fcUseMonacoEditorOptions()", () => {
+  it("Options of useMonacoEditor() are generated", () => {
+    fc.assert(
+      fc.property(fcUseMonacoEditorOptions(), (options) => {
+        expect(options).toBeDefined();
+        return true;
+      })
+    );
   });
+});
 
-  it("The 'ready' is awaited", async () => {
-    let result!: ReturnType<typeof useMonacoEditor>;
-    const element = ref(document.createElement("div"));
-    const source = ref("# Hello, world!");
-    await withAsyncSetup(async () => {
-      result = useMonacoEditor({ element, source });
-    });
-    const { editor, model, ready } = result;
-    await ready;
-    expect(editor.value).toBeDefined();
-    expect(model.value?.getValue()).toBe("# Hello, world!");
+describe("useMonacoEditor()", () => {
+  it("Property test", async () => {
+    await fc.assert(
+      fc.asyncProperty(
+        fcUseMonacoEditorOptions(),
+        fc.boolean(),
+        async (options, early) => {
+          let editor!: ReturnType<typeof useMonacoEditor>["editor"];
+          let model!: ReturnType<typeof useMonacoEditor>["model"];
+          let source!: ReturnType<typeof useMonacoEditor>["source"];
+          let mode!: ReturnType<typeof useMonacoEditor>["mode"];
+          let ready!: ReturnType<typeof useMonacoEditor>["ready"];
+          const { wrapper } = await withAsyncSetup(async () => {
+            ({ editor, model, source, mode, ready } = early
+              ? useMonacoEditor(options)
+              : await useMonacoEditor(options));
+          });
+          if (early) await ready;
+          if (isRef(options.element) && options.element.value === undefined) {
+            options.element.value = document.createElement("div");
+          }
+          await nextTick();
+          expect(editor.value).toBeDefined();
+
+          const expectedSource = unref(options.source) ?? "";
+          expect(source.value).toBe(expectedSource);
+          expect(model.value?.getValue()).toBe(expectedSource);
+
+          const expectedMode = unref(options.mode) ?? "viewer";
+          expect(mode.value).toBe(expectedMode);
+
+          wrapper.unmount();
+        }
+      )
+    );
   });
 
   it("The mode changes between 'viewer' and 'editor'", async () => {

src/utils/monaco-editor/__tests__/model.spec.ts

@@ -11,7 +11,7 @@ const fcText = () =>
     size: "max",
   });
 
-const fcSource = () =>
+export const fcSource = () =>
   fc.option(
     fc.oneof(
       fcText().map((lines) => lines.join("\n")),
@@ -20,12 +20,12 @@ const fcSource = () =>
     { nil: undefined }
   );
 
-const fcLanguage = () =>
+export const fcLanguage = () =>
   fc.option(fc.constantFrom("python", "typescript"), {
     nil: undefined,
   });
 
-const fcUseModelOptions = () =>
+export const fcUseModelOptions = () =>
   fc.record(
     {
       source: fcSource(),