@jaredwray/mockhttp 1.9.0 → 2.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/README.md +40 -8
  2. package/dist/index.d.mts +90 -11
  3. package/dist/index.mjs +203 -240
  4. package/package.json +17 -13
  5. package/site/dist/api/index.html +17983 -0
  6. package/site/dist/api/swagger.json +5487 -0
  7. package/site/dist/changelog/index.html +784 -0
  8. package/site/dist/changelog/page/2/index.html +577 -0
  9. package/site/dist/changelog/v0-2-0/index.html +437 -0
  10. package/site/dist/changelog/v0-2-1/index.html +438 -0
  11. package/site/dist/changelog/v0-2-2/index.html +436 -0
  12. package/site/dist/changelog/v0-2-3/index.html +440 -0
  13. package/site/dist/changelog/v0-3-0/index.html +443 -0
  14. package/site/dist/changelog/v0-4-0/index.html +437 -0
  15. package/site/dist/changelog/v0-4-1/index.html +441 -0
  16. package/site/dist/changelog/v0-4-2/index.html +446 -0
  17. package/site/dist/changelog/v0-4-3/index.html +437 -0
  18. package/site/dist/changelog/v0-5-0/index.html +443 -0
  19. package/site/dist/changelog/v0-6-0/index.html +444 -0
  20. package/site/dist/changelog/v0-6-1/index.html +441 -0
  21. package/site/dist/changelog/v0-7-0/index.html +445 -0
  22. package/site/dist/changelog/v0-8-0/index.html +440 -0
  23. package/site/dist/changelog/v0-9-0/index.html +437 -0
  24. package/site/dist/changelog/v1-0-0/index.html +446 -0
  25. package/site/dist/changelog/v1-0-1/index.html +437 -0
  26. package/site/dist/changelog/v1-1-0/index.html +445 -0
  27. package/site/dist/changelog/v1-2-0/index.html +443 -0
  28. package/site/dist/changelog/v1-3-0/index.html +448 -0
  29. package/site/dist/changelog/v1-4-0/index.html +445 -0
  30. package/site/dist/changelog/v1-5-0/index.html +439 -0
  31. package/site/dist/changelog/v1-5-1/index.html +443 -0
  32. package/site/dist/changelog/v1-6-0/index.html +467 -0
  33. package/site/dist/changelog/v1-7-0/index.html +462 -0
  34. package/site/dist/changelog/v1-8-0/index.html +481 -0
  35. package/site/dist/changelog/v1-8-1/index.html +457 -0
  36. package/site/dist/changelog/v1-9-0/index.html +495 -0
  37. package/site/dist/changelog/v2-0-0/index.html +500 -0
  38. package/site/dist/changelog/v2-1-0/index.html +476 -0
  39. package/site/dist/changelog-latest.json +269 -0
  40. package/site/dist/changelog.json +399 -0
  41. package/site/dist/css/api.css +1113 -0
  42. package/site/dist/css/highlight/highlight.min.js +1433 -0
  43. package/site/dist/css/highlight/styles/base16/docula.css +123 -0
  44. package/site/dist/css/home.css +133 -0
  45. package/site/dist/css/styles.css +1227 -0
  46. package/site/dist/css/variables.css +32 -0
  47. package/site/dist/docs/bins/index.html +980 -0
  48. package/site/dist/docs/configuration/index.html +809 -0
  49. package/site/dist/docs/hosted/index.html +583 -0
  50. package/site/dist/docs/how-to-deploy/cloudflare/index.html +655 -0
  51. package/site/dist/docs/how-to-deploy/docker/index.html +664 -0
  52. package/site/dist/docs/how-to-deploy/wasmer/index.html +625 -0
  53. package/site/dist/docs/https/index.html +796 -0
  54. package/site/dist/docs/index.html +640 -0
  55. package/site/dist/docs/library/index.html +818 -0
  56. package/site/dist/docs/taps/index.html +746 -0
  57. package/site/dist/favicon.svg +14 -0
  58. package/site/dist/feed.xml +1 -0
  59. package/site/dist/index.html +640 -0
  60. package/site/dist/js/api.js +363 -0
  61. package/site/dist/js/search.js +436 -0
  62. package/site/dist/llms-full.txt +7640 -0
  63. package/site/dist/llms.txt +43 -0
  64. package/site/dist/logo.svg +21 -0
  65. package/site/dist/robots.txt +2 -0
  66. package/site/dist/search-index.json +1 -0
  67. package/site/dist/sitemap.xml +1 -0
@@ -0,0 +1,746 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <meta name="description" content="HTTP mock server and httpbin replacement for API testing. Run it at mockhttp.org, in Docker, or in Node.js.">
8
+ <link rel="stylesheet" href="/css/variables.css">
9
+ <link rel="stylesheet" href="/css/styles.css">
10
+ <link rel="stylesheet" href="/css/highlight/styles/base16/docula.css">
11
+ <link rel="icon" href="/logo.svg">
12
+ <script>
13
+ (function(){
14
+ window.__doculaThemeKey = 'docula:theme:' + ('https://mockhttp.org').replace(/^https?:\/\//, '');
15
+ var mode = localStorage.getItem(window.__doculaThemeKey) || 'light';
16
+ var resolved = mode === 'system'
17
+ ? (window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark')
18
+ : mode;
19
+ if (resolved === 'light') document.documentElement.setAttribute('data-theme', 'light');
20
+ try {
21
+ var authState = JSON.parse(localStorage.getItem('docula-auth-state'));
22
+ if (authState) {
23
+ window.__doculaAuth = authState;
24
+ if (authState.loggedIn) {
25
+ document.documentElement.classList.add('docula-auth-logged-in');
26
+ }
27
+ }
28
+ } catch (e) {
29
+ // Ignore localStorage parsing errors
30
+ }
31
+ if (!window.__doculaAuth) {
32
+ window.__doculaAuth = { loggedIn: false, displayName: null };
33
+ }
34
+ })();
35
+ </script>
36
+ <title>MockHTTP - Taps</title>
37
+ <script type="application/ld+json">
38
+ {"@context":"https://schema.org","@type":"TechArticle","headline":"Taps","description":"","url":"https://mockhttp.org/docs/taps/","publisher":{"@type":"Organization","name":"MockHTTP"},"dateModified":"2026-10-03","keywords":[]}
39
+ </script>
40
+ </head>
41
+
42
+ <body>
43
+ <header class="header">
44
+ <div class="header-top">
45
+ <div class="header-top__content">
46
+ <button class="mobile-menu-toggle" id="mobile-menu-toggle" aria-label="Toggle navigation menu">
47
+ <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="4" x2="20" y1="12" y2="12"/><line x1="4" x2="20" y1="6" y2="6"/><line x1="4" x2="20" y1="18" y2="18"/></svg>
48
+ </button>
49
+ <a href="/" class="logo-link">
50
+ <img alt="MockHTTP" class="logo__img" src="/logo.svg">
51
+ </a>
52
+ <nav class="header-bottom__nav">
53
+ <a class="header-bottom__item" href="/docs/" id="nav-docs">
54
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 7v14"/><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
55
+ <span>Documentation</span>
56
+ </a>
57
+ <a class="header-bottom__item" href="/api" id="nav-api">
58
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m16 18 6-6-6-6"/><path d="m8 6-6 6 6 6"/></svg>
59
+ <span>API Reference</span>
60
+ </a>
61
+ <a class="header-bottom__item" href="/changelog/" id="nav-changelog">
62
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M11 6a13 13 0 0 0 8.4-2.8A1 1 0 0 1 21 4v12a1 1 0 0 1-1.6.8A13 13 0 0 0 11 14H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2z"/><path d="M6 14a12 12 0 0 0 2.4 7.2 2 2 0 0 0 3.2-2.4A8 8 0 0 1 10 14"/><path d="M8 6v8"/></svg>
63
+ <span>Changelog</span>
64
+ </a>
65
+ </nav>
66
+ <div class="header-actions">
67
+ <button class="search-button" id="search-button" type="button" aria-label="Search" aria-keyshortcuts="Meta+K Control+K">
68
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>
69
+ <span class="search-button__text">Search</span>
70
+ <span class="search-button__shortcut">⌘K</span>
71
+ </button>
72
+ <button class="theme-button" id="theme-toggle" aria-label="Theme: system (following system)">
73
+ <svg class="theme-button__icon theme-button__icon--system" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" x2="16" y1="21" y2="21"/><line x1="12" x2="12" y1="17" y2="21"/></svg>
74
+ <svg class="theme-button__icon theme-button__icon--sun theme-button__icon--hidden" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="4"/><path d="M12 2v2"/><path d="M12 20v2"/><path d="m4.93 4.93 1.41 1.41"/><path d="m17.66 17.66 1.41 1.41"/><path d="M2 12h2"/><path d="M20 12h2"/><path d="m6.34 17.66-1.41 1.41"/><path d="m19.07 4.93-1.41 1.41"/></svg>
75
+ <svg class="theme-button__icon theme-button__icon--moon theme-button__icon--hidden" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401"/></svg>
76
+ </button>
77
+ </div>
78
+ </div>
79
+ </div>
80
+ </header>
81
+ <aside class="mobile-sidebar" id="mobile-sidebar">
82
+ <nav class="mobile-nav">
83
+ <a class="mobile-nav__item" href="/docs/">
84
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 7v14"/><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
85
+ <span>Documentation</span>
86
+ </a>
87
+ <a class="mobile-nav__item" href="/api">
88
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m16 18 6-6-6-6"/><path d="m8 6-6 6 6 6"/></svg>
89
+ <span>API Reference</span>
90
+ </a>
91
+ <a class="mobile-nav__item" href="/changelog/">
92
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M11 6a13 13 0 0 0 8.4-2.8A1 1 0 0 1 21 4v12a1 1 0 0 1-1.6.8A13 13 0 0 0 11 14H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2z"/><path d="M6 14a12 12 0 0 0 2.4 7.2 2 2 0 0 0 3.2-2.4A8 8 0 0 1 10 14"/><path d="M8 6v8"/></svg>
93
+ <span>Changelog</span>
94
+ </a>
95
+ </nav>
96
+ <div class="mobile-sidebar__docs" id="mobile-sidebar-docs"></div>
97
+ </aside>
98
+ <div class="sidebar-backdrop" id="sidebar-backdrop"></div>
99
+ <div class="search-modal" id="search-modal" hidden>
100
+ <div class="search-modal__backdrop" data-search-close></div>
101
+ <div class="search-modal__panel" role="dialog" aria-modal="true" aria-label="Search">
102
+ <div class="search-modal__header">
103
+ <svg class="search-modal__icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>
104
+ <input
105
+ type="search"
106
+ id="search-input"
107
+ class="search-modal__input"
108
+ placeholder="Search"
109
+ autocomplete="off"
110
+ autocorrect="off"
111
+ autocapitalize="off"
112
+ spellcheck="false"
113
+ aria-label="Search"
114
+ aria-controls="search-results"
115
+ aria-activedescendant=""
116
+ role="combobox"
117
+ aria-expanded="true"
118
+ />
119
+ <button class="search-modal__clear" id="search-clear" type="button" aria-label="Clear search" hidden>
120
+ <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
121
+ </button>
122
+ </div>
123
+ <div class="search-modal__body">
124
+ <ul class="search-results" id="search-results" role="listbox" aria-label="Search results"></ul>
125
+ <div class="search-modal__empty" id="search-empty" hidden>
126
+ No results for "<span class="search-modal__empty-query" id="search-empty-query"></span>"
127
+ </div>
128
+ <div class="search-modal__initial" id="search-initial">
129
+ Type to search the documentation.
130
+ </div>
131
+ </div>
132
+ <div class="search-modal__footer">
133
+ <span class="search-modal__hint"><kbd class="search-modal__kbd">↑</kbd><kbd class="search-modal__kbd">↓</kbd> to navigate</span>
134
+ <span class="search-modal__hint"><kbd class="search-modal__kbd">↵</kbd> to select</span>
135
+ <span class="search-modal__hint"><kbd class="search-modal__kbd">esc</kbd> to close</span>
136
+ </div>
137
+ </div>
138
+ </div>
139
+ <script>
140
+ window.__doculaSearch = { indexUrl: "/search-index.json" };
141
+ </script>
142
+ <script src="/js/search.js" defer></script>
143
+ <div class="page-dropdown" id="page-dropdown">
144
+ <button class="page-dropdown__toggle" id="page-dropdown-toggle">
145
+ <span class="page-dropdown__title">Taps</span>
146
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m7 15 5 5 5-5"/><path d="m7 9 5-5 5 5"/></svg>
147
+ </button>
148
+ <div class="page-dropdown__list" id="page-dropdown-list">
149
+ <section class="nav-sidebar__section">
150
+ <ul class="nav-sidebar__list">
151
+ <li>
152
+ <a href="/docs/" class="nav-sidebar__item">Getting Started</a>
153
+ </li>
154
+ </ul>
155
+ </section>
156
+ <section class="nav-sidebar__section">
157
+ <ul class="nav-sidebar__list">
158
+ <li>
159
+ <a href="/docs/https/" class="nav-sidebar__item">HTTPS and HTTP/2</a>
160
+ </li>
161
+ </ul>
162
+ </section>
163
+ <section class="nav-sidebar__section">
164
+ <ul class="nav-sidebar__list">
165
+ <li>
166
+ <a href="/docs/taps/" class="nav-sidebar__item">Taps</a>
167
+ </li>
168
+ </ul>
169
+ </section>
170
+ <section class="nav-sidebar__section">
171
+ <ul class="nav-sidebar__list">
172
+ <li>
173
+ <a href="/docs/bins/" class="nav-sidebar__item">Bins</a>
174
+ </li>
175
+ </ul>
176
+ </section>
177
+ <section class="nav-sidebar__section">
178
+ <ul class="nav-sidebar__list">
179
+ <li>
180
+ <a href="/docs/configuration/" class="nav-sidebar__item">Configuration</a>
181
+ </li>
182
+ </ul>
183
+ </section>
184
+ <section class="nav-sidebar__section">
185
+ <ul class="nav-sidebar__list">
186
+ <li>
187
+ <a href="/docs/library/" class="nav-sidebar__item">Library API</a>
188
+ </li>
189
+ </ul>
190
+ </section>
191
+ <section class="nav-sidebar__section">
192
+ <ul class="nav-sidebar__list">
193
+ <li>
194
+ <a href="/docs/hosted/" class="nav-sidebar__item">MockHttp.org Live</a>
195
+ </li>
196
+ </ul>
197
+ </section>
198
+ <section class="nav-sidebar__section nav-sidebar__section--collapsible">
199
+ <h2 class="nav-sidebar__title">
200
+ <button type="button" class="nav-sidebar__toggle" aria-expanded="true">
201
+ <span class="nav-sidebar__toggle-label">How to Deploy</span>
202
+ <svg class="nav-sidebar__chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
203
+ </button>
204
+ </h2>
205
+ <ul class="nav-sidebar__list">
206
+ <li>
207
+ <a href="/docs/how-to-deploy/cloudflare/" class="nav-sidebar__item">Cloudflare</a>
208
+ </li>
209
+ <li>
210
+ <a href="/docs/how-to-deploy/docker/" class="nav-sidebar__item">Docker</a>
211
+ </li>
212
+ <li>
213
+ <a href="/docs/how-to-deploy/wasmer/" class="nav-sidebar__item">Wasmer</a>
214
+ </li>
215
+ </ul>
216
+ </section>
217
+ </div>
218
+ </div>
219
+ <div class="content">
220
+ <aside class="nav-sidebar" id="nav-sidebar">
221
+ <section class="nav-sidebar__section">
222
+ <ul class="nav-sidebar__list">
223
+ <li>
224
+ <a href="/docs/" class="nav-sidebar__item">Getting Started</a>
225
+ </li>
226
+ </ul>
227
+ </section>
228
+ <section class="nav-sidebar__section">
229
+ <ul class="nav-sidebar__list">
230
+ <li>
231
+ <a href="/docs/https/" class="nav-sidebar__item">HTTPS and HTTP/2</a>
232
+ </li>
233
+ </ul>
234
+ </section>
235
+ <section class="nav-sidebar__section">
236
+ <ul class="nav-sidebar__list">
237
+ <li>
238
+ <a href="/docs/taps/" class="nav-sidebar__item">Taps</a>
239
+ </li>
240
+ </ul>
241
+ </section>
242
+ <section class="nav-sidebar__section">
243
+ <ul class="nav-sidebar__list">
244
+ <li>
245
+ <a href="/docs/bins/" class="nav-sidebar__item">Bins</a>
246
+ </li>
247
+ </ul>
248
+ </section>
249
+ <section class="nav-sidebar__section">
250
+ <ul class="nav-sidebar__list">
251
+ <li>
252
+ <a href="/docs/configuration/" class="nav-sidebar__item">Configuration</a>
253
+ </li>
254
+ </ul>
255
+ </section>
256
+ <section class="nav-sidebar__section">
257
+ <ul class="nav-sidebar__list">
258
+ <li>
259
+ <a href="/docs/library/" class="nav-sidebar__item">Library API</a>
260
+ </li>
261
+ </ul>
262
+ </section>
263
+ <section class="nav-sidebar__section">
264
+ <ul class="nav-sidebar__list">
265
+ <li>
266
+ <a href="/docs/hosted/" class="nav-sidebar__item">MockHttp.org Live</a>
267
+ </li>
268
+ </ul>
269
+ </section>
270
+ <section class="nav-sidebar__section nav-sidebar__section--collapsible">
271
+ <h2 class="nav-sidebar__title">
272
+ <button type="button" class="nav-sidebar__toggle" aria-expanded="true">
273
+ <span class="nav-sidebar__toggle-label">How to Deploy</span>
274
+ <svg class="nav-sidebar__chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
275
+ </button>
276
+ </h2>
277
+ <ul class="nav-sidebar__list">
278
+ <li>
279
+ <a href="/docs/how-to-deploy/cloudflare/" class="nav-sidebar__item">Cloudflare</a>
280
+ </li>
281
+ <li>
282
+ <a href="/docs/how-to-deploy/docker/" class="nav-sidebar__item">Docker</a>
283
+ </li>
284
+ <li>
285
+ <a href="/docs/how-to-deploy/wasmer/" class="nav-sidebar__item">Wasmer</a>
286
+ </li>
287
+ </ul>
288
+ </section>
289
+ </aside>
290
+ <article class="article">
291
+ <header class="article__header">
292
+ <h1 class="article__title">Taps</h1>
293
+ </header>
294
+ <div class="article__body">
295
+ <main class="article__main">
296
+ <p>The injection/tap feature allows you to "tap into" the request flow and inject custom responses for specific requests. This is particularly useful for:</p>
297
+ <ul>
298
+ <li><strong>Offline testing</strong> - Mock external API responses without network access</li>
299
+ <li><strong>Testing edge cases</strong> - Simulate errors, timeouts, or specific response scenarios</li>
300
+ <li><strong>Development</strong> - Work on your application without depending on external services</li>
301
+ </ul>
302
+ <h2 id="table-of-contents">Table of Contents</h2>
303
+ <ul>
304
+ <li><a href="#what-is-a-tap">What is a "Tap"?</a></li>
305
+ <li><a href="#basic-usage">Basic Usage</a></li>
306
+ <li><a href="#advanced-examples">Advanced Examples</a>
307
+ <ul>
308
+ <li><a href="#inject-json-response">Inject JSON Response</a></li>
309
+ <li><a href="#wildcard-url-matching">Wildcard URL Matching</a></li>
310
+ <li><a href="#multiple-injections">Multiple Injections</a></li>
311
+ <li><a href="#match-by-http-method">Match by HTTP Method</a></li>
312
+ <li><a href="#match-by-headers">Match by Headers</a></li>
313
+ <li><a href="#catch-all-injection">Catch-All Injection</a></li>
314
+ <li><a href="#dynamic-function-response">Dynamic Function Response</a></li>
315
+ </ul>
316
+ </li>
317
+ </ul>
318
+ <h2 id="what-is-a-tap">What is a "Tap"?</h2>
319
+ <p>A "tap" is a reference to an injected response, similar to "wiretapping" - you're intercepting requests and returning predefined responses. Each tap can be removed when you're done with it, restoring normal server behavior.</p>
320
+ <h2 id="basic-usage">Basic Usage</h2>
321
+ <pre><code class="hljs language-javascript"><span class="hljs-keyword">import</span> { mockhttp } <span class="hljs-keyword">from</span> <span class="hljs-string">'@jaredwray/mockhttp'</span>;
322
+
323
+ <span class="hljs-keyword">const</span> mock = <span class="hljs-keyword">new</span> <span class="hljs-title function_">mockhttp</span>();
324
+ <span class="hljs-keyword">await</span> mock.<span class="hljs-title function_">start</span>();
325
+
326
+ <span class="hljs-comment">// Inject a simple response</span>
327
+ <span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
328
+ {
329
+ <span class="hljs-attr">response</span>: <span class="hljs-string">"Hello, World!"</span>,
330
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">200</span>,
331
+ <span class="hljs-attr">headers</span>: { <span class="hljs-string">"Content-Type"</span>: <span class="hljs-string">"text/plain"</span> }
332
+ },
333
+ {
334
+ <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/greeting"</span>,
335
+ <span class="hljs-attr">method</span>: <span class="hljs-string">"GET"</span>
336
+ }
337
+ );
338
+
339
+ <span class="hljs-comment">// Make requests - they will get the injected response</span>
340
+ <span class="hljs-keyword">const</span> response = <span class="hljs-keyword">await</span> <span class="hljs-title function_">fetch</span>(<span class="hljs-string">'http://localhost:3000/api/greeting'</span>);
341
+ <span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-keyword">await</span> response.<span class="hljs-title function_">text</span>()); <span class="hljs-comment">// "Hello, World!"</span>
342
+
343
+ <span class="hljs-comment">// Remove the injection when done</span>
344
+ mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">removeInjection</span>(tap);
345
+
346
+ <span class="hljs-keyword">await</span> mock.<span class="hljs-title function_">close</span>();
347
+ </code></pre>
348
+ <h2 id="advanced-examples">Advanced Examples</h2>
349
+ <h3 id="inject-json-response">Inject JSON Response</h3>
350
+ <pre><code class="hljs language-javascript"><span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
351
+ {
352
+ <span class="hljs-attr">response</span>: { <span class="hljs-attr">message</span>: <span class="hljs-string">"Success"</span>, <span class="hljs-attr">data</span>: { <span class="hljs-attr">id</span>: <span class="hljs-number">123</span> } },
353
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">200</span>
354
+ },
355
+ { <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/users/123"</span> }
356
+ );
357
+ </code></pre>
358
+ <h3 id="wildcard-url-matching">Wildcard URL Matching</h3>
359
+ <pre><code class="hljs language-javascript"><span class="hljs-comment">// Match all requests under /api/</span>
360
+ <span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
361
+ {
362
+ <span class="hljs-attr">response</span>: <span class="hljs-string">"API is mocked"</span>,
363
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">503</span>
364
+ },
365
+ { <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/*"</span> }
366
+ );
367
+ </code></pre>
368
+ <h3 id="multiple-injections">Multiple Injections</h3>
369
+ <pre><code class="hljs language-javascript"><span class="hljs-keyword">const</span> tap1 = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
370
+ { <span class="hljs-attr">response</span>: <span class="hljs-string">"Users data"</span> },
371
+ { <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/users"</span> }
372
+ );
373
+
374
+ <span class="hljs-keyword">const</span> tap2 = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
375
+ { <span class="hljs-attr">response</span>: <span class="hljs-string">"Posts data"</span> },
376
+ { <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/posts"</span> }
377
+ );
378
+
379
+ <span class="hljs-comment">// View all active injections</span>
380
+ <span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(mock.<span class="hljs-property">taps</span>.<span class="hljs-property">injections</span>); <span class="hljs-comment">// Map of all active taps</span>
381
+
382
+ <span class="hljs-comment">// Remove specific injections</span>
383
+ mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">removeInjection</span>(tap1);
384
+ mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">removeInjection</span>(tap2);
385
+ </code></pre>
386
+ <h3 id="match-by-http-method">Match by HTTP Method</h3>
387
+ <pre><code class="hljs language-javascript"><span class="hljs-comment">// Only intercept POST requests</span>
388
+ <span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
389
+ { <span class="hljs-attr">response</span>: <span class="hljs-string">"Created"</span>, <span class="hljs-attr">statusCode</span>: <span class="hljs-number">201</span> },
390
+ { <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/users"</span>, <span class="hljs-attr">method</span>: <span class="hljs-string">"POST"</span> }
391
+ );
392
+ </code></pre>
393
+ <h3 id="match-by-headers">Match by Headers</h3>
394
+ <pre><code class="hljs language-javascript"><span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
395
+ { <span class="hljs-attr">response</span>: <span class="hljs-string">"Authenticated response"</span> },
396
+ {
397
+ <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/secure"</span>,
398
+ <span class="hljs-attr">headers</span>: {
399
+ <span class="hljs-string">"authorization"</span>: <span class="hljs-string">"Bearer token123"</span>
400
+ }
401
+ }
402
+ );
403
+ </code></pre>
404
+ <h3 id="catch-all-injection">Catch-All Injection</h3>
405
+ <pre><code class="hljs language-javascript"><span class="hljs-comment">// Match ALL requests (no matcher specified)</span>
406
+ <span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>({
407
+ <span class="hljs-attr">response</span>: <span class="hljs-string">"Server is in maintenance mode"</span>,
408
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">503</span>
409
+ });
410
+ </code></pre>
411
+ <h3 id="dynamic-function-response">Dynamic Function Response</h3>
412
+ <p>You can provide a function that dynamically generates the response based on the incoming request:</p>
413
+ <pre><code class="hljs language-javascript"><span class="hljs-comment">// Function response with access to the request object</span>
414
+ <span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
415
+ <span class="hljs-function">(<span class="hljs-params">request</span>) =></span> {
416
+ <span class="hljs-keyword">return</span> {
417
+ <span class="hljs-attr">response</span>: {
418
+ <span class="hljs-attr">message</span>: <span class="hljs-string">`You requested <span class="hljs-subst">${request.url}</span>`</span>,
419
+ <span class="hljs-attr">method</span>: request.<span class="hljs-property">method</span>,
420
+ <span class="hljs-attr">timestamp</span>: <span class="hljs-keyword">new</span> <span class="hljs-title class_">Date</span>().<span class="hljs-title function_">toISOString</span>()
421
+ },
422
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">200</span>,
423
+ <span class="hljs-attr">headers</span>: {
424
+ <span class="hljs-string">"X-Request-Path"</span>: request.<span class="hljs-property">url</span>
425
+ }
426
+ };
427
+ },
428
+ { <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/*"</span> }
429
+ );
430
+ </code></pre>
431
+ <pre><code class="hljs language-javascript"><span class="hljs-comment">// Conditional responses based on request</span>
432
+ <span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(<span class="hljs-function">(<span class="hljs-params">request</span>) =></span> {
433
+ <span class="hljs-comment">// Return error for URLs containing 'error'</span>
434
+ <span class="hljs-keyword">if</span> (request.<span class="hljs-property">url</span>.<span class="hljs-title function_">includes</span>(<span class="hljs-string">'error'</span>)) {
435
+ <span class="hljs-keyword">return</span> {
436
+ <span class="hljs-attr">response</span>: { <span class="hljs-attr">error</span>: <span class="hljs-string">"Something went wrong"</span> },
437
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">500</span>
438
+ };
439
+ }
440
+
441
+ <span class="hljs-comment">// Return success for everything else</span>
442
+ <span class="hljs-keyword">return</span> {
443
+ <span class="hljs-attr">response</span>: { <span class="hljs-attr">status</span>: <span class="hljs-string">"success"</span> },
444
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">200</span>
445
+ };
446
+ });
447
+ </code></pre>
448
+ <pre><code class="hljs language-javascript"><span class="hljs-comment">// Dynamic headers based on request</span>
449
+ <span class="hljs-keyword">const</span> tap = mock.<span class="hljs-property">taps</span>.<span class="hljs-title function_">inject</span>(
450
+ <span class="hljs-function">(<span class="hljs-params">request</span>) =></span> ({
451
+ <span class="hljs-attr">response</span>: <span class="hljs-string">"OK"</span>,
452
+ <span class="hljs-attr">statusCode</span>: <span class="hljs-number">200</span>,
453
+ <span class="hljs-attr">headers</span>: {
454
+ <span class="hljs-string">"X-Original-Method"</span>: request.<span class="hljs-property">method</span>,
455
+ <span class="hljs-string">"X-Original-URL"</span>: request.<span class="hljs-property">url</span>,
456
+ <span class="hljs-string">"X-Original-Host"</span>: request.<span class="hljs-property">hostname</span>
457
+ }
458
+ }),
459
+ { <span class="hljs-attr">url</span>: <span class="hljs-string">"/api/mirror"</span> }
460
+ );
461
+ </code></pre>
462
+ </main>
463
+ <aside class="content-aside">
464
+ <h2 class="content-aside__title">TABLE OF CONTENTS</h2>
465
+ <ul class="content-aside__list" id="toc-list">
466
+ </ul>
467
+ </aside>
468
+ </div>
469
+ <a class="article__edit-link" href="https://github.com/jaredwray/mockhttp/edit/main/site/docs/taps.md" target="_blank" rel="noopener noreferrer">
470
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/><path d="m15 5 4 4"/></svg>
471
+ Edit this page
472
+ </a>
473
+ </article>
474
+ </div>
475
+ <footer>
476
+ <a href="/llms.txt" class="footer__link">llms.txt</a>
477
+ <a href="/feed.xml" class="footer__link" aria-label="RSS Feed">
478
+ <svg class="footer__icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><circle cx="6.18" cy="17.82" r="2.18"/><path d="M4 4.44v2.83c7.03 0 12.73 5.7 12.73 12.73h2.83c0-8.59-6.97-15.56-15.56-15.56zm0 5.66v2.83c3.9 0 7.07 3.17 7.07 7.07h2.83c0-5.47-4.43-9.9-9.9-9.9z"/></svg>
479
+ </a>
480
+
481
+ <a href="https://docula.org/" target="_blank" rel="noopener noreferrer" class="footer__link" aria-label="Docula">
482
+ <svg class="footer__bat" xmlns="http://www.w3.org/2000/svg" viewBox="70 110 360 205" fill="currentColor"><path d="M420,173c-16.76-18-72.78-36.65-131.59-30.58A160.15,160.15,0,0,0,269,120.55c-3.78,4.52-11.15,9.45-19,9.45s-15.23-4.93-19-9.45a160.15,160.15,0,0,0-19.4,21.83C152.78,136.31,96.76,154.94,80,173c48.86,5.86,79.5,34.09,79.5,72.06,52.37,0,77,28,90.5,59.94C263.54,273,288.13,245,340.5,245,340.5,207,371.14,178.8,420,173Z"/><circle cx="239.19" cy="145.36" r="3.32" fill="#fff"/><circle cx="260.81" cy="145.36" r="3.32" fill="#fff"/></svg>
483
+ </a>
484
+ <span class="footer__updated">updated: 2026-10-03</span>
485
+ </footer>
486
+ <script src="/css/highlight/highlight.min.js"></script>
487
+ <script>
488
+ document.addEventListener('DOMContentLoaded', () => {
489
+ document.querySelectorAll('pre code').forEach(el => { el.textContent = el.textContent.trimEnd(); });
490
+ hljs.highlightAll();
491
+ var kbd = document.querySelector('.search-button__shortcut');
492
+ if (kbd) kbd.textContent = navigator.platform.indexOf('Mac') > -1 ? '⌘K' : 'Ctrl K';
493
+
494
+ // Copy code buttons
495
+ const copyIcon = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>';
496
+ const checkIcon = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>';
497
+ document.querySelectorAll('pre').forEach(function(pre) {
498
+ const btn = document.createElement('button');
499
+ btn.className = 'copy-code-btn';
500
+ btn.innerHTML = copyIcon;
501
+ btn.setAttribute('aria-label', 'Copy code');
502
+ btn.addEventListener('click', function() {
503
+ const code = pre.querySelector('code');
504
+ const text = code ? code.textContent : pre.textContent;
505
+ navigator.clipboard.writeText(text || '').then(function() {
506
+ btn.innerHTML = checkIcon;
507
+ setTimeout(function() { btn.innerHTML = copyIcon; }, 2000);
508
+ });
509
+ });
510
+ pre.appendChild(btn);
511
+ });
512
+ });
513
+ </script>
514
+ <script>
515
+ (function() {
516
+ var themeKey = window.__doculaThemeKey;
517
+ function getMode() {
518
+ return localStorage.getItem(themeKey) || 'light';
519
+ }
520
+
521
+ function resolveTheme(mode) {
522
+ if (mode === 'system') {
523
+ return window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark';
524
+ }
525
+ return mode;
526
+ }
527
+
528
+ var cachedEls = null;
529
+ function getThemeEls() {
530
+ if (!cachedEls) {
531
+ cachedEls = {
532
+ systemIcon: document.querySelector('.theme-button__icon--system'),
533
+ sunIcon: document.querySelector('.theme-button__icon--sun'),
534
+ moonIcon: document.querySelector('.theme-button__icon--moon'),
535
+ toggle: document.getElementById('theme-toggle')
536
+ };
537
+ }
538
+ return cachedEls;
539
+ }
540
+
541
+ function applyTheme(mode) {
542
+ var resolved = resolveTheme(mode);
543
+ if (resolved === 'light') {
544
+ document.documentElement.setAttribute('data-theme', 'light');
545
+ } else {
546
+ document.documentElement.removeAttribute('data-theme');
547
+ }
548
+
549
+ var els = getThemeEls();
550
+ if (els.systemIcon && els.sunIcon && els.moonIcon) {
551
+ els.systemIcon.classList.add('theme-button__icon--hidden');
552
+ els.sunIcon.classList.add('theme-button__icon--hidden');
553
+ els.moonIcon.classList.add('theme-button__icon--hidden');
554
+ if (mode === 'system') {
555
+ els.systemIcon.classList.remove('theme-button__icon--hidden');
556
+ } else if (mode === 'light') {
557
+ els.sunIcon.classList.remove('theme-button__icon--hidden');
558
+ } else {
559
+ els.moonIcon.classList.remove('theme-button__icon--hidden');
560
+ }
561
+ }
562
+
563
+ if (els.toggle) {
564
+ var labels = { system: 'Theme: system (following system)', light: 'Theme: light', dark: 'Theme: dark' };
565
+ els.toggle.setAttribute('aria-label', labels[mode] || 'Toggle theme');
566
+ }
567
+ }
568
+
569
+ function nextMode(current) {
570
+ var cycle = { system: 'light', light: 'dark', dark: 'system' };
571
+ return cycle[current] || 'system';
572
+ }
573
+
574
+ var currentMode = getMode();
575
+
576
+ document.addEventListener('DOMContentLoaded', function() {
577
+ applyTheme(currentMode);
578
+
579
+ var els = getThemeEls();
580
+ if (els.toggle) {
581
+ els.toggle.addEventListener('click', function() {
582
+ currentMode = nextMode(currentMode);
583
+ localStorage.setItem(themeKey, currentMode);
584
+ applyTheme(currentMode);
585
+ });
586
+ }
587
+ });
588
+
589
+ window.matchMedia('(prefers-color-scheme: light)').addEventListener('change', function() {
590
+ if (getMode() === 'system') {
591
+ applyTheme('system');
592
+ }
593
+ });
594
+ })();
595
+ </script>
596
+ <script defer>
597
+ document.addEventListener('DOMContentLoaded', () => {
598
+ const menuToggle = document.getElementById('mobile-menu-toggle');
599
+ const mobileSidebar = document.getElementById('mobile-sidebar');
600
+ const backdrop = document.getElementById('sidebar-backdrop');
601
+ if (menuToggle && mobileSidebar) {
602
+ menuToggle.addEventListener('click', () => {
603
+ mobileSidebar.classList.toggle('mobile-sidebar--open');
604
+ if (backdrop) backdrop.classList.toggle('sidebar-backdrop--visible');
605
+ });
606
+ if (backdrop) {
607
+ backdrop.addEventListener('click', () => {
608
+ mobileSidebar.classList.remove('mobile-sidebar--open');
609
+ backdrop.classList.remove('sidebar-backdrop--visible');
610
+ });
611
+ }
612
+ }
613
+
614
+ // Page dropdown toggle (docs pages)
615
+ const dropdownToggle = document.getElementById('page-dropdown-toggle');
616
+ const dropdownList = document.getElementById('page-dropdown-list');
617
+ if (dropdownToggle && dropdownList) {
618
+ dropdownToggle.addEventListener('click', () => {
619
+ dropdownList.classList.toggle('page-dropdown__list--open');
620
+ });
621
+ }
622
+
623
+ // Active sidebar link highlighting
624
+ const sidebarLinks = document.querySelectorAll('.nav-sidebar__item');
625
+ const currentPath = window.location.pathname;
626
+ sidebarLinks.forEach((link) => {
627
+ if (link.getAttribute('href') === currentPath || link.getAttribute('href') === currentPath.replace(/\/$/, '')) {
628
+ link.classList.add('nav-sidebar__item--active');
629
+ }
630
+ });
631
+
632
+ // Sidebar section collapse/expand
633
+ const SIDEBAR_STORAGE_KEY = 'docula:sidebar-sections';
634
+ const collapsibleSections = document.querySelectorAll('.nav-sidebar__section--collapsible');
635
+ if (collapsibleSections.length > 0) {
636
+ let storedSectionState = {};
637
+ try {
638
+ storedSectionState = JSON.parse(localStorage.getItem(SIDEBAR_STORAGE_KEY) || '{}');
639
+ } catch (e) { storedSectionState = {}; }
640
+
641
+ const setSectionOpen = (section, toggle, open) => {
642
+ toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
643
+ section.classList.toggle('nav-sidebar__section--collapsed', !open);
644
+ };
645
+
646
+ collapsibleSections.forEach((section, idx) => {
647
+ const toggle = section.querySelector('.nav-sidebar__toggle');
648
+ const list = section.querySelector('.nav-sidebar__list');
649
+ if (!toggle || !list) return;
650
+ const listId = 'nav-sidebar-section-' + idx;
651
+ list.id = listId;
652
+ toggle.setAttribute('aria-controls', listId);
653
+
654
+ const key = 'section-' + idx;
655
+ const hasStored = Object.prototype.hasOwnProperty.call(storedSectionState, key);
656
+ const isOpen = hasStored ? !!storedSectionState[key] : true;
657
+ setSectionOpen(section, toggle, isOpen);
658
+
659
+ toggle.addEventListener('click', () => {
660
+ const next = toggle.getAttribute('aria-expanded') !== 'true';
661
+ setSectionOpen(section, toggle, next);
662
+ storedSectionState[key] = next;
663
+ try {
664
+ localStorage.setItem(SIDEBAR_STORAGE_KEY, JSON.stringify(storedSectionState));
665
+ } catch (e) { /* storage unavailable */ }
666
+ });
667
+ });
668
+ }
669
+
670
+ // Active nav link highlighting (header + mobile). Highlight only the
671
+ // single most-specific link: the one whose path is the longest prefix of
672
+ // the current path. A plain startsWith() check lights up every link whose
673
+ // path merely prefixes the current one, so when the site is embedded under
674
+ // a base path (e.g. served at /developer with docs at that root) the
675
+ // Documentation link — whose path is a prefix of every page — would stay
676
+ // highlighted everywhere. Trailing slashes are normalized so matches stop
677
+ // at a path boundary. We read the anchor's resolved origin/pathname so
678
+ // absolute, relative, and same-origin hrefs all work, while cross-origin
679
+ // links and non-anchor items (e.g. the mobile logout button) are skipped.
680
+ const withTrailingSlash = (p) => (p.endsWith('/') ? p : p + '/');
681
+ const here = withTrailingSlash(currentPath);
682
+ const markActiveNav = (selector, activeClass) => {
683
+ let bestLink = null;
684
+ let bestLength = -1;
685
+ document.querySelectorAll(selector).forEach((link) => {
686
+ // Only same-origin anchors can match the current pathname.
687
+ if (!link.href || link.origin !== window.location.origin) return;
688
+ const base = withTrailingSlash(link.pathname);
689
+ if (here.startsWith(base) && base.length > bestLength) {
690
+ bestLink = link;
691
+ bestLength = base.length;
692
+ }
693
+ });
694
+ if (bestLink) bestLink.classList.add(activeClass);
695
+ };
696
+ markActiveNav('.header-bottom__item', 'header-bottom__item--active');
697
+ markActiveNav('.mobile-nav__item', 'mobile-nav__item--active');
698
+
699
+ // TOC extraction: move the inline TOC into the right sidebar and hide the original
700
+ const tocHeading = document.getElementById('table-of-contents');
701
+ if (tocHeading) {
702
+ const tocList = tocHeading.nextElementSibling;
703
+ const tocTarget = document.getElementById('toc-list');
704
+ if (tocList && tocList.tagName === 'UL' && tocTarget) {
705
+ tocTarget.innerHTML = tocList.innerHTML;
706
+ tocHeading.style.display = 'none';
707
+ tocList.style.display = 'none';
708
+ }
709
+ }
710
+
711
+ // Hide the TOC aside if it has no entries
712
+ const tocSidebar = document.getElementById('toc-list');
713
+ if (tocSidebar && tocSidebar.children.length === 0) {
714
+ const aside = tocSidebar.closest('.content-aside');
715
+ if (aside) { aside.style.display = 'none'; }
716
+ }
717
+
718
+ // Image lightbox
719
+ const lightboxOverlay = document.createElement('div');
720
+ lightboxOverlay.className = 'lightbox-overlay';
721
+ lightboxOverlay.addEventListener('click', function(e) {
722
+ if (e.target !== lightboxImg) lightboxOverlay.classList.remove('lightbox-overlay--visible');
723
+ });
724
+ const lightboxClose = document.createElement('button');
725
+ lightboxClose.className = 'lightbox-close';
726
+ lightboxClose.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>';
727
+ lightboxClose.addEventListener('click', function() {
728
+ lightboxOverlay.classList.remove('lightbox-overlay--visible');
729
+ });
730
+ const lightboxImg = document.createElement('img');
731
+ lightboxOverlay.appendChild(lightboxClose);
732
+ lightboxOverlay.appendChild(lightboxImg);
733
+ document.body.appendChild(lightboxOverlay);
734
+
735
+ document.querySelectorAll('.article__main img, .changelog-entry-body img').forEach(function(img) {
736
+ if (img.closest('a')) return;
737
+ img.addEventListener('click', function() {
738
+ lightboxImg.src = img.src;
739
+ lightboxOverlay.classList.add('lightbox-overlay--visible');
740
+ });
741
+ });
742
+ });
743
+ </script>
744
+ </body>
745
+
746
+ </html>