refactor: move fs API methods to own class

Author: AriPerkkio

src/fixtures/file-system.ts

@@ -0,0 +1,67 @@
+import { commands } from "@vitest/browser/context";
+import type {
+  FileSystemTree,
+  BufferEncoding,
+  WebContainer,
+} from "@webcontainer/api";
+
+export class FileSystem {
+  /** @internal */
+  protected get _instance(): WebContainer {
+    throw new Error("_instance should be overwritte");
+  }
+
+  /**
+   * Mount file directory into WebContainer.
+   * `string` arguments are considered paths that are relative to [`root`](https://vitest.dev/config/#root)
+   */
+  async mount(filesOrPath: string | FileSystemTree) {
+    if (typeof filesOrPath === "string") {
+      filesOrPath = await commands.readDirectory(filesOrPath);
+    }
+
+    return await this._instance.mount(filesOrPath as FileSystemTree);
+  }
+
+  /**
+   * WebContainer's [`readFile`](https://webcontainers.io/guides/working-with-the-file-system#readfile) method.
+   */
+  async readFile(path: string, encoding: BufferEncoding = "utf8") {
+    return this._instance.fs.readFile(path, encoding);
+  }
+
+  /**
+   * WebContainer's [`writeFile`](https://webcontainers.io/guides/working-with-the-file-system#writefile) method.
+   */
+  async writeFile(path: string, data: string, encoding = "utf8") {
+    return this._instance.fs.writeFile(path, data, { encoding });
+  }
+
+  /**
+   * WebContainer's [`rename`](https://webcontainers.io/guides/working-with-the-file-system#rename) method.
+   */
+  async rename(oldPath: string, newPath: string) {
+    return this._instance.fs.rename(oldPath, newPath);
+  }
+
+  /**
+   * WebContainer's [`mkdir`](https://webcontainers.io/guides/working-with-the-file-system#mkdir) method.
+   */
+  async mkdir(path: string) {
+    return this._instance.fs.mkdir(path);
+  }
+
+  /**
+   * WebContainer's [`readdir`](https://webcontainers.io/guides/working-with-the-file-system#readdir) method.
+   */
+  async readdir(path: string) {
+    return this._instance.fs.readdir(path);
+  }
+
+  /**
+   * WebContainer's [`rm`](https://webcontainers.io/guides/working-with-the-file-system#rm) method.
+   */
+  async rm(path: string) {
+    return this._instance.fs.rm(path);
+  }
+}

src/fixtures/webcontainer.ts

@@ -1,11 +1,7 @@
-import { commands } from "@vitest/browser/context";
-import {
-  type BufferEncoding,
-  type FileSystemTree,
-  WebContainer as WebContainerApi,
-} from "@webcontainer/api";
-
-export class WebContainer {
+import { WebContainer as WebContainerApi } from "@webcontainer/api";
+import { FileSystem } from "./file-system";
+
+export class WebContainer extends FileSystem {
   /** @internal */
   private _instancePromise?: WebContainerApi;
 
@@ -16,12 +12,15 @@ export class WebContainer {
   private _onExit: (() => Promise<unknown>)[] = [];
 
   constructor() {
+    super();
+
     this._isReady = WebContainerApi.boot({}).then((instance) => {
       this._instancePromise = instance;
     });
   }
 
-  private get _instance(): WebContainerApi {
+  /** @internal */
+  protected get _instance(): WebContainerApi {
     if (!this._instancePromise) {
       throw new Error(
         "Webcontainer is not yet ready, make sure to call wait() after creation",
@@ -43,18 +42,6 @@ export class WebContainer {
     });
   }
 
-  /**
-   * Mount file directory into WebContainer.
-   * `string` arguments are considered paths that are relative to [`root`](https://vitest.dev/config/#root)
-   */
-  async mount(filesOrPath: string | FileSystemTree) {
-    if (typeof filesOrPath === "string") {
-      filesOrPath = await commands.readDirectory(filesOrPath);
-    }
-
-    return await this._instance.mount(filesOrPath as FileSystemTree);
-  }
-
   /** @internal */
   async teardown() {
     await Promise.all(this._onExit.map((fn) => fn()));
@@ -97,46 +84,4 @@ export class WebContainer {
 
     return output.trim();
   }
-
-  /**
-   * WebContainer's [`readFile`](https://webcontainers.io/guides/working-with-the-file-system#readfile) method.
-   */
-  async readFile(path: string, encoding: BufferEncoding = "utf8") {
-    return this._instance.fs.readFile(path, encoding);
-  }
-
-  /**
-   * WebContainer's [`writeFile`](https://webcontainers.io/guides/working-with-the-file-system#writefile) method.
-   */
-  async writeFile(path: string, data: string, encoding = "utf8") {
-    return this._instance.fs.writeFile(path, data, { encoding });
-  }
-
-  /**
-   * WebContainer's [`rename`](https://webcontainers.io/guides/working-with-the-file-system#rename) method.
-   */
-  async rename(oldPath: string, newPath: string) {
-    return this._instance.fs.rename(oldPath, newPath);
-  }
-
-  /**
-   * WebContainer's [`mkdir`](https://webcontainers.io/guides/working-with-the-file-system#mkdir) method.
-   */
-  async mkdir(path: string) {
-    return this._instance.fs.mkdir(path);
-  }
-
-  /**
-   * WebContainer's [`readdir`](https://webcontainers.io/guides/working-with-the-file-system#readdir) method.
-   */
-  async readdir(path: string) {
-    return this._instance.fs.readdir(path);
-  }
-
-  /**
-   * WebContainer's [`rm`](https://webcontainers.io/guides/working-with-the-file-system#rm) method.
-   */
-  async rm(path: string) {
-    return this._instance.fs.rm(path);
-  }
 }