skopix 2.0.43 → 2.0.45

package/cli/commands/dashboard.js

@@ -4149,18 +4149,32 @@ async function startStepTester(testerId, url, selector, mode, steps) {
 
     await ctx.exposeFunction('__skopixTesterRun', async ({ sel, action, value }) => {
       const result = await executeStepTesterAction(page, { selector: sel, action, value });
-      await page.evaluate((r, sel) => {
+      // Update toolbar via exposeFunction callback — more reliable than evaluate
+      await page.evaluate((passed, errMsg) => {
         const el = document.getElementById('__skopix_result');
-        if (el) el.textContent = r.passed ? '✓' : '✗';
+        if (el) {
+          el.textContent = passed ? '✓' : '✗';
+          el.style.color = passed ? '#34d399' : '#ef4444';
+        }
+      }, result.passed, result.error || '').catch(async () => {
+        // If evaluate fails (e.g. page navigated), wait and retry once
+        await new Promise(r => setTimeout(r, 500));
+        await page.evaluate((passed) => {
+          const el = document.getElementById('__skopix_result');
+          if (el) { el.textContent = passed ? '✓' : '✗'; el.style.color = passed ? '#34d399' : '#ef4444'; }
+        }, result.passed).catch(() => {});
+      });
+      // Highlight element
+      await page.evaluate((passed, sel) => {
         try {
           const target = document.querySelector(sel);
           if (target) {
             const orig = target.style.outline;
-            target.style.outline = r.passed ? '3px solid #34d399' : '3px solid #ef4444';
+            target.style.outline = passed ? '3px solid #34d399' : '3px solid #ef4444';
             setTimeout(() => { target.style.outline = orig; }, 1500);
           }
         } catch {}
-      }, result, sel);
+      }, result.passed, sel).catch(() => {});
     });
 
     await ctx.exposeFunction('__skopixTesterStop', async () => {
@@ -4170,6 +4184,8 @@ async function startStepTester(testerId, url, selector, mode, steps) {
   }
 
   if (url) await page.goto(url, { waitUntil: 'domcontentloaded', timeout: 30000 }).catch(() => {});
+  // Ensure toolbar is injected on first page (DOMContentLoaded may have already fired)
+  await page.evaluate(() => { if (window.__skopixTesterSelector !== undefined && !document.getElementById('__skopix_tester') && !document.getElementById('__skopix_preview')) { document.dispatchEvent(new Event('DOMContentLoaded')); } }).catch(() => {});
   stepTesterSessions.set(testerId, { browser, ctx, page });
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "skopix",
-  "version": "2.0.43",
+  "version": "2.0.45",
   "description": "Browser-based QA tool — record tests by using your app, replay them deterministically, generate Playwright code automatically",
   "main": "cli/index.js",
   "bin": {

package/web/app/index.html

@@ -5604,7 +5604,7 @@ function renderPendingSteps(steps) {
     return;
   }
 
-  section.style.display = '';
+  section.style.display = 'block';
   updatePendingBadge(steps.length);
   if (countLabel) countLabel.textContent = `${steps.length} element${steps.length > 1 ? 's' : ''} waiting`;
 
@@ -5631,6 +5631,7 @@ function renderPendingSteps(steps) {
 }
 
 async function loadLibraryView() {
+  await new Promise(r => setTimeout(r, 50)); // ensure view is visible
   const [steps, pending] = await Promise.all([fetchLibrarySteps(), fetchPendingSteps()]);
   populateLibraryTagFilter();
   renderPendingSteps(pending);