refactor: cleaned up showOpenFilePicker mock

tests/load_workspace.spec.ts

@@ -1,5 +1,5 @@
 import { FileChooser, expect, test } from "@playwright/test";
-import { goToHomePage, setNextOpenedFile } from "./utils";
+import { goToHomePage, mockShowOpenFilePicker } from "./utils";
 
 test.beforeEach(goToHomePage);
 
@@ -16,7 +16,7 @@ for (let [testName, file] of test_files) {
 		await page.getByRole("button", { name: "My projects" }).click();
 
 		// Playwright doesn't seem to support `showOpenFilePicker()` so mock it
-		let createOnWritePromise = await setNextOpenedFile(
+		let createOnWritePromise = await mockShowOpenFilePicker(
 			page,
 			`./tests/saved_workspaces/${file}`,
 		);
@@ -41,8 +41,7 @@ for (let [testName, file] of test_files) {
 
 		let onWritePromise = createOnWritePromise();
 		await page.getByRole("cell", { name: "Save", exact: true }).click();
-		let written = await onWritePromise;
-
-		expect(written).toContain("leaphy_serial_print_line"); // check that it contains the print
+		let writtenChunks = await onWritePromise;
+		expect(JSON.stringify(writtenChunks)).toContain("hello world"); // This is very hacky, but it works
 	});
 }

tests/utils.ts

@@ -14,66 +14,63 @@ export async function openExample(page: Page, example: string | RegExp) {
 }
 
 // Playwright doesn't seem to support `showOpenFilePicker()` so this functions mocks it
-export async function setNextOpenedFile(
+export async function mockShowOpenFilePicker(
 	page: Page,
 	path: string,
-): Promise<(timeout?: number) => Promise<string>> {
+): Promise<Promise<(timeout?: number) => Promise<FileSystemWriteChunkType[]>>> {
 	let content = await fs.readFile(path, "utf-8");
 
-	let onWriteResolve: ((data: string) => void) | undefined = undefined;
-
-	await page.exposeFunction("onWriteOpenedFile", (data: string) => {
-		if (onWriteResolve !== undefined) {
-			onWriteResolve(data);
-		}
-	});
-
 	await page.evaluate(
-		([content, file_name]) => {
-			window.showOpenFilePicker = async (): Promise<[FileSystemFileHandle]> => {
-				// return something close enough to what a [FileSystemFileHandle] looks like, as you can't actually create it, atleast i could not find it
-				return [
-					{
-						getFile: async () => {
-							return {
-								text: async () => content,
-								name: file_name,
-							};
-						},
-						createWritable: async () => {
-							let written = "";
+		([content, path]) => {
+			const blob = new Blob([content], { type: "application/json" });
+			const file = new File([blob], path, { type: "application/json" });
 
-							return {
-								write: async (data: FileSystemWriteChunkType) => {
-									// There has to be a better way right??
-									if (typeof data === "string") {
-										throw "todo";
-									}
-									if ("data" in data && typeof data.data === "string") {
-										written += data.data;
-									} else {
-										throw "todo";
-									}
-								},
-								close: async () => {
-									await (window as any).onWriteOpenedFile(written);
-								},
-							};
-						},
-						name: file_name,
+			const createWritable = async () => {
+				let writtenChunks: FileSystemWriteChunkType[] = [];
+				return {
+					write: async (data: FileSystemWriteChunkType) => {
+						writtenChunks.push(data);
+					},
+					close: async () => {
+						await (window as any).onWriteOpenedFile(writtenChunks);
 					},
-				] as unknown as [FileSystemFileHandle];
+				};
+			};
+
+			const fileHandle = {
+				getFile: async () => file,
+				name: path,
+				createWritable,
+			};
+
+			(window as any).showOpenFilePicker = async () => {
+				return [fileHandle];
 			};
 		},
 		[content, path],
 	);
 
-	return (timeout = 1000) => {
-		return new Promise<string>((resolve, reject) => {
+	let createOnWritePromise = async (timeout = 1000) => {
+		let onWriteResolve:
+			| ((writtenChunks: FileSystemWriteChunkType[]) => void)
+			| undefined = undefined;
+
+		await page.exposeFunction(
+			"onWriteOpenedFile",
+			(writtenChunks: FileSystemWriteChunkType[]) => {
+				if (onWriteResolve !== undefined) {
+					onWriteResolve(writtenChunks);
+				}
+			},
+		);
+
+		return new Promise<FileSystemWriteChunkType[]>((resolve, reject) => {
 			onWriteResolve = resolve;
 			setTimeout(() => {
 				reject("File not written within time!");
 			}, timeout);
 		});
 	};
+
+	return createOnWritePromise;
 }