<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Goose Dashboard</title>
<link rel="icon" href="data:,">
<link rel="stylesheet" href="/static/app.css">
</head>
<body>
<header class="top-bar">
<div class="brand">
<h1>Goose</h1>
<span id="subtitle" class="subtitle">Live dashboard</span>
</div>
<div class="header-meta">
<span id="phase-badge" class="phase-badge phase-idle">idle</span>
<span id="hosts" class="meta-item" title="Target hosts">—</span>
<span id="run-settings" class="meta-item meta-wrap" hidden></span>
<span id="duration" class="meta-item" title="Test duration">0s</span>
<span id="run-notes" class="meta-item run-notes" title="Notes" hidden></span>
<span id="connection" class="connection disconnected" title="Connection status">
<span class="dot" aria-hidden="true"></span>
<span id="connection-label">connecting</span>
</span>
</div>
</header>
<main>
<div id="folder-banner" class="run-banner error" aria-live="polite" hidden></div>
<section id="report-bar" class="report-bar" aria-label="Report">
<label class="report-switch"><input type="checkbox" id="save-report" aria-disabled="true"> Save report</label>
<label class="report-switch"><input type="checkbox" id="graph-data" aria-disabled="true"> Include graph data</label>
<button type="button" id="save-now" class="ctrl-btn" aria-disabled="true" hidden>Save report now</button>
<span id="report-paths" class="report-paths" hidden></span>
</section>
<section id="banner" class="banner hidden" role="status"></section>
<section id="no-auth-banner" class="banner hidden" role="alert"></section>
<p id="announce" class="visually-hidden" role="status"></p>
<div id="run-banner" class="run-banner" aria-live="polite"></div>
<section id="control-panel" class="card control-panel hidden" aria-label="Load test control">
<h2>Control</h2>
<div id="ctrl-notice" class="control-notice" role="note" aria-label="Read-only dashboard" hidden></div>
<p id="ctrl-summary" class="control-summary"></p>
<details id="ctrl-settings" class="control-settings">
<summary id="ctrl-settings-label">Edit settings</summary>
<div class="settings-form">
<div class="settings-row settings-host">
<label class="settings-label" for="set-host">Host</label>
<div class="settings-inputs">
<input id="set-host" type="url" autocomplete="off" spellcheck="false">
</div>
<p id="set-host-help" class="control-help" hidden></p>
<p id="set-host-reason" class="control-help control-reason" hidden></p>
<div id="set-host-confirm" class="settings-confirm" hidden>
<p id="set-host-confirm-text" class="control-reason"></p>
<button type="button" id="set-host-confirm-ok" class="ctrl-btn">Confirm</button>
<button type="button" id="set-host-confirm-cancel" class="ctrl-btn">Cancel</button>
</div>
</div>
<div class="settings-row">
<label class="settings-label" for="set-up">Ramp up</label>
<div class="settings-inputs">
<input id="set-up" type="number" min="0" step="any" inputmode="decimal" autocomplete="off">
<label class="visually-hidden" for="set-up-unit">Ramp up unit</label>
<select id="set-up-unit">
<option value="rate">users per second</option>
<option value="s">s total</option>
<option value="min">min total</option>
<option value="h">h total</option>
</select>
</div>
<p id="set-up-reason" class="control-help control-reason" hidden></p>
</div>
<div class="settings-row">
<label class="settings-label" for="set-down">Ramp down</label>
<div class="settings-inputs">
<input id="set-down" type="number" min="0" step="any" inputmode="decimal" autocomplete="off" aria-describedby="set-down-help">
<label class="visually-hidden" for="set-down-unit">Ramp down unit</label>
<select id="set-down-unit">
<option value="rate">users per second</option>
<option value="s">s total</option>
<option value="min">min total</option>
<option value="h">h total</option>
</select>
</div>
<p id="set-down-help" class="control-help">Empty: all users stop at once.</p>
<p id="set-down-reason" class="control-help control-reason" hidden></p>
</div>
<div class="settings-row">
<label class="settings-label" for="set-run">Run time</label>
<div class="settings-inputs">
<input id="set-run" type="number" min="1" step="any" inputmode="decimal" autocomplete="off">
<label class="visually-hidden" for="set-run-unit">Run time unit</label>
<select id="set-run-unit">
<option value="s">s</option>
<option value="min">min</option>
<option value="h">h</option>
</select>
</div>
<p id="set-run-help" class="control-help"></p>
<p id="set-run-held" class="control-help" hidden></p>
<p id="set-run-reason" class="control-help control-reason" hidden></p>
</div>
<div class="control-row settings-actions">
<button type="button" id="set-apply" class="ctrl-btn">Apply settings</button>
<button type="button" id="set-discard" class="ctrl-btn">Discard edits</button>
</div>
<p id="set-reason" class="control-help control-reason" hidden></p>
</div>
</details>
<div class="control-row">
<button type="button" id="ctrl-start" class="ctrl-btn ctrl-start">Start</button>
<button type="button" id="ctrl-stop" class="ctrl-btn ctrl-stop">Stop</button>
<button type="button" id="ctrl-quit" class="ctrl-btn ctrl-quit" hidden>Quit</button>
</div>
<div class="control-row control-users-row">
<span class="control-active" title="Active users from latest snapshot">
Active: <strong id="ctrl-active">—</strong>
</span>
<label class="control-label" for="ctrl-target">
Target
<input id="ctrl-target" type="number" min="1" step="1" inputmode="numeric" autocomplete="off" aria-describedby="ctrl-target-help">
</label>
<button type="button" id="ctrl-apply" class="ctrl-btn">Apply</button>
<button type="button" id="ctrl-minus" class="ctrl-btn ctrl-step-btn" title="Decrease target by step" aria-label="Decrease target by step">−</button>
<button type="button" id="ctrl-plus" class="ctrl-btn ctrl-step-btn" title="Increase target by step" aria-label="Increase target by step">+</button>
<label class="control-label" for="ctrl-step">
step
<input id="ctrl-step" type="number" min="1" step="1" value="10" inputmode="numeric" autocomplete="off">
</label>
</div>
<p id="ctrl-target-reason" class="control-help control-reason" hidden></p>
<p id="ctrl-target-help" class="control-help"></p>
<p id="ctrl-status" class="control-status" role="status"></p>
</section>
<section id="kpis" class="kpi-row">
<div class="kpi card">
<span class="k">Users</span>
<span id="kpi-users" class="v">—</span>
</div>
<div class="kpi card">
<span class="k">RPS</span>
<span id="kpi-rps" class="v">—</span>
</div>
<div class="kpi card">
<span class="k">Fail %</span>
<span id="kpi-fail" class="v">—</span>
</div>
<div class="kpi card">
<span id="kpi-p95-label" class="k">p95 ms (whole run)</span>
<span id="kpi-p95" class="v">—</span>
</div>
<div class="kpi card">
<span id="kpi-avg-label" class="k">Avg ms (whole run)</span>
<span id="kpi-avg" class="v">—</span>
</div>
</section>
<section id="charts" class="charts-grid">
<div class="card chart-card">
<h2>Requests / failures per second</h2>
<canvas id="chart-rps" role="img" aria-label="RPS and failures chart"></canvas>
<p id="chart-rps-summary" class="chart-summary">No data yet.</p>
<details id="chart-rps-details" class="chart-data">
<summary>Show data</summary>
<div class="table-wrap" tabindex="0" role="region" aria-label="Requests per second data table">
<table id="chart-rps-table">
<thead><tr><th>Second</th><th>RPS</th><th>Failures/s</th></tr></thead>
<tbody id="chart-rps-rows"></tbody>
</table>
</div>
</details>
</div>
<div class="card chart-card">
<h2>Active users</h2>
<canvas id="chart-users" role="img" aria-label="Active users chart"></canvas>
<p id="chart-users-summary" class="chart-summary">No data yet.</p>
<details id="chart-users-details" class="chart-data">
<summary>Show data</summary>
<div class="table-wrap" tabindex="0" role="region" aria-label="Active users data table">
<table id="chart-users-table">
<thead><tr><th>Second</th><th>Users</th></tr></thead>
<tbody id="chart-users-rows"></tbody>
</table>
</div>
</details>
</div>
<div id="chart-latency-card" class="card chart-card chart-wide">
<div class="chart-head">
<h2 id="chart-latency-title">Response times by second</h2>
<div class="chart-controls">
<div id="heatmap-view" class="segmented" role="group" aria-label="Response times shown" hidden>
<button type="button" id="heatmap-adjusted" aria-pressed="true">Adjusted</button>
<button type="button" id="heatmap-measured" aria-pressed="false">Measured</button>
</div>
<select id="heatmap-request" aria-label="Request shown">
<option value="">All requests</option>
</select>
</div>
</div>
<p id="chart-latency-note" class="note" hidden></p>
<p id="heatmap-note" class="note">Each column is one second. Color shows how many requests took that long; the lines are that second's p50, p95 and p99.</p>
<div id="heatmap-wrap" class="heatmap-wrap">
<canvas id="chart-heatmap" role="img" aria-label="Response times by second, heatmap"></canvas>
<div id="heatmap-tooltip" class="heatmap-tooltip" role="tooltip" hidden></div>
</div>
<div id="heatmap-legend" class="heatmap-legend">
<span>Requests</span>
<span id="heatmap-legend-min"></span>
<span id="heatmap-legend-bar" class="heatmap-legend-bar"></span>
<span id="heatmap-legend-max"></span>
<span>(log scale)</span>
<span class="heatmap-key heatmap-key-p50">p50</span>
<span class="heatmap-key heatmap-key-p95">p95</span>
<span class="heatmap-key heatmap-key-p99">p99</span>
</div>
<div id="chart-latency-wrap" hidden>
<canvas id="chart-latency" role="img" aria-label="Average latency chart"></canvas>
</div>
<p id="chart-latency-summary" class="chart-summary">No data yet.</p>
<details id="chart-latency-details" class="chart-data">
<summary>Show data</summary>
<div class="table-wrap" tabindex="0" role="region" aria-label="Response time data table">
<table id="heatmap-table">
<thead><tr><th>Second</th><th>Requests</th><th>p50 ms</th><th>p95 ms</th><th>p99 ms</th></tr></thead>
<tbody id="heatmap-rows"></tbody>
</table>
<table id="chart-latency-table" hidden>
<thead><tr><th>Second</th><th>Avg ms</th></tr></thead>
<tbody id="chart-latency-rows"></tbody>
</table>
</div>
</details>
</div>
</section>
<section id="summary" class="card">
<h2>Summary</h2>
<div id="summary-body" class="grid">—</div>
</section>
<section id="aggregate" class="card">
<h2>Whole run</h2>
<p class="note">Since the test started, or since metrics were last reset. Request times under 10 ms are shown to the hundredth of a millisecond.</p>
<div id="aggregate-body" class="grid">—</div>
</section>
<section id="scenarios" class="card">
<h2>Scenarios</h2>
<p class="table-note">A scenario run is one full pass through the scenario's weighted transactions. Run times include the scenario's wait time, if it sets one. Users is the number of users that ran the scenario, whether or not they finished a run.</p>
<div class="table-wrap" tabindex="0" role="region" aria-label="Scenarios table">
<table id="scenarios-table">
<thead>
<tr>
<th data-sort="scenario_index" data-type="num" class="sorted asc">#</th>
<th data-sort="scenario_name" data-type="str">Scenario</th>
<th data-sort="users" data-type="num">Users</th>
<th data-sort="run_count" data-type="num">#runs</th>
<th data-sort="runs_per_second" data-type="num">runs/s</th>
<th data-sort="runs_per_user" data-type="num">runs/user</th>
<th data-sort="response_time_avg_ms" data-type="num" title="Whole run">avg ms</th>
<th data-sort="p50" data-type="num" title="Whole run">p50</th>
<th data-sort="p95" data-type="num" title="Whole run">p95</th>
<th data-sort="p99" data-type="num" title="Whole run">p99</th>
</tr>
</thead>
<tbody id="scenarios-body"></tbody>
</table>
</div>
</section>
<section id="transactions" class="card">
<h2>Transactions</h2>
<div class="table-toolbar">
<label class="filter-label">
Filter
<input id="transactions-filter" type="search" placeholder="scenario or transaction…" autocomplete="off">
</label>
</div>
<div class="table-wrap" tabindex="0" role="region" aria-label="Transactions table">
<table id="transactions-table">
<thead>
<tr>
<th data-sort="order" data-type="num" class="sorted asc">#</th>
<th data-sort="scenario_name" data-type="str">Scenario</th>
<th data-sort="transaction_name" data-type="str">Transaction</th>
<th data-sort="run_count" data-type="num">#runs</th>
<th data-sort="failure_count" data-type="num">#fails</th>
<th data-sort="runs_per_second" data-type="num">runs/s</th>
<th data-sort="failures_per_second" data-type="num">fails/s</th>
<th data-sort="response_time_avg_ms" data-type="num" title="Whole run">avg ms</th>
<th data-sort="response_time_min_ms" data-type="num" title="Whole run">min ms</th>
<th data-sort="p50" data-type="num" title="Whole run">p50</th>
<th data-sort="p95" data-type="num" title="Whole run">p95</th>
<th data-sort="p99" data-type="num" title="Whole run">p99</th>
<th data-sort="response_time_max_ms" data-type="num" title="Whole run">max ms</th>
</tr>
</thead>
<tbody id="transactions-body"></tbody>
</table>
</div>
</section>
<section id="requests" class="card">
<h2>Requests</h2>
<p id="requests-co-note" class="note" hidden>Response times include the synthetic times coordinated omission mitigation adds. Hover a value to see the measured one.</p>
<div class="table-toolbar">
<label class="filter-label">
Filter
<input id="requests-filter" type="search" placeholder="method or name…" autocomplete="off">
</label>
</div>
<div class="table-wrap" tabindex="0" role="region" aria-label="Requests table">
<table id="requests-table">
<thead>
<tr>
<th data-sort="method" data-type="str">Method</th>
<th data-sort="name" data-type="str">Name</th>
<th data-sort="request_count" data-type="num" class="sorted desc">#reqs</th>
<th data-sort="failure_count" data-type="num">#fails</th>
<th data-sort="requests_per_second" data-type="num">req/s</th>
<th data-sort="failures_per_second" data-type="num">fails/s</th>
<th data-sort="response_time_avg_ms" data-type="num" title="Whole run">avg ms</th>
<th data-sort="response_time_min_ms" data-type="num" title="Whole run">min ms</th>
<th data-sort="p50" data-type="num" title="Whole run">p50</th>
<th data-sort="p95" data-type="num" title="Whole run">p95</th>
<th data-sort="p99" data-type="num" title="Whole run">p99</th>
<th data-sort="response_time_max_ms" data-type="num" title="Whole run">max ms</th>
<th data-sort="status_codes" data-type="str" title="Whole run">status codes</th>
</tr>
</thead>
<tbody id="requests-body"></tbody>
</table>
</div>
</section>
<section id="errors" class="card">
<h2>Errors</h2>
<div class="table-wrap" tabindex="0" role="region" aria-label="Errors table">
<table id="errors-table">
<thead>
<tr>
<th data-sort="method" data-type="str">Method</th>
<th data-sort="name" data-type="str">Name</th>
<th data-sort="error" data-type="str">Error</th>
<th data-sort="occurrences" data-type="num" class="sorted desc">Occurrences</th>
</tr>
</thead>
<tbody id="errors-body"></tbody>
</table>
</div>
</section>
<section id="transaction-errors" class="card">
<h2>Transaction errors</h2>
<div class="table-wrap" tabindex="0" role="region" aria-label="Transaction errors table">
<table id="transaction-errors-table">
<thead>
<tr>
<th data-sort="transaction" data-type="str">Transaction</th>
<th data-sort="scenario" data-type="str">Scenario</th>
<th data-sort="name" data-type="str">Name</th>
<th data-sort="error" data-type="str">Error</th>
<th data-sort="occurrences" data-type="num" class="sorted desc">Occurrences</th>
</tr>
</thead>
<tbody id="transaction-errors-body"></tbody>
</table>
</div>
</section>
<section id="runs-panel" class="card" aria-labelledby="runs-heading">
<h2 id="runs-heading">Runs</h2>
<div class="table-wrap" tabindex="0" role="region" aria-label="Runs table">
<table id="runs-table">
<thead>
<tr>
<th scope="col">Run</th>
<th scope="col">Started</th>
<th scope="col">Notes</th>
<th scope="col">Duration</th>
<th scope="col">Users</th>
<th scope="col">Requests</th>
<th scope="col">Failed</th>
<th scope="col">Ended</th>
<th scope="col">Test</th>
<th scope="col">Downloads</th>
<th scope="col">Compare</th>
<th scope="col" id="runs-delete-col" hidden>Delete</th>
</tr>
</thead>
<tbody id="runs-body"></tbody>
</table>
</div>
<p id="runs-empty" class="table-note">No reports yet.</p>
<div class="runs-actions">
<button type="button" id="runs-show-all" class="ctrl-btn" hidden>Show all</button>
<p id="runs-compare-note" class="runs-compare-note" hidden></p>
<button type="button" id="runs-compare" class="ctrl-btn" hidden>Download comparison</button>
</div>
<p id="runs-error" class="runs-error" role="status" hidden></p>
<p id="runs-footer" class="table-note"></p>
</section>
</main>
<footer>
<p id="footer-note">This dashboard is read-only.</p>
</footer>
<script src="/static/app.js"></script>
</body>
</html>