TestLens Enhancement

packages/app/src/components/workbench.ts

@@ -142,7 +142,7 @@ export class DevtoolsWorkbench extends Element {
         </section>
       </section>
       ${!this.#toolbarCollapsed ? this.#dragVertical.getSlider('z-[999] -mt-[5px] pointer-events-auto') : nothing}
-      <wdio-devtools-tabs cacheId="activeWorkbenchTab" class="relative z-10 border-t-[1px] border-t-panelBorder ${this.#toolbarCollapsed ? 'hidden' : ''} flex-1 min-h-0">
+      <wdio-devtools-tabs cacheId="activeWorkbenchTab" class="relative z-10 border-t-[1px] border-t-panelBorder ${this.#toolbarCollapsed ? 'hidden' : ''} flex-1 min-h-0 pb-10">
         <wdio-devtools-tab label="Source">
           <wdio-devtools-source></wdio-devtools-source>
         </wdio-devtools-tab>

packages/app/src/components/workbench/logs.ts

@@ -30,7 +30,6 @@ export class DevtoolsSource extends Element {
   connectedCallback(): void {
     super.connectedCallback()
     window.addEventListener('show-command', async (ev: CustomEvent) => {
-      this.closest('wdio-devtools-tabs')?.activateTab('Log')
       const command = ev.detail.command
       this.elapsedTime = ev.detail.elapsedTime
 
@@ -49,6 +48,11 @@ export class DevtoolsSource extends Element {
       }, {} as Record<string, CommandEndpoint>)
       this.#commandDefinition = endpoints[command.command]
       this.command = command
+
+      window.dispatchEvent(new CustomEvent('app-source-highlight', {
+        detail: this.command?.callSource
+      }))
+      this.closest('wdio-devtools-tabs')?.activateTab('Log')
     })
   }
 

packages/app/src/components/workbench/source.ts

@@ -41,19 +41,12 @@ export class DevtoolsSource extends Element {
   }
 
   #renderEditor (filePath: string, highlightLine?: number) {
-    if (!this.sources) {
-      return
-    }
-
+    if (!this.sources) return
     const source = this.sources[filePath]
-    if (!source) {
-      return
-    }
+    if (!source) return
 
     const container = this.shadowRoot?.querySelector('section') || this.shadowRoot?.querySelector('.cm-editor')
-    if (!container) {
-      return
-    }
+    if (!container) return
 
     const opts: EditorViewConfig = {
       root: this.shadowRoot!,
@@ -64,14 +57,13 @@ export class DevtoolsSource extends Element {
     const editorView = new EditorView(opts)
     container.replaceWith(editorView.dom)
 
-   // Use CodeMirror API to select and scroll to the target line (1-based index)
     if (highlightLine && highlightLine > 0) {
       try {
-        const lineInfo = editorView.state.doc.line(highlightLine) // 1-based
+        const lineInfo = editorView.state.doc.line(highlightLine)
         requestAnimationFrame(() => {
           editorView.dispatch({
             selection: { anchor: lineInfo.from },
-            effects: EditorView.scrollIntoView(lineInfo.from, { y: 'center' }) // center the line
+            effects: EditorView.scrollIntoView(lineInfo.from, { y: 'center' })
           })
         })
       } catch { /* ignore */ }

packages/app/src/controller/DataManager.ts

@@ -141,6 +141,14 @@ export class DataManagerController implements ReactiveController {
           ...this.consoleLogsContextProvider.value,
           ...data as string[]
         ])
+      }
+      else if (scope === 'sources') {
+        const merged = {
+          ...(this.sourcesContextProvider.value || {}),
+          ...(data as Record<string, string>)
+        }
+        this.sourcesContextProvider.setValue(merged)
+        console.debug('Merged sources keys', Object.keys(merged))
       } else {
         const provider = this[`${scope}ContextProvider`]
         provider.setValue(data as any)