diff --git a/sandpack-react/rollup.config.js b/sandpack-react/rollup.config.js index c9733d88e..2bf131e74 100644 --- a/sandpack-react/rollup.config.js +++ b/sandpack-react/rollup.config.js @@ -29,7 +29,7 @@ const configBase = { commonjs({ requireReturnsDefault: "preferred" }), ], external: [ - 'react/jsx-runtime', + "react/jsx-runtime", ...Object.keys(pkg.dependencies), ...Object.keys(pkg.devDependencies), ...Object.keys(pkg.peerDependencies), diff --git a/sandpack-react/src/components/Tests/Header.tsx b/sandpack-react/src/components/Tests/Header.tsx index 1a93fea49..33d41c523 100644 --- a/sandpack-react/src/components/Tests/Header.tsx +++ b/sandpack-react/src/components/Tests/Header.tsx @@ -1,7 +1,7 @@ import * as React from "react"; import { css } from "../../styles"; -import { roundedButtonClassName, buttonClassName } from "../../styles/shared"; +import { buttonClassName, roundedButtonClassName } from "../../styles/shared"; import { classNames } from "../../utils/classNames"; import { ConsoleIcon } from "../icons"; @@ -34,6 +34,9 @@ interface Props { watchMode: boolean; setWatchMode: () => void; showSuitesOnly: boolean; + showVerboseButton: boolean; + showWatchButton: boolean; + hideTestsAndSupressLogs: boolean; } const buttonsClassName = classNames( @@ -51,6 +54,9 @@ export const Header: React.FC = ({ watchMode, setWatchMode, showSuitesOnly, + showWatchButton, + showVerboseButton, + hideTestsAndSupressLogs, }) => { return (
@@ -87,24 +93,28 @@ export const Header: React.FC = ({ Suite only )} - - + {showVerboseButton && ( + + )} + {showWatchButton && ( + + )}
); diff --git a/sandpack-react/src/components/Tests/SandpackTests.tsx b/sandpack-react/src/components/Tests/SandpackTests.tsx index 51978b476..3812847d4 100644 --- a/sandpack-react/src/components/Tests/SandpackTests.tsx +++ b/sandpack-react/src/components/Tests/SandpackTests.tsx @@ -58,6 +58,14 @@ export const SandpackTests: React.FC< watchMode?: boolean; onComplete?: (specs: Record) => void; actionsChildren?: JSX.Element; + showVerboseButton?: boolean; + showWatchButton?: boolean; + /** + * Hide the tests and supress logs + * If `true` the tests will be hidden and the logs will be supressed. This is useful when you want to run tests in the background and don't want to show the tests to the user. + * @default false + */ + hideTestsAndSupressLogs?: boolean; } & React.HtmlHTMLAttributes > = ({ verbose = false, @@ -66,6 +74,9 @@ export const SandpackTests: React.FC< className, onComplete, actionsChildren, + showVerboseButton = true, + showWatchButton = true, + hideTestsAndSupressLogs = false, ...props }) => { const theme = useSandpackTheme(); @@ -379,6 +390,7 @@ export const SandpackTests: React.FC<