refactor: address comments.

Author: knightedcodemonkey

playwright/app.spec.ts

@@ -344,10 +344,10 @@ test('clearing component source reports clear action without error status', asyn
   await expect(dialog).toHaveAttribute('open', '')
   await dialog.getByRole('button', { name: 'Clear' }).click()
 
+  await expect(page.locator('#preview-host button')).toHaveCount(0)
+  await expect(page.locator('#preview-host pre')).toHaveCount(0)
   await expect(page.locator('#status')).toHaveText('Component cleared')
   await expect(page.locator('#status')).toHaveClass(/status--neutral/)
-  await expect(page.locator('#preview-host pre')).toHaveCount(0)
-  await expect(page.locator('#preview-host button')).toHaveCount(0)
 })
 
 test('jsx syntax errors affect status but not diagnostics toggle severity', async ({

src/app.js

@@ -472,7 +472,7 @@ const clearComponentSource = () => {
   clearDiagnosticsScope('component')
   typeDiagnostics.clearTypeDiagnosticsState()
   setStatus('Component cleared', 'neutral')
-  maybeRender()
+  renderRuntime.clearPreview()
 }
 
 const clearStylesSource = () => {

src/modules/render-runtime.js

@@ -548,13 +548,24 @@ export const createRenderRuntimeController = ({
     }
   }
 
+  const hasComponentSource = () => getJsxSource().trim().length > 0
+
+  const clearPreview = () => {
+    const target = getRenderTarget()
+    clearTarget(target)
+  }
+
   const renderDom = async () => {
     const { jsx } = await ensureCoreRuntime()
     const target = getRenderTarget()
     clearTarget(target)
     const compiledStyles = await compileStyles()
     applyStyles(target, compiledStyles.css)
 
+    if (!hasComponentSource()) {
+      return
+    }
+
     const renderFn = await evaluateUserModule()
     const output = renderFn ? renderFn(jsx) : null
     if (isDomNode(output)) {
@@ -577,6 +588,10 @@ export const createRenderRuntimeController = ({
     const compiledStyles = await compileStyles()
     applyStyles(target, compiledStyles.css)
 
+    if (!hasComponentSource()) {
+      return
+    }
+
     const { reactJsx, createRoot, React } = await ensureReactRuntime()
     const renderFn = await evaluateUserModule({ jsx: reactJsx, reactJsx, React })
     if (!renderFn) {
@@ -635,6 +650,7 @@ export const createRenderRuntimeController = ({
   }
 
   return {
+    clearPreview,
     renderPreview,
     scheduleRender,
     setStyleCompiling,