<camel-route-diagram>

A local verification page for the route-diagram web component. Each section exercises a different EIP pattern, rendering feature, or edge case. All data is mocked — no running Camel instance required.

cd components/camel-diagram/src/
python3 -m http.server 8080 && open http://localhost:8080/test/resources/smoke-test.html

Theme Variants

Auto (OS preference)

Follows prefers-color-scheme. No --crd-* variables are set — the component picks light or dark based on your OS setting.

Light (forced)

Override via inline style="--crd-bg:#fff; --crd-fg:#1e293b; --crd-edge:#94a3b8" to pin the light palette regardless of OS setting.

Dark (forced)

Override via style="--crd-bg:#0f172a; --crd-fg:#e2e8f0; --crd-edge:#475569" to pin the dark palette regardless of OS setting.

Content-Based Router

Order Router — choice with two when + otherwise

Routes incoming HTTP orders to premium, standard, or default fulfillment channels based on a ${header.tier} value. Verifies that three side-by-side branches render correctly and that the post-choice log node reconnects from the choice merge point.

Error Handling

Safe Processor — doTry wrapping a choice, with doCatch and doFinally

A choice inside a doTry: the doTry acts as a branching EIP so its three clauses (try block, doCatch, doFinally) are laid side-by-side. The post-try log node reconnects from the doTry merge point. Mirrors the testChoiceInsideDoTryNoSpuriousMergeConnection layout-engine test.

Scatter-Gather & Resilience

Order Fan-out — multicast to three branches

Sends each order simultaneously to billing, shipping, and notification routes. Verifies that three to nodes are placed side-by-side and that the post-multicast log reconnects from the multicast merge point.

Resilient HTTP Call — circuitBreaker with fallback

Protects a downstream payment-service call with Resilience4j. The onFallback branch is laid side-by-side with the main call. The final log reconnects from the circuitBreaker merge point.

Exchange Statistics

High-Throughput Event Consumer — per-node exchangesTotal / exchangesFailed

When a node has a statistics object the component renders ✓ successes / ✗ failures beneath the label. Here the otherwise branch has accumulated 32 failures out of 14 189 exchanges — spot the error rate at a glance.

Long URI — Text Wrapping

Kafka Consumer — multi-option URI wrapped inside the node box

A from node with a long Kafka URI (brokers=…&groupId=…&autoOffsetReset=…) verifies that the label wraps gracefully inside the fixed-width box without overflowing or truncating silently. Mirrors testTextWrappingLongLabel.

Multi-Route — Order-Processing Pipeline

Three-route pipeline rendered from a single { routes: […] } response

The generator fires a timer and hands off to processor (which routes valid/invalid orders via choice), which in turn delegates valid orders to validator for publication to Kafka. Nodes in the generator route use the description field for human-readable labels.