feat(packages/sui-studio): Disable Test component if detect jest folder

SUI-Components · Jun 7, 2024 · 04ba88f · 04ba88f
1 parent 7f98fa7
commit 04ba88f
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 11 deletions.
diff --git a/packages/sui-studio/bin/sui-studio-dev.js b/packages/sui-studio/bin/sui-studio-dev.js
@@ -55,7 +55,10 @@ const {cache, ...others} = config
 const studioDevConfig = {
   ...others,
   context: path.join(__dirname, '..', 'workbench', 'src'),
-  plugins: [...config.plugins, new webpack.DefinePlugin({__COMPONENT_ID__: JSON.stringify(componentID)})],
+  plugins: [
+    ...config.plugins,
+    new webpack.DefinePlugin({__COMPONENT_ID__: JSON.stringify(componentID), __DISABLE_TESTS__: isJestTest})
+  ],
   resolve: {
     ...config.resolve,
     alias: {

diff --git a/packages/sui-studio/workbench/src/components/Root/index.js b/packages/sui-studio/workbench/src/components/Root/index.js
@@ -1,3 +1,4 @@
+/* eslint-disable no-undef */
 import {useState} from 'react'
 
 import PropTypes from 'prop-types'
@@ -7,7 +8,10 @@ import Select from '../Select/index'
 import Test from '../Suite/index'
 
 const importComponent = () => import('component/index')
-const importTest = () => import('test/index.test')
+let importTest = null
+if (!__DISABLE_TESTS__) {
+  importTest = () => import('test/index.test')
+}
 
 const getFromStorage = (key, defaultValue) => window.sessionStorage[key] || defaultValue
 
@@ -38,19 +42,23 @@ export default function Root({componentID, contexts = {}, themes}) {
           initValue={actualStyle}
           onChange={updateOnChange(setActualStyle, 'actualStyle')}
         />
-        <button
-          className="Root-testSwitch"
-          onClick={() => {
-            updateOnChange(setShowTests, 'showTests')(showTests === 'show' ? 'hide' : 'show')
-          }}
-        >
-          {showTests === 'show' ? 'Close Tests' : 'Open Tests'}
-        </button>
+        {importTest ? (
+          <button
+            className="Root-testSwitch"
+            onClick={() => {
+              updateOnChange(setShowTests, 'showTests')(showTests === 'show' ? 'hide' : 'show')
+            }}
+          >
+            {showTests === 'show' ? 'Close Tests' : 'Open Tests'}
+          </button>
+        ) : null}
       </Header>
 
       <iframe src={iframeSrc} scrolling="yes" title="Demo" />
       <div className="Root-test" hidden={showTests === 'hide'}>
-        <Test open contexts={contexts} importComponent={importComponent} importTest={importTest} />
+        {importTest ? (
+          <Test open contexts={contexts} importComponent={importComponent} importTest={importTest} />
+        ) : null}
       </div>
     </div>
   )