From 8220f0672a876b18f0a7c9a549c229b83d897e6c Mon Sep 17 00:00:00 2001
From: Ankit Singh <singhankit@singhank-ltmg4lv.internal.salesforce.com>
Date: Mon, 9 Feb 2026 15:26:32 +0530
Subject: [PATCH 1/2] feat: consume error-page template from
 @salesforce/webapp-experimental/proxy @W-21111977@

Update plugin-webapp to import the error page HTML template from the
@salesforce/webapp-experimental proxy package instead of bundling it locally.

Migration changes:
- ErrorPageRenderer now uses getErrorPageTemplate() from @salesforce/webapp-experimental/proxy
- Removed local error-page.html template (now lives in webapps package)
- Removed scripts/copy-templates.cjs (no longer needed)
- Removed postbuild script from package.json
- Bumped @salesforce/webapp-experimental dependency to ^1.17.0

Bug fixes included:
- DevServerManager: emit DevServerError directly instead of wrapping in SfError,
  so the proxy can display the "Dev Server Error" page when dev server crashes
- ProxyServer: add socket error handler to prevent ECONNRESET from crashing the
  proxy when dev server dies mid-connection

Depends on: salesforce-experience-platform-emu/webapps PR for @W-21111977@

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 package.json                       |   1 -
 scripts/copy-templates.cjs         |  31 --
 src/proxy/ProxyServer.ts           |   5 +
 src/server/DevServerManager.ts     |   9 +-
 src/templates/ErrorPageRenderer.ts |  46 +-
 src/templates/error-page.html      | 749 -----------------------------
 6 files changed, 38 insertions(+), 803 deletions(-)
 delete mode 100644 scripts/copy-templates.cjs
 delete mode 100644 src/templates/error-page.html

diff --git a/package.json b/package.json
index 303a9d5..f8eb28b 100644
--- a/package.json
+++ b/package.json
@@ -78,7 +78,6 @@
     "format": "wireit",
     "link-check": "wireit",
     "lint": "wireit",
-    "postbuild": "node scripts/copy-templates.cjs",
     "postpack": "sf-clean --ignore-signing-artifacts",
     "prepack": "sf-prepack",
     "prepare": "sf-install",
diff --git a/scripts/copy-templates.cjs b/scripts/copy-templates.cjs
deleted file mode 100644
index 7d21f0e..0000000
--- a/scripts/copy-templates.cjs
+++ /dev/null
@@ -1,31 +0,0 @@
-#!/usr/bin/env node
-/*
- * Cross-platform script to copy HTML templates from src to lib.
- * Used by postbuild to ensure templates are available at runtime.
- */
-
-const fs = require('fs');
-const path = require('path');
-
-const srcDir = path.join(__dirname, '..', 'src', 'templates');
-const destDir = path.join(__dirname, '..', 'lib', 'templates');
-
-// Create destination directory if it doesn't exist
-fs.mkdirSync(destDir, { recursive: true });
-
-// Copy all HTML files
-const htmlFiles = fs.readdirSync(srcDir).filter(f => f.endsWith('.html'));
-
-if (htmlFiles.length === 0) {
-  console.log('No HTML templates found to copy.');
-  process.exit(0);
-}
-
-htmlFiles.forEach(file => {
-  const srcPath = path.join(srcDir, file);
-  const destPath = path.join(destDir, file);
-  fs.copyFileSync(srcPath, destPath);
-  console.log(`Copied: ${file}`);
-});
-
-console.log(`Successfully copied ${htmlFiles.length} template(s) to lib/templates/`);
diff --git a/src/proxy/ProxyServer.ts b/src/proxy/ProxyServer.ts
index d184689..6c91c99 100644
--- a/src/proxy/ProxyServer.ts
+++ b/src/proxy/ProxyServer.ts
@@ -176,6 +176,11 @@ export class ProxyServer extends EventEmitter {
 
         this.server.on('connection', (socket) => {
           this.activeConnections.add(socket);
+          socket.on('error', (err) => {
+            // Handle ECONNRESET and other socket errors gracefully
+            // These can happen when the dev server crashes or a client disconnects abruptly
+            this.logger.debug(`Socket error (${err.message}), cleaning up connection`);
+          });
           socket.once('close', () => {
             this.activeConnections.delete(socket);
           });
diff --git a/src/server/DevServerManager.ts b/src/server/DevServerManager.ts
index bbbe344..1c55a6f 100644
--- a/src/server/DevServerManager.ts
+++ b/src/server/DevServerManager.ts
@@ -429,11 +429,10 @@ export class DevServerManager extends EventEmitter {
       this.logger.error(`Dev server error: ${parsedError.title}`);
       this.logger.debug(`Error type: ${parsedError.type}`);
 
-      // Convert to SfError for proper error handling
-      // Use just the message (not title) since title will be shown separately
-      const sfError = new SfError(parsedError.message, 'DevServerError', parsedError.suggestions);
-
-      this.emit('error', sfError);
+      // Emit the parsed DevServerError directly so the receiver (dev.ts)
+      // can access stderrLines, title, and type for the error page.
+      // Previously this was wrapped in SfError which lost those properties.
+      this.emit('error', parsedError);
     }
 
     // Reset state
diff --git a/src/templates/ErrorPageRenderer.ts b/src/templates/ErrorPageRenderer.ts
index d042ecc..3397d89 100644
--- a/src/templates/ErrorPageRenderer.ts
+++ b/src/templates/ErrorPageRenderer.ts
@@ -14,11 +14,32 @@
  * limitations under the License.
  */
 
-import { readFileSync } from 'node:fs';
-import { join, dirname } from 'node:path';
-import { fileURLToPath } from 'node:url';
+// Use namespace import to avoid TS2305 when getErrorPageTemplate is not yet
+// available in the published version.  The function is added by the W-21111977
+// migration in @salesforce/webapp-experimental.  Once a version that includes
+// it is published, the runtime check below will pick it up automatically.
+import * as proxyExports from '@salesforce/webapp-experimental/proxy';
 import type { DevServerError } from '../config/types.js';
 
+/**
+ * Load the error page template from @salesforce/webapp-experimental/proxy.
+ * Returns null when the installed version does not yet export the function.
+ */
+function loadProxyTemplate(): string | null {
+  try {
+    const mod = proxyExports as unknown as Record<string, unknown>;
+    const fn = mod['getErrorPageTemplate'];
+    if (typeof fn === 'function') {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+      const result = fn();
+      if (typeof result === 'string') return result;
+    }
+  } catch {
+    // Function not available in the installed version
+  }
+  return null;
+}
+
 export type ErrorPageData = {
   status: string;
   devServerUrl: string;
@@ -37,18 +58,7 @@ export class ErrorPageRenderer {
   private template: string;
 
   public constructor() {
-    // Load the HTML template
-    const currentDir = dirname(fileURLToPath(import.meta.url));
-    const templatePath = join(currentDir, 'error-page.html');
-
-    try {
-      this.template = readFileSync(templatePath, 'utf-8');
-    } catch (error) {
-      // Log warning but don't crash - use minimal fallback template
-      // eslint-disable-next-line no-console
-      console.error(`[ErrorPageRenderer] Failed to load template from ${templatePath}:`, error);
-      this.template = ErrorPageRenderer.getMinimalFallbackTemplate();
-    }
+    this.template = loadProxyTemplate() ?? ErrorPageRenderer.getMinimalFallbackTemplate();
   }
 
   /**
@@ -79,10 +89,12 @@ export class ErrorPageRenderer {
     <div class="info">
       {{MESSAGE_CONTENT}}
       <p><strong>Dev Server:</strong> <code>{{DEV_SERVER_URL}}</code></p>
-      <p><strong>Proxy:</strong> <code>{{PROXY_URL}}</code></p>
+      <p><strong>Proxy:</strong> <code>{{PROXY_URL}}</code> (port {{PROXY_PORT}})</p>
+      <p><strong>Org:</strong> <code>{{ORG_TARGET}}</code></p>
+      <p><strong>Script:</strong> <code>{{WORKSPACE_SCRIPT}}</code></p>
       <p><strong>Last Check:</strong> {{LAST_CHECK_TIME}}</p>
     </div>
-    <p style="color:#888;font-size:14px;">{{AUTO_REFRESH_TEXT}}</p>
+    <p style="color:#888;font-size:14px;" class="{{AUTO_REFRESH_CLASS}}">{{AUTO_REFRESH_TEXT}}</p>
   </div>
 </body>
 </html>`;
diff --git a/src/templates/error-page.html b/src/templates/error-page.html
deleted file mode 100644
index 17d0699..0000000
--- a/src/templates/error-page.html
+++ /dev/null
@@ -1,749 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>{{PAGE_TITLE}} - Salesforce Local Dev Proxy</title>
-    {{META_REFRESH}}
-    <style>
-      * {
-        margin: 0;
-        padding: 0;
-        box-sizing: border-box;
-      }
-
-      body {
-        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-        background: linear-gradient(135deg, #1e2a47 0%, #2d3e5f 100%);
-        color: #333;
-        min-height: 100vh;
-        padding: 20px;
-      }
-
-      .main-container {
-        max-width: 1400px;
-        margin: 0 auto;
-        background: #e8e8e8;
-        border-radius: 16px;
-        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
-        overflow: hidden;
-      }
-
-      /* ============================================
-         TOP HEADER
-         ============================================ */
-      .top-header {
-        background: #e8e8e8;
-        padding: 30px 40px;
-        display: flex;
-        justify-content: space-between;
-        align-items: flex-start;
-        border-bottom: 1px solid #ccc;
-      }
-
-      .header-left h1 {
-        color: #1a1a1a;
-        font-size: 2.2em;
-        font-weight: 600;
-        margin-bottom: 8px;
-      }
-
-      .header-left .subtitle {
-        color: #666;
-        font-size: 1.05em;
-      }
-
-      .status-badge {
-        padding: 12px 24px;
-        border-radius: 8px;
-        font-weight: 600;
-        font-size: 0.95em;
-      }
-
-      .status-badge.critical {
-        background: #ffcdd2;
-        color: #b71c1c;
-      }
-
-      .status-badge.error {
-        background: #ffebee;
-        color: #c62828;
-      }
-
-      .status-badge.warning {
-        background: #fff3e0;
-        color: #e65100;
-      }
-
-      .status-badge.success {
-        background: #e8f5e9;
-        color: #2e7d32;
-      }
-
-      /* ============================================
-         TWO-COLUMN LAYOUT
-         ============================================ */
-      .content-wrapper {
-        display: grid;
-        grid-template-columns: 1fr 308px;
-        gap: 0;
-        background: #e8e8e8;
-      }
-
-      .main-content {
-        padding: 40px;
-        background: white;
-        border-right: 1px solid #ccc;
-      }
-
-      .diagnostics-panel {
-        padding: 40px 20px;
-        background: #f5f5f5;
-      }
-
-      /* ============================================
-         MAIN CONTENT SECTIONS
-         ============================================ */
-      .content-section {
-        margin-bottom: 30px;
-      }
-
-      .content-section h2 {
-        color: #1a1a1a;
-        font-size: 1.4em;
-        margin-bottom: 15px;
-        font-weight: 600;
-      }
-
-      .content-section h3 {
-        color: #1a1a1a;
-        font-size: 1.1em;
-        margin-bottom: 12px;
-        font-weight: 600;
-      }
-
-      .content-section p {
-        color: #555;
-        line-height: 1.6;
-        margin-bottom: 15px;
-      }
-
-      .content-section ul {
-        list-style: disc;
-        padding-left: 25px;
-        color: #555;
-        line-height: 1.8;
-      }
-
-      /* Message box for errors */
-      .message-box {
-        background: #fff3e0;
-        border-left: 4px solid #ff9800;
-        padding: 20px;
-        border-radius: 6px;
-        margin-bottom: 25px;
-      }
-
-      .message-box p {
-        color: #555;
-        margin: 0;
-      }
-
-      /* Stack trace and code outputs */
-      .code-output {
-        background: #1e1e1e;
-        border-radius: 8px;
-        padding: 20px;
-        max-height: 400px;
-        overflow-y: auto;
-        font-family: 'Courier New', Consolas, Monaco, monospace;
-        font-size: 0.9em;
-        line-height: 1.5;
-        margin: 20px 0;
-      }
-
-      .code-output pre {
-        color: #ff6b6b;
-        margin: 0;
-        white-space: pre-wrap;
-        word-wrap: break-word;
-      }
-
-      .stack-trace-container {
-        background: #263238;
-        border-radius: 8px;
-        padding: 20px;
-        max-height: 350px;
-        overflow-y: auto;
-        font-family: 'Courier New', Consolas, Monaco, monospace;
-        font-size: 0.9em;
-        line-height: 1.5;
-      }
-
-      /* Suggestions box */
-      .suggestions-box {
-        background: #e3f2fd;
-        border-left: 4px solid #2196f3;
-        padding: 20px;
-        border-radius: 6px;
-        margin: 20px 0;
-      }
-
-      .suggestions-box h3 {
-        color: #1a1a1a;
-        font-size: 1.1em;
-        margin-bottom: 15px;
-      }
-
-      .suggestions-box ul {
-        list-style: none;
-        padding: 0;
-      }
-
-      .suggestions-box li {
-        padding: 8px 0;
-        color: #555;
-        line-height: 1.6;
-      }
-
-      .suggestions-box li::before {
-        content: '💡';
-        margin-right: 10px;
-      }
-
-      /* ============================================
-         DIAGNOSTICS PANEL
-         ============================================ */
-      .diagnostics-panel h2 {
-        color: #1a1a1a;
-        font-size: 1.15em;
-        margin-bottom: 18px;
-        font-weight: 600;
-      }
-
-      .diagnostics-list {
-        list-style: none;
-        padding: 0;
-        margin-bottom: 20px;
-      }
-
-      .diagnostics-list li {
-        margin-bottom: 12px;
-        color: #555;
-        line-height: 1.4;
-        font-size: 0.9em;
-      }
-
-      .diagnostics-list .label {
-        display: block;
-        font-weight: 600;
-        color: #1a1a1a;
-        margin-bottom: 3px;
-        font-size: 0.85em;
-      }
-
-      .diagnostics-list .value {
-        font-family: 'Courier New', monospace;
-        font-size: 0.85em;
-        color: #666;
-        word-break: break-word;
-      }
-
-      .diagnostics-list .value code {
-        background: #263238;
-        color: #aed581;
-        padding: 2px 5px;
-        border-radius: 3px;
-        font-size: 0.8em;
-      }
-
-      /* Live logs section */
-      .live-logs {
-        background: #1e1e1e;
-        border-radius: 4px;
-        padding: 12px;
-        margin-top: 18px;
-        font-family: 'Courier New', monospace;
-        font-size: 0.75em;
-        color: #90a4ae;
-        max-height: 200px;
-        overflow-y: auto;
-        line-height: 1.6;
-      }
-
-      .live-logs .log-line {
-        margin-bottom: 3px;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-
-      .live-logs .timestamp {
-        color: #78909c;
-        font-size: 0.9em;
-      }
-
-      .live-logs .log-content {
-        color: #b0bec5;
-      }
-
-      /* Emergency exit commands */
-      .emergency-commands {
-        background: #fff3cd;
-        border: 1px solid #ffc107;
-        border-radius: 4px;
-        padding: 15px;
-        margin-top: 20px;
-      }
-
-      .emergency-commands h3 {
-        color: #856404;
-        font-size: 0.8em;
-        margin: 0 0 8px 0;
-        font-weight: 600;
-      }
-
-      .emergency-commands p {
-        color: #856404;
-        font-size: 0.75em;
-        margin: 0 0 8px 0;
-      }
-
-      .command-item {
-        margin-bottom: 10px;
-      }
-
-      .command-item:last-child {
-        margin-bottom: 0;
-      }
-
-      .command-comment {
-        color: #856404;
-        font-size: 0.7em;
-        margin-bottom: 3px;
-        font-style: italic;
-      }
-
-      .command-wrapper {
-        position: relative;
-      }
-
-      .command-box {
-        background: #263238;
-        color: #aed581;
-        padding: 10px 44px 10px 10px;
-        border-radius: 4px;
-        font-family: 'Courier New', monospace;
-        font-size: 0.72em;
-        word-break: break-all;
-        position: relative;
-        min-height: 36px;
-        display: flex;
-        align-items: center;
-      }
-
-      .copy-button {
-        position: absolute;
-        right: 8px;
-        top: 50%;
-        transform: translateY(-50%);
-        background: #4caf50;
-        color: white;
-        border: none;
-        border-radius: 3px;
-        padding: 6px;
-        width: 28px;
-        height: 28px;
-        cursor: pointer;
-        transition: all 0.2s;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-shrink: 0;
-      }
-
-      .copy-button:hover {
-        background: #45a049;
-        transform: translateY(-50%) scale(1.1);
-      }
-
-      .copy-button.copied {
-        background: #2196f3;
-      }
-
-      .copy-button svg {
-        width: 16px;
-        height: 16px;
-        fill: white;
-      }
-
-      /* ============================================
-         BOTTOM FOOTER
-         ============================================ */
-      .footer-section {
-        background: #e8e8e8;
-        padding: 20px 40px;
-        border-top: 1px solid #ccc;
-        text-align: center;
-      }
-
-      .help-text {
-        color: #666;
-        font-size: 0.9em;
-        line-height: 1.5;
-      }
-
-      .help-text strong {
-        color: #333;
-      }
-
-      /* ============================================
-         UTILITY CLASSES
-         ============================================ */
-      .hidden {
-        display: none;
-      }
-
-      .code {
-        background: #263238;
-        color: #aed581;
-        padding: 3px 8px;
-        border-radius: 4px;
-        font-family: 'Courier New', Consolas, Monaco, monospace;
-        font-size: 0.9em;
-      }
-
-      .auto-refresh-indicator {
-        background: #e8f5e9;
-        border-left: 4px solid #4caf50;
-        padding: 12px 16px;
-        border-radius: 6px;
-        margin: 20px 0;
-        color: #2e7d32;
-        font-size: 0.9em;
-      }
-
-      .auto-refresh-indicator::before {
-        content: '🔄';
-        margin-right: 8px;
-      }
-
-      /* Error metadata cards */
-      .metadata-grid {
-        display: grid;
-        grid-template-columns: repeat(2, 1fr);
-        gap: 15px;
-        margin: 20px 0;
-      }
-
-      .metadata-card {
-        background: #f9f9f9;
-        padding: 15px;
-        border-radius: 6px;
-        border-left: 3px solid #2196f3;
-      }
-
-      .metadata-card .label {
-        font-weight: 600;
-        color: #1a1a1a;
-        font-size: 0.85em;
-        margin-bottom: 6px;
-      }
-
-      .metadata-card .value {
-        color: #666;
-        font-family: monospace;
-        font-size: 0.9em;
-      }
-
-      /* ============================================
-         SCROLLBARS
-         ============================================ */
-      .code-output::-webkit-scrollbar,
-      .stack-trace-container::-webkit-scrollbar,
-      .live-logs::-webkit-scrollbar {
-        width: 8px;
-      }
-
-      .code-output::-webkit-scrollbar-track,
-      .stack-trace-container::-webkit-scrollbar-track,
-      .live-logs::-webkit-scrollbar-track {
-        background: #1a1f2e;
-        border-radius: 4px;
-      }
-
-      .code-output::-webkit-scrollbar-thumb,
-      .stack-trace-container::-webkit-scrollbar-thumb,
-      .live-logs::-webkit-scrollbar-thumb {
-        background: #4a5568;
-        border-radius: 4px;
-      }
-
-      /* ============================================
-         RESPONSIVE DESIGN
-         ============================================ */
-      @media (max-width: 900px) {
-        .content-wrapper {
-          grid-template-columns: 1fr;
-        }
-
-        .main-content {
-          border-right: none;
-          border-bottom: 1px solid #ccc;
-        }
-
-        .diagnostics-panel {
-          padding: 30px 20px;
-        }
-
-        .metadata-grid {
-          grid-template-columns: 1fr;
-        }
-      }
-
-      @media (max-width: 768px) {
-        .top-header {
-          flex-direction: column;
-          gap: 15px;
-          padding: 20px;
-        }
-
-        .main-content {
-          padding: 25px;
-        }
-      }
-    </style>
-  </head>
-
-  <body>
-    <div class="main-container">
-      <!-- Top Header -->
-      <div class="top-header">
-        <div class="header-left">
-          <h1>Local Dev Proxy</h1>
-          <p class="subtitle">Salesforce preview → Proxy → Your dev server</p>
-        </div>
-        <div class="status-badge {{STATUS_CLASS}}">{{ERROR_STATUS}}</div>
-      </div>
-
-      <!-- Two-Column Content -->
-      <div class="content-wrapper">
-        <!-- Main Content (Left) -->
-        <div class="main-content">
-          <!-- SECTION 1: Simple Error (Dev Server Down) -->
-          <div id="simple-error-section" class="{{SIMPLE_SECTION_CLASS}}">
-            <div class="content-section">
-              <h2>{{ERROR_TITLE}}</h2>
-              {{MESSAGE_CONTENT}}
-            </div>
-
-            <div class="auto-refresh-indicator {{AUTO_REFRESH_CLASS}}">{{AUTO_REFRESH_TEXT}}</div>
-
-            <div class="suggestions-box">
-              <h3>What to do next</h3>
-              <ul>
-                <li>Start your dev server using: <code>npm run dev</code> or <code>yarn dev</code></li>
-                <li>Verify your dev server is running on the correct port</li>
-                <li>Check webapplication.json for the correct dev server URL</li>
-                <li>This page will auto-refresh when the server is detected</li>
-              </ul>
-            </div>
-          </div>
-
-          <!-- SECTION 2: Runtime Error -->
-          <div id="runtime-error-section" class="{{RUNTIME_SECTION_CLASS}}">
-            <div class="content-section">
-              <h2>⚠️ Runtime Error: {{ERROR_TYPE}}</h2>
-              <div class="message-box">
-                <p>{{ERROR_MESSAGE_TEXT}}</p>
-              </div>
-            </div>
-
-            <div class="content-section">
-              <h3>Stack Trace</h3>
-              <div class="stack-trace-container">{{FORMATTED_STACK_HTML}}</div>
-            </div>
-
-            <div class="metadata-grid">
-              <div class="metadata-card">
-                <div class="label">Error Type</div>
-                <div class="value">{{ERROR_TYPE}}{{ERROR_CODE_BADGE}}</div>
-              </div>
-              <div class="metadata-card">
-                <div class="label">Severity</div>
-                <div class="value">{{SEVERITY_LABEL}}</div>
-              </div>
-              <div class="metadata-card">
-                <div class="label">Timestamp</div>
-                <div class="value">{{TIMESTAMP_FORMATTED}}</div>
-              </div>
-              <div class="metadata-card">
-                <div class="label">Process ID</div>
-                <div class="value">{{PID}}</div>
-              </div>
-            </div>
-
-            <div class="suggestions-box {{SUGGESTIONS_SECTION_CLASS}}">
-              <h3>{{SUGGESTIONS_TITLE}}</h3>
-              <ul>
-                {{SUGGESTIONS_LIST}}
-              </ul>
-            </div>
-          </div>
-
-          <!-- SECTION 3: Dev Server Error -->
-          <div id="dev-server-error-section" class="{{DEV_SERVER_SECTION_CLASS}}">
-            <div class="content-section">
-              <h2>⚠️ {{ERROR_TITLE}}</h2>
-              <div class="message-box">
-                <p>{{ERROR_MESSAGE_TEXT}}</p>
-              </div>
-            </div>
-
-            <div class="content-section">
-              <h3>Error Output</h3>
-              <div class="code-output">
-                <pre>{{STDERR_OUTPUT}}</pre>
-              </div>
-            </div>
-
-            <div class="auto-refresh-indicator {{AUTO_REFRESH_CLASS}}">{{AUTO_REFRESH_TEXT}}</div>
-
-            <div class="suggestions-box {{SUGGESTIONS_SECTION_CLASS}}">
-              <h3>{{SUGGESTIONS_TITLE}}</h3>
-              <ul>
-                {{SUGGESTIONS_LIST}}
-              </ul>
-            </div>
-          </div>
-        </div>
-
-        <!-- Diagnostics Panel (Right) -->
-        <div class="diagnostics-panel">
-          <h2>Diagnostics</h2>
-
-          <ul class="diagnostics-list">
-            <li class="{{SIMPLE_SECTION_CLASS}}">
-              <span class="label">Dev Server URL:</span>
-              <span class="value"><code>{{DEV_SERVER_URL}}</code></span>
-            </li>
-            <li class="{{SIMPLE_SECTION_CLASS}}">
-              <span class="label">Proxy URL:</span>
-              <span class="value"><code>{{PROXY_URL}}</code></span>
-            </li>
-            <li class="{{SIMPLE_SECTION_CLASS}}">
-              <span class="label">Workspace Script:</span>
-              <span class="value"><code>{{WORKSPACE_SCRIPT}}</code></span>
-            </li>
-            <li class="{{SIMPLE_SECTION_CLASS}}">
-              <span class="label">Target Org:</span>
-              <span class="value">{{ORG_TARGET}}</span>
-            </li>
-            <li class="{{SIMPLE_SECTION_CLASS}}">
-              <span class="label">Last Check:</span>
-              <span class="value">{{LAST_CHECK_TIME}}</span>
-            </li>
-
-            <li class="{{RUNTIME_SECTION_CLASS}}">
-              <span class="label">Node Version:</span>
-              <span class="value">{{NODE_VERSION}}</span>
-            </li>
-            <li class="{{RUNTIME_SECTION_CLASS}}">
-              <span class="label">Platform:</span>
-              <span class="value">{{PLATFORM}}</span>
-            </li>
-            <li class="{{RUNTIME_SECTION_CLASS}}">
-              <span class="label">Memory Usage:</span>
-              <span class="value">{{HEAP_USED_MB}} MB / {{HEAP_TOTAL_MB}} MB heap</span>
-            </li>
-            <li class="{{RUNTIME_SECTION_CLASS}}">
-              <span class="label">Process ID:</span>
-              <span class="value">{{PID}}</span>
-            </li>
-          </ul>
-
-          <div class="live-logs {{SIMPLE_SECTION_CLASS}}">
-            <div class="log-line">
-              <span class="timestamp">[{{LAST_CHECK_TIME}}]</span>
-              <span class="log-content">proxy ▶ waiting for backend...</span>
-            </div>
-            <div class="log-line">
-              <span class="timestamp">[{{LAST_CHECK_TIME}}]</span>
-              <span class="log-content">check {{DEV_SERVER_URL}} ▶ unreachable</span>
-            </div>
-            <div class="log-line">
-              <span class="timestamp">[{{LAST_CHECK_TIME}}]</span>
-              <span class="log-content">hint ▶ try "{{WORKSPACE_SCRIPT}}"</span>
-            </div>
-          </div>
-
-          <div class="live-logs {{RUNTIME_SECTION_CLASS}}">
-            <div class="log-line">
-              <span class="timestamp">[{{TIMESTAMP_FORMATTED}}]</span>
-              <span class="log-content">error ▶ {{ERROR_TYPE}} detected</span>
-            </div>
-            <div class="log-line">
-              <span class="log-content">severity ▶ {{SEVERITY_LABEL}}</span>
-            </div>
-          </div>
-
-          <!-- Emergency Exit Commands -->
-          <div class="emergency-commands">
-            <h3>⚠️ If Ctrl+C doesn't work</h3>
-            <p>Copy and run this command in a new terminal to force-stop the proxy:</p>
-
-            <div class="command-item">
-              <div class="command-comment">Kill all processes on port {{PROXY_PORT}}:</div>
-              <div class="command-wrapper">
-                <div class="command-box">lsof -ti:{{PROXY_PORT}} | xargs kill -9</div>
-                <button class="copy-button" onclick="copyCommand(this, 'lsof -ti:{{PROXY_PORT}} | xargs kill -9')">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                    <path
-                      d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <script>
-        function copyCommand(button, command) {
-          // Create a temporary textarea to copy from
-          const textarea = document.createElement('textarea');
-          textarea.value = command;
-          textarea.style.position = 'fixed';
-          textarea.style.opacity = '0';
-          document.body.appendChild(textarea);
-
-          // Select and copy
-          textarea.select();
-          document.execCommand('copy');
-          document.body.removeChild(textarea);
-
-          // Update button to show success with checkmark
-          const originalHTML = button.innerHTML;
-          button.innerHTML =
-            '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>';
-          button.classList.add('copied');
-
-          // Reset after 2 seconds
-          setTimeout(() => {
-            button.innerHTML = originalHTML;
-            button.classList.remove('copied');
-          }, 2000);
-        }
-      </script>
-
-      <!-- Footer -->
-      <div class="footer-section">
-        <p class="help-text">
-          Salesforce Web App Development Proxy &nbsp;•&nbsp; Press <strong>Ctrl+C</strong> in the terminal to stop the
-          proxy
-        </p>
-      </div>
-    </div>
-  </body>
-</html>

From 27ab7858dc3474b650ce0fa54c53bba8de47505c Mon Sep 17 00:00:00 2001
From: ankitsinghkuntal09 <singhankit@salesforce.com>
Date: Wed, 11 Feb 2026 12:38:12 +0530
Subject: [PATCH 2/2] feat: W-21111977 consume error-page template from
 @salesforce/webapp-experimental/proxy

Update plugin-webapp to import the error page HTML template from the
@salesforce/webapp-experimental proxy package (v1.23.0) instead of
bundling it locally.

Migration changes:
- ErrorPageRenderer now uses getErrorPageTemplate() from
  @salesforce/webapp-experimental/proxy (direct import, no workarounds)
- Removed local error-page.html template (now lives in webapps package)
- Removed scripts/copy-templates.cjs (no longer needed)
- Removed postbuild script from package.json
- Bumped @salesforce/webapp-experimental dependency to ^1.23.0

Bug fixes included:
- DevServerManager: emit DevServerError directly instead of wrapping
  in SfError, so the proxy can display the "Dev Server Error" page
  when dev server crashes
- ProxyServer: add socket error handler to prevent ECONNRESET from
  crashing the proxy when dev server dies mid-connection
- ProxyServer: remove label/version from fallback manifest (not in type)

Depends on: salesforce-experience-platform-emu/webapps#86 (merged)

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 package.json                        |  2 +-
 src/proxy/ProxyServer.ts            |  2 -
 src/templates/ErrorPageRenderer.ts  | 66 +----------------------------
 test/commands/webapp/dev.test.ts    | 11 -----
 test/config/ManifestWatcher.test.ts | 25 ++++-------
 test/config/types.test.ts           | 20 +--------
 test/proxy/ProxyServer.test.ts      |  6 ---
 yarn.lock                           | 23 +++++++---
 8 files changed, 31 insertions(+), 124 deletions(-)

diff --git a/package.json b/package.json
index f8eb28b..4acd8bb 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,7 @@
     "@salesforce/core": "^8.25.0",
     "@salesforce/kit": "^3.2.4",
     "@salesforce/sf-plugins-core": "^12.2.6",
-    "@salesforce/webapp-experimental": "^0.2.0",
+    "@salesforce/webapp-experimental": "^1.23.0",
     "chokidar": "^3.6.0",
     "http-proxy": "^1.18.1",
     "micromatch": "^4.0.8",
diff --git a/src/proxy/ProxyServer.ts b/src/proxy/ProxyServer.ts
index 6c91c99..62d0af1 100644
--- a/src/proxy/ProxyServer.ts
+++ b/src/proxy/ProxyServer.ts
@@ -412,8 +412,6 @@ export class ProxyServer extends EventEmitter {
   private initializeProxyHandler(): void {
     const manifest: WebAppManifest = this.config.manifest ?? {
       name: 'webapp',
-      label: 'WebApp',
-      version: '1.0.0',
       outputDir: 'dist',
     };
 
diff --git a/src/templates/ErrorPageRenderer.ts b/src/templates/ErrorPageRenderer.ts
index 3397d89..a33aae7 100644
--- a/src/templates/ErrorPageRenderer.ts
+++ b/src/templates/ErrorPageRenderer.ts
@@ -14,32 +14,9 @@
  * limitations under the License.
  */
 
-// Use namespace import to avoid TS2305 when getErrorPageTemplate is not yet
-// available in the published version.  The function is added by the W-21111977
-// migration in @salesforce/webapp-experimental.  Once a version that includes
-// it is published, the runtime check below will pick it up automatically.
-import * as proxyExports from '@salesforce/webapp-experimental/proxy';
+import { getErrorPageTemplate } from '@salesforce/webapp-experimental/proxy';
 import type { DevServerError } from '../config/types.js';
 
-/**
- * Load the error page template from @salesforce/webapp-experimental/proxy.
- * Returns null when the installed version does not yet export the function.
- */
-function loadProxyTemplate(): string | null {
-  try {
-    const mod = proxyExports as unknown as Record<string, unknown>;
-    const fn = mod['getErrorPageTemplate'];
-    if (typeof fn === 'function') {
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-      const result = fn();
-      if (typeof result === 'string') return result;
-    }
-  } catch {
-    // Function not available in the installed version
-  }
-  return null;
-}
-
 export type ErrorPageData = {
   status: string;
   devServerUrl: string;
@@ -58,46 +35,7 @@ export class ErrorPageRenderer {
   private template: string;
 
   public constructor() {
-    this.template = loadProxyTemplate() ?? ErrorPageRenderer.getMinimalFallbackTemplate();
-  }
-
-  /**
-   * Minimal fallback template used when the main template file cannot be loaded.
-   * This ensures the proxy can still display error pages even if the template is missing.
-   */
-  private static getMinimalFallbackTemplate(): string {
-    return `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>{{PAGE_TITLE}}</title>
-  {{META_REFRESH}}
-  <style>
-    body { font-family: system-ui, sans-serif; background: #1a1a2e; color: #eee; padding: 40px; }
-    .container { max-width: 800px; margin: 0 auto; }
-    h1 { color: #ff6b6b; }
-    .status { color: #ffd93d; margin-bottom: 20px; }
-    .info { background: #16213e; padding: 20px; border-radius: 8px; margin: 20px 0; }
-    .info p { margin: 8px 0; }
-    code { background: #0f3460; padding: 2px 6px; border-radius: 4px; }
-  </style>
-</head>
-<body>
-  <div class="container">
-    <h1>{{ERROR_TITLE}}</h1>
-    <p class="status">{{ERROR_STATUS}}</p>
-    <div class="info">
-      {{MESSAGE_CONTENT}}
-      <p><strong>Dev Server:</strong> <code>{{DEV_SERVER_URL}}</code></p>
-      <p><strong>Proxy:</strong> <code>{{PROXY_URL}}</code> (port {{PROXY_PORT}})</p>
-      <p><strong>Org:</strong> <code>{{ORG_TARGET}}</code></p>
-      <p><strong>Script:</strong> <code>{{WORKSPACE_SCRIPT}}</code></p>
-      <p><strong>Last Check:</strong> {{LAST_CHECK_TIME}}</p>
-    </div>
-    <p style="color:#888;font-size:14px;" class="{{AUTO_REFRESH_CLASS}}">{{AUTO_REFRESH_TEXT}}</p>
-  </div>
-</body>
-</html>`;
+    this.template = getErrorPageTemplate();
   }
 
   /**
diff --git a/test/commands/webapp/dev.test.ts b/test/commands/webapp/dev.test.ts
index 2d320ea..3a0fcbd 100644
--- a/test/commands/webapp/dev.test.ts
+++ b/test/commands/webapp/dev.test.ts
@@ -29,8 +29,6 @@ describe('webapp:dev command integration', () => {
     it('should have correct WebAppManifest structure', () => {
       const manifest: WebAppManifest = {
         name: 'testWebApp',
-        label: 'Test Web App',
-        version: '1.0.0',
         outputDir: 'dist',
         dev: {
           url: 'http://localhost:5173',
@@ -64,8 +62,6 @@ describe('webapp:dev command integration', () => {
     it('should use manifest dev.url when no explicit URL', () => {
       const manifest: WebAppManifest = {
         name: 'testWebApp',
-        label: 'Test Web App',
-        version: '1.0.0',
         outputDir: 'dist',
         dev: {
           url: 'http://localhost:5173',
@@ -78,8 +74,6 @@ describe('webapp:dev command integration', () => {
     it('should use dev.command when no URL provided', () => {
       const manifest: WebAppManifest = {
         name: 'testWebApp',
-        label: 'Test Web App',
-        version: '1.0.0',
         outputDir: 'dist',
         dev: {
           command: 'npm run dev',
@@ -94,8 +88,6 @@ describe('webapp:dev command integration', () => {
     it('should validate manifest with dev.url', () => {
       const manifest: WebAppManifest = {
         name: 'testWebApp',
-        label: 'Test Web App',
-        version: '1.0.0',
         outputDir: 'dist',
         dev: {
           url: 'http://localhost:5173',
@@ -104,15 +96,12 @@ describe('webapp:dev command integration', () => {
 
       // Basic validation
       expect(manifest.name).to.be.a('string');
-      expect(manifest.version).to.match(/^\d+\.\d+\.\d+$/);
       expect(manifest.dev?.url).to.include('http');
     });
 
     it('should validate manifest with dev.command', () => {
       const manifest: WebAppManifest = {
         name: 'testWebApp',
-        label: 'Test Web App',
-        version: '1.0.0',
         outputDir: 'dist',
         dev: {
           command: 'npm run dev',
diff --git a/test/config/ManifestWatcher.test.ts b/test/config/ManifestWatcher.test.ts
index d8d7533..16d35a3 100644
--- a/test/config/ManifestWatcher.test.ts
+++ b/test/config/ManifestWatcher.test.ts
@@ -29,8 +29,6 @@ describe('ManifestWatcher', () => {
 
   const validManifest: WebAppManifest = {
     name: 'testApp',
-    label: 'Test Application',
-    version: '1.0.0',
     outputDir: 'dist',
     dev: {
       command: 'npm run dev',
@@ -144,7 +142,7 @@ describe('ManifestWatcher', () => {
   });
 
   describe('Partial Manifest Support', () => {
-    it('should accept manifest with only dev.command (no name, label, version, outputDir)', async () => {
+    it('should accept manifest with only dev.command (no name, outputDir)', async () => {
       const partialManifest = {
         dev: {
           command: 'npm run dev',
@@ -160,7 +158,6 @@ describe('ManifestWatcher', () => {
       expect(manifest).to.exist;
       expect(manifest?.dev?.command).to.equal('npm run dev');
       expect(manifest?.name).to.be.undefined;
-      expect(manifest?.label).to.be.undefined;
 
       await watcher.stop();
     });
@@ -216,8 +213,6 @@ describe('ManifestWatcher', () => {
       const manifest = watcher.getManifest();
       expect(manifest).to.exist;
       expect(manifest?.name).to.equal('myApp');
-      expect(manifest?.label).to.be.undefined;
-      expect(manifest?.version).to.be.undefined;
       expect(manifest?.outputDir).to.be.undefined;
 
       await watcher.stop();
@@ -226,8 +221,6 @@ describe('ManifestWatcher', () => {
     it('should accept manifest without optional dev config', async () => {
       const minimalManifest = {
         name: 'testApp',
-        label: 'Test App',
-        version: '1.0.0',
         outputDir: 'dist',
       };
 
@@ -278,13 +271,13 @@ describe('ManifestWatcher', () => {
 
       // Wait a bit then modify the file
       setTimeout(() => {
-        const updated = { ...validManifest, version: '2.0.0' };
+        const updated = { ...validManifest, name: 'updatedApp' };
         writeFileSync(testManifestPath, JSON.stringify(updated, null, 2));
       }, 200);
 
       const event = await changePromise;
       expect(event.type).to.equal('changed');
-      expect(event.manifest?.version).to.equal('2.0.0');
+      expect(event.manifest?.name).to.equal('updatedApp');
       await watcher.stop();
     });
 
@@ -355,22 +348,22 @@ describe('ManifestWatcher', () => {
 
       // Make multiple rapid changes
       setTimeout(() => {
-        writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, version: '1.0.1' }, null, 2));
+        writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, name: 'change1' }, null, 2));
       }, 100);
 
       setTimeout(() => {
-        writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, version: '1.0.2' }, null, 2));
+        writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, name: 'change2' }, null, 2));
       }, 150);
 
       setTimeout(() => {
-        writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, version: '1.0.3' }, null, 2));
+        writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, name: 'change3' }, null, 2));
       }, 200);
 
       // Check that only one change event was emitted after debounce
       await new Promise((resolve) => setTimeout(resolve, 800));
 
       expect(changeCount).to.equal(1);
-      expect(watcher.getManifest()?.version).to.equal('1.0.3');
+      expect(watcher.getManifest()?.name).to.equal('change3');
       await watcher.stop();
     });
   });
@@ -425,12 +418,12 @@ describe('ManifestWatcher', () => {
         eventEmitted = true;
       });
 
-      writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, version: '2.0.0' }, null, 2));
+      writeFileSync(testManifestPath, JSON.stringify({ ...validManifest, name: 'changedApp' }, null, 2));
 
       await new Promise((resolve) => setTimeout(resolve, 300));
 
       expect(eventEmitted).to.be.false;
-      expect(watcher.getManifest()?.version).to.equal('1.0.0'); // Still old version
+      expect(watcher.getManifest()?.name).to.equal('testApp'); // Still old value
 
       await watcher.stop();
     });
diff --git a/test/config/types.test.ts b/test/config/types.test.ts
index 85528a8..19bdcdc 100644
--- a/test/config/types.test.ts
+++ b/test/config/types.test.ts
@@ -21,20 +21,16 @@ describe('TypeScript Types', () => {
   it('should allow valid WebAppManifest', () => {
     const manifest: WebAppManifest = {
       name: 'testApp',
-      label: 'Test Application',
-      version: '1.0.0',
       outputDir: 'dist',
     };
 
     expect(manifest.name).to.equal('testApp');
-    expect(manifest.version).to.equal('1.0.0');
+    expect(manifest.outputDir).to.equal('dist');
   });
 
   it('should allow WebAppManifest with dev config', () => {
     const manifest: WebAppManifest = {
       name: 'testApp',
-      label: 'Test Application',
-      version: '1.0.0',
       outputDir: 'dist',
       dev: {
         command: 'npm run dev',
@@ -46,18 +42,6 @@ describe('TypeScript Types', () => {
     expect(manifest.dev?.url).to.equal('http://localhost:5173');
   });
 
-  it('should allow optional description', () => {
-    const manifest: WebAppManifest = {
-      name: 'testApp',
-      label: 'Test Application',
-      description: 'This is a test app',
-      version: '1.0.0',
-      outputDir: 'dist',
-    };
-
-    expect(manifest.description).to.equal('This is a test app');
-  });
-
   it('should allow WebAppManifest with routing config', () => {
     const routing: RoutingConfig = {
       rewrites: [{ route: '/api/:id', target: 'api/handler' }],
@@ -68,8 +52,6 @@ describe('TypeScript Types', () => {
 
     const manifest: WebAppManifest = {
       name: 'testApp',
-      label: 'Test Application',
-      version: '1.0.0',
       outputDir: 'dist',
       routing,
     };
diff --git a/test/proxy/ProxyServer.test.ts b/test/proxy/ProxyServer.test.ts
index 916b61f..0569cdb 100644
--- a/test/proxy/ProxyServer.test.ts
+++ b/test/proxy/ProxyServer.test.ts
@@ -122,8 +122,6 @@ describe('ProxyServer', () => {
         salesforceInstanceUrl: 'https://test.salesforce.com',
         manifest: {
           name: 'test-app',
-          label: 'Test App',
-          version: '1.0.0',
           outputDir: 'dist',
         },
       });
@@ -227,8 +225,6 @@ describe('ProxyServer', () => {
         salesforceInstanceUrl: 'https://test.salesforce.com',
         manifest: {
           name: 'test-app',
-          label: 'Test App',
-          version: '1.0.0',
           outputDir: 'dist',
         },
       });
@@ -236,8 +232,6 @@ describe('ProxyServer', () => {
       // Update manifest with routing config
       proxy.updateManifest({
         name: 'test-app',
-        label: 'Test App',
-        version: '2.0.0',
         outputDir: 'dist',
         routing: {
           trailingSlash: 'always',
diff --git a/yarn.lock b/yarn.lock
index 6ba0d88..47bcbd0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1758,6 +1758,19 @@
   resolved "https://registry.npmjs.org/@salesforce/prettier-config/-/prettier-config-0.0.3.tgz"
   integrity sha512-hYOhoPTCSYMDYn+U1rlEk16PoBeAJPkrdg4/UtAzupM1mRRJOwEPMG1d7U8DxJFKuXW3DMEYWr2MwAIBDaHmFg==
 
+"@salesforce/sdk-core@^1.22.0":
+  version "1.22.0"
+  resolved "https://registry.yarnpkg.com/@salesforce/sdk-core/-/sdk-core-1.22.0.tgz#6488c2a64954ef554253f7d6293239d3e3ba9e61"
+  integrity sha512-L3GT267pg8iRJFXLUg+DVjn76UgJSwexXhWsAV5WDiLEkXlEwKdGFmpmKYbDx9M9sUN3NckiYw+trWGRjUEHNw==
+
+"@salesforce/sdk-data@^1.22.0":
+  version "1.22.0"
+  resolved "https://registry.yarnpkg.com/@salesforce/sdk-data/-/sdk-data-1.22.0.tgz#2dbf26f8b29f4bcc56aaf070baa74dbe64d02cd6"
+  integrity sha512-KH5RcQfyXj0jjvpI7gv54+e7qhiOBZ+XjuBA6UsOuk4bRvRfvqtwxCl1qSTLTU6iEoburudq6ixu1n7A6MOG+g==
+  dependencies:
+    "@conduit-client/salesforce-lightning-service-worker" "^3.7.0"
+    "@salesforce/sdk-core" "^1.22.0"
+
 "@salesforce/sf-plugins-core@^11.3.12":
   version "11.3.12"
   resolved "https://registry.npmjs.org/@salesforce/sf-plugins-core/-/sf-plugins-core-11.3.12.tgz"
@@ -1797,13 +1810,13 @@
   resolved "https://registry.npmjs.org/@salesforce/ts-types/-/ts-types-2.0.12.tgz"
   integrity sha512-BIJyduJC18Kc8z+arUm5AZ9VkPRyw1KKAm+Tk+9LT99eOzhNilyfKzhZ4t+tG2lIGgnJpmytZfVDZ0e2kFul8g==
 
-"@salesforce/webapp-experimental@^0.2.0":
-  version "0.2.0"
-  resolved "https://registry.npmjs.org/@salesforce/webapp-experimental/-/webapp-experimental-0.2.0.tgz"
-  integrity sha512-+E7b8u88ABJcgj7YSYiwXaF+LY9lCElibtEQbfuBdDXSUXjaMImwdZjhuyUtndIYWSXM+X38kjnIAFiikjqBIQ==
+"@salesforce/webapp-experimental@^1.23.0":
+  version "1.23.0"
+  resolved "https://registry.yarnpkg.com/@salesforce/webapp-experimental/-/webapp-experimental-1.23.0.tgz#b95ebfebd3254361732e8edcfbdc56a8b819a948"
+  integrity sha512-5EKzZ6MFnCzmKdHSSt+28riAIgFQ+5PfPRQg3Gl0mnUA3GzN9XwzEq8hI/r52sDlKPvtb2x+MKAxyYs/182OEg==
   dependencies:
-    "@conduit-client/salesforce-lightning-service-worker" "^3.7.0"
     "@salesforce/core" "^8.23.4"
+    "@salesforce/sdk-data" "^1.22.0"
     axios "^1.7.7"
     micromatch "^4.0.8"
     path-to-regexp "^8.3.0"