tests

codesandbox · Feb 1, 2022 · dac3a1f · dac3a1f
1 parent 6fe9f09
commit dac3a1f
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 17 deletions.
diff --git a/sandpack-react/src/presets/Sandpack.stories.tsx b/sandpack-react/src/presets/Sandpack.stories.tsx
@@ -1,12 +1,6 @@
 import React from "react";
 
-import {
-  SandpackProvider,
-  SandpackLayout,
-  SandpackCodeEditor,
-  SandpackPreview,
-  Sandpack,
-} from "../";
+import { Sandpack } from "../";
 
 export default {
   title: "presets/Sandpack: options",

diff --git a/sandpack-react/src/types.ts b/sandpack-react/src/types.ts
@@ -13,17 +13,15 @@ import type { CodeEditorProps } from ".";
 
 export interface SandpackOptions {
   /**
-   * TODO: Editor state - docs
+   * List the file path listed in the file tab,
+   * which will allow the user to interact with.
    */
   openPaths?: string[];
-  /**
-   * TODO: Editor state -docs
-   */
-  activePath?: string;
 
   /**
-   * Execution and recompile
+   * Path to the file will be open in the code editor when the component mounts
    */
+  activePath?: string;
 
   /**
    * This provides a way to control how some components are going to

diff --git a/sandpack-react/src/utils/sandpackUtils.test.ts b/sandpack-react/src/utils/sandpackUtils.test.ts
@@ -179,6 +179,35 @@ describe(getSandpackStateFromProps, () => {
     expect(setup.openPaths.sort()).toEqual(["/App.js"]);
   });
 
+  /**
+   * Files - openPaths - activePath
+   */
+  test("openPaths override the files configurations", () => {
+    const setup = getSandpackStateFromProps({
+      files: {
+        A: { hidden: true, code: "" },
+        B: { hidden: true, code: "" },
+      },
+      customSetup: { entry: "A" },
+      options: { openPaths: ["A", "B"] },
+    });
+
+    expect(setup.openPaths).toEqual(["A", "B"]);
+  });
+
+  test("activePath override the files configurations", () => {
+    const setup = getSandpackStateFromProps({
+      files: {
+        A: { active: true, code: "" },
+        B: { code: "" },
+      },
+      customSetup: { entry: "A" },
+      options: { activePath: "B" },
+    });
+
+    expect(setup.activePath).toEqual("B");
+  });
+
   /**
    * entry file
    */

diff --git a/sandpack-react/src/utils/sandpackUtils.ts b/sandpack-react/src/utils/sandpackUtils.ts
@@ -22,12 +22,9 @@ type SandpackContextInfo = Pick<
 export const getSandpackStateFromProps = (
   props: SandpackProviderProps
 ): SandpackContextInfo => {
-  const internalTemplate =
-    typeof props.template === "string" ? props.template : undefined;
-
   // Merge predefined template with custom setup
   const projectSetup = getSetup({
-    template: internalTemplate,
+    template: props.template,
     customSetup: props.customSetup,
     files: props.files,
   });