fix: Simplify the diagnosis run and fix the statement-store submit example (#174)

* Run all diagnosis methods sequentially, no skips

* Improve diagnosis [Before you start] section

Author: valentinfernandez1

playground/CLAUDE.md

@@ -38,7 +38,7 @@ The Diagnosis screen emits a per-host markdown report via "Copy report". Aggrega
 | `src/lib/transport.ts` | Singleton `Provider`/`Transport`/`TrUApiClient` over iframe postMessage or webview MessagePort. Owns the handshake and connection status. |
 | `src/lib/example-runner.ts` | Transpiles each rustdoc `ts` example via sucrase, runs it inside an `AsyncFunction` with `truapi`, `console`, rxjs, and an ambient `assert` as bindings. Failure is explicit: an example fails iff it throws (via `assert(...)`, a timeout, or any uncaught error); `console.*` is pure output. A tracking Proxy auto-unsubscribes inner `.subscribe(...)` calls so subscriptions clean up when the run ends or the user navigates away. |
 | `src/lib/monaco-setup.ts` | Configures Monaco's TS worker: registers the bundled `@parity/truapi` types (`truapi-dts`), every rxjs `.d.ts`, and an ambient block (`declare const truapi: Client`, `assert`, `crypto`, `Uint8Array` hex helpers) so examples typecheck without manual imports. Defines the light/dark themes that match the design tokens. |
-| `src/lib/auto-test.ts` | Runs each method's example and reports pass / fail. A method passes when its example resolves within the timeout and fails when it throws (the thrown/`assert` message plus any logs become the failure output); unary and subscription examples are awaited identically. `runDiagnosis` runs every method one at a time: automatic methods first, then the methods that prompt the user (signing, permission/resource requests, `navigate_to`) last so each interaction completes in isolation. `runSingleTest` replays one method (used by the Diagnosis row replay). |
+| `src/lib/auto-test.ts` | Runs each method's example and reports pass / fail. A method passes when its example resolves within the timeout and fails when it throws (the thrown/`assert` message plus any logs become the failure output); unary and subscription examples are awaited identically. `runDiagnosis` runs every method one at a time, in service order; methods that prompt the user (signing, permission/resource requests) block on their host dialog before the run continues. `runSingleTest` replays one method (used by the Diagnosis row replay). |
 | `src/lib/diagnosis-report.ts` | Renders the diagnosis results as a copy-pasteable GitHub-flavoured markdown table: a `## Truapi <Web\|Desktop\|Android\|iOS> Diagnosis` title (host mode via `detectHostMode` — a native host (Electron UA or `__HOST_WEBVIEW_MARK__`) is split by user-agent into Desktop / Android / iOS, a browser iframe ⇒ Web) and one method/status row per method. Deterministic for a given set of results (no timestamp). Consumed by the explorer's matrix aggregator. |
 | `src/lib/host-api-bridge.ts` | Just `stringify`, the JSON-with-bigint helper shared across components. |
 | `src/components/ExampleEditor.tsx` | Monaco editor wrapper. Auto-folds `// #region helpers` blocks on mount. |

playground/src/components/DiagnosisView.tsx

@@ -125,14 +125,16 @@ export function DiagnosisView({
         <p className="panel__desc">
           Runs every TrUAPI method against the connected host to build a coverage
           report — which methods work, which fail, and which aren&apos;t wired
-          yet. Methods run one at a time; those that need your approval (signing,
-          permission and resource requests) run last. When it finishes, copy the
-          report below.
+          yet. Methods run one at a time, in order; those that need your approval
+          (signing, permission and resource requests) wait on your response
+          before the run continues. When it finishes, copy the report below.
         </p>
         <p className="diag__callout">
           Before you start: make sure you are <strong>logged in</strong>, and
           keep your <strong>phone nearby</strong> to sign transactions and
-          approve pop-ups from the Polkadot app as they appear.
+          approve pop-ups from the Polkadot app as they appear. Some payment
+          methods need an <strong>available balance</strong> in the Polkadot app
+          — without it they fail with an insufficient-balance error.
         </p>
       </div>
 

playground/src/lib/auto-test.ts

@@ -21,22 +21,6 @@ const SIGNING_TIMEOUT_MS = 30_000;
 
 // Services skipped wholesale in the diagnosis until hosts wire them up.
 const SKIPPED_SERVICES = new Set(["Coin Payment"]);
-// Methods run last, after the automatic checks: they prompt the user (signing,
-// permission/resource requests) or navigate away (`navigate_to`), so deferring
-// them keeps each interaction isolated at the end of the run.
-const DEFERRED_METHODS = new Set([
-  "System/navigate_to",
-  "Permissions/request_device_permission",
-  "Permissions/request_remote_permission",
-  "Resource Allocation/request",
-  "Signing/sign_payload",
-  "Signing/sign_raw",
-  "Signing/sign_raw_with_legacy_account",
-  "Signing/sign_payload_with_legacy_account",
-  "Signing/create_transaction",
-  "Signing/create_transaction_with_legacy_account",
-  "Account/get_account_alias",
-]);
 // Methods whose first call implicitly triggers a host permission/signing
 // prompt, so they need the longer signing-class timeout to allow for the user
 // to respond. `get_account_alias` and `Preimage/submit` prompt on first use.
@@ -134,27 +118,19 @@ export async function runSingleTest(
   await runOne({ serviceName, method, onUpdate });
 }
 
-// Full diagnosis: run every method one at a time. Automatic checks run first;
-// methods that prompt the user or navigate away are deferred to the end so each
-// runs in isolation. Produces a complete worked / failed / not-wired matrix
-// suitable for the copy-pasteable report.
+// Full diagnosis: run every method one at a time, in service order. Methods
+// that prompt the user (signing, permission/resource requests) block on their
+// host dialog before the run continues. Produces a complete worked / failed /
+// not-wired matrix suitable for the copy-pasteable report.
 export async function runDiagnosis(
   services: ServiceInfo[],
   onUpdate: (id: string, entry: TestEntry) => void,
   signal?: AbortSignal,
 ): Promise<void> {
-  const immediate: Array<{ serviceName: string; method: MethodInfo }> = [];
-  const deferred: typeof immediate = [];
   for (const svc of services) {
     for (const method of svc.methods) {
-      const bucket = DEFERRED_METHODS.has(`${svc.name}/${method.name}`)
-        ? deferred
-        : immediate;
-      bucket.push({ serviceName: svc.name, method });
+      if (signal?.aborted) return;
+      await runOne({ serviceName: svc.name, method, onUpdate });
     }
   }
-  for (const { serviceName, method } of [...immediate, ...deferred]) {
-    if (signal?.aborted) return;
-    await runOne({ serviceName, method, onUpdate });
-  }
 }