mockaton 12.1.1 → 12.2.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.
- package/package.json +1 -1
- package/src/client/app-store.js +0 -3
- package/src/client/app.js +16 -41
- package/src/client/dom-utils.js +0 -14
- package/src/client/indexHtml.js +2 -2
- package/src/client/styles.css +2 -26
- package/src/server/Api.js +2 -1
package/package.json
CHANGED
package/src/client/app-store.js
CHANGED
|
@@ -26,13 +26,10 @@ export const store = {
|
|
|
26
26
|
|
|
27
27
|
getSyncVersion: api.getSyncVersion,
|
|
28
28
|
|
|
29
|
-
mockatonVersion: '',
|
|
30
|
-
|
|
31
29
|
async fetchState() {
|
|
32
30
|
try {
|
|
33
31
|
const response = await api.getState()
|
|
34
32
|
if (!response.ok) throw response
|
|
35
|
-
store.mockatonVersion = response.headers.get('server').split(' ').pop()
|
|
36
33
|
Object.assign(store, await response.json())
|
|
37
34
|
store.render()
|
|
38
35
|
}
|
package/src/client/app.js
CHANGED
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
createElement as r,
|
|
3
|
+
createSvgElement as s,
|
|
4
|
+
className, restoreFocus, Fragment, adoptCSS
|
|
5
|
+
} from './dom-utils.js'
|
|
2
6
|
|
|
3
7
|
import { store } from './app-store.js'
|
|
4
8
|
import { parseFilename } from './Filename.js'
|
|
@@ -70,7 +74,7 @@ function Header() {
|
|
|
70
74
|
CookieSelector(),
|
|
71
75
|
ProxyFallbackField(),
|
|
72
76
|
ResetButton(),
|
|
73
|
-
|
|
77
|
+
HelpLink()
|
|
74
78
|
)))
|
|
75
79
|
}
|
|
76
80
|
|
|
@@ -134,7 +138,6 @@ function GlobalDelayJitterField() {
|
|
|
134
138
|
}
|
|
135
139
|
|
|
136
140
|
|
|
137
|
-
|
|
138
141
|
function CookieSelector() {
|
|
139
142
|
const { cookies } = store
|
|
140
143
|
const disabled = cookies.length <= 1
|
|
@@ -200,45 +203,17 @@ function ResetButton() {
|
|
|
200
203
|
}
|
|
201
204
|
|
|
202
205
|
|
|
203
|
-
function
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
InfoIcon(),
|
|
212
|
-
Defer(() => SettingsMenu(id))))
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
function SettingsMenu(id) {
|
|
216
|
-
return (
|
|
217
|
-
r('menu', {
|
|
218
|
-
id,
|
|
219
|
-
popover: '',
|
|
220
|
-
className: CSS.SettingsMenu
|
|
221
|
-
},
|
|
222
|
-
|
|
223
|
-
r('div', null,
|
|
224
|
-
r('a', {
|
|
225
|
-
href: 'https://mockaton.com',
|
|
226
|
-
target: '_blank',
|
|
227
|
-
rel: 'noopener noreferrer'
|
|
228
|
-
}, t`Documentation`),
|
|
229
|
-
|
|
230
|
-
r('a', {
|
|
231
|
-
href: 'https://github.com/ericfortis/mockaton',
|
|
232
|
-
target: '_blank',
|
|
233
|
-
rel: 'noopener noreferrer'
|
|
234
|
-
}, t`Source Code`),
|
|
235
|
-
|
|
236
|
-
r('p', null, `v${store.mockatonVersion}`)
|
|
237
|
-
)))
|
|
206
|
+
function HelpLink() {
|
|
207
|
+
return r('a', {
|
|
208
|
+
target: '_blank',
|
|
209
|
+
href: 'https://mockaton.com',
|
|
210
|
+
title: t`Documentation`,
|
|
211
|
+
className: CSS.HelpLink
|
|
212
|
+
},
|
|
213
|
+
HelpIcon())
|
|
238
214
|
}
|
|
239
215
|
|
|
240
216
|
|
|
241
|
-
|
|
242
217
|
/** # Left Side */
|
|
243
218
|
|
|
244
219
|
|
|
@@ -737,10 +712,10 @@ function CloudIcon() {
|
|
|
737
712
|
s('path', { d: 'm6.1 9.1c2.8 0 5 2.3 5 5' })))
|
|
738
713
|
}
|
|
739
714
|
|
|
740
|
-
function
|
|
715
|
+
function HelpIcon() {
|
|
741
716
|
return (
|
|
742
717
|
s('svg', { viewBox: '0 0 24 24' },
|
|
743
|
-
s('path', { d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-
|
|
718
|
+
s('path', { d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 17h-2v-2h2zm2.07-7.75-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25' })))
|
|
744
719
|
}
|
|
745
720
|
|
|
746
721
|
|
package/src/client/dom-utils.js
CHANGED
|
@@ -35,19 +35,6 @@ export function Fragment(...args) {
|
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
|
|
38
|
-
export function Defer(cb) {
|
|
39
|
-
const placeholder = document.createComment('')
|
|
40
|
-
deferred(() => placeholder.replaceWith(cb()))
|
|
41
|
-
return placeholder
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
export function deferred(cb) {
|
|
45
|
-
return window.requestIdleCallback
|
|
46
|
-
? requestIdleCallback(cb)
|
|
47
|
-
: setTimeout(cb, 100) // Safari
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
|
|
51
38
|
export function restoreFocus(cb) {
|
|
52
39
|
const focusQuery = selectorFor(document.activeElement)
|
|
53
40
|
cb()
|
|
@@ -94,7 +81,6 @@ export function adoptCSS(sheet) {
|
|
|
94
81
|
export function extractClassNames({ cssRules }) {
|
|
95
82
|
// Class names must begin with _ or a letter, then it can have numbers and hyphens
|
|
96
83
|
const reClassName = /(?:^|[\s,{>])&?\s*\.([a-zA-Z_][\w-]*)/g
|
|
97
|
-
|
|
98
84
|
const cNames = {}
|
|
99
85
|
let match
|
|
100
86
|
for (const rule of cssRules)
|
package/src/client/indexHtml.js
CHANGED
|
@@ -8,7 +8,7 @@ export const CSP = [
|
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
// language=html
|
|
11
|
-
export const IndexHtml = hotReloadEnabled => `
|
|
11
|
+
export const IndexHtml = (hotReloadEnabled, version) => `
|
|
12
12
|
<!DOCTYPE html>
|
|
13
13
|
<html lang="en-US">
|
|
14
14
|
<head>
|
|
@@ -21,7 +21,7 @@ export const IndexHtml = hotReloadEnabled => `
|
|
|
21
21
|
<link rel="icon" href="data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m235 33.7v202c0 9.19-5.81 14-17.4 14-11.6 0-17.4-4.83-17.4-14v-151c-0.115-4.49-6.72-5.88-8.46-0.87l-48.3 155c-2.22 7.01-7.72 10.1-16 9.9-3.63-0.191-7.01-1.14-9.66-2.89-2.89-1.72-4.83-4.34-5.57-7.72-11.1-37-22.6-74.3-34.1-111-4.34-14-8.95-31.4-14-48.3-1.82-4.83-8.16-5.32-8.46 1.16v156c0 9.19-5.81 14-17.4 14-11.6 0-17.4-4.83-17.4-14v-207c0-5.74 2.62-13.2 9.39-16.3 7.5-3.14 15-4.05 21.8-3.8 3.14 0 6.03 0.686 8.95 1.46 3.14 0.797 6.03 1.98 8.7 3.63 2.65 1.38 5.32 3.14 7.5 5.57 2.22 2.22 3.87 4.83 5.07 7.72l45.8 157c4.63-15.9 32.4-117 33.3-121 4.12-13.8 7.72-26.5 10.9-38.7 1.16-2.65 2.89-5.32 5.07-7.5 2.15-2.15 4.58-4.12 7.5-5.32 2.65-1.57 5.57-2.89 8.46-3.63 3.14-0.797 9.44-0.988 12.1-0.988 11.6 1.07 29.4 9.14 29.4 27z' fill='%23808080'/%3E%3C/svg%3E">
|
|
22
22
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
23
23
|
<meta name="description" content="HTTP Mock Server">
|
|
24
|
-
<title>Mockaton</title>
|
|
24
|
+
<title>Mockaton v${version}</title>
|
|
25
25
|
</head>
|
|
26
26
|
<body>
|
|
27
27
|
${hotReloadEnabled
|
package/src/client/styles.css
CHANGED
|
@@ -163,7 +163,7 @@ header {
|
|
|
163
163
|
gap: 16px 12px;
|
|
164
164
|
|
|
165
165
|
@media (max-width: 590px) {
|
|
166
|
-
.
|
|
166
|
+
.HelpLink {
|
|
167
167
|
margin-left: unset;
|
|
168
168
|
}
|
|
169
169
|
}
|
|
@@ -192,16 +192,13 @@ header {
|
|
|
192
192
|
}
|
|
193
193
|
}
|
|
194
194
|
|
|
195
|
-
.
|
|
195
|
+
.HelpLink {
|
|
196
196
|
width: 24px;
|
|
197
197
|
height: 24px;
|
|
198
198
|
flex-shrink: 0;
|
|
199
199
|
align-self: end;
|
|
200
|
-
margin-bottom: 2px;
|
|
201
200
|
margin-left: auto;
|
|
202
201
|
fill: var(--colorSecondaryAction);
|
|
203
|
-
background: transparent;
|
|
204
|
-
border-radius: 50%;
|
|
205
202
|
|
|
206
203
|
&:hover {
|
|
207
204
|
fill: var(--colorAccent);
|
|
@@ -310,27 +307,6 @@ header {
|
|
|
310
307
|
}
|
|
311
308
|
}
|
|
312
309
|
|
|
313
|
-
.SettingsMenu {
|
|
314
|
-
position: absolute;
|
|
315
|
-
top: 62px;
|
|
316
|
-
right: 10px;
|
|
317
|
-
left: auto;
|
|
318
|
-
border: 1px solid var(--colorSecondaryActionBorder);
|
|
319
|
-
color: var(--colorText);
|
|
320
|
-
border-radius: var(--radius);
|
|
321
|
-
box-shadow: var(--boxShadow1);
|
|
322
|
-
background: var(--colorHeaderBackground);
|
|
323
|
-
|
|
324
|
-
> div {
|
|
325
|
-
display: inline-flex;
|
|
326
|
-
flex-direction: column;
|
|
327
|
-
padding: 20px;
|
|
328
|
-
cursor: auto;
|
|
329
|
-
gap: 12px;
|
|
330
|
-
text-align: left;
|
|
331
|
-
|
|
332
|
-
}
|
|
333
|
-
}
|
|
334
310
|
|
|
335
311
|
main {
|
|
336
312
|
display: flex;
|
package/src/server/Api.js
CHANGED
|
@@ -12,6 +12,7 @@ import {
|
|
|
12
12
|
} from './WatcherDevClient.js'
|
|
13
13
|
import { longPollClientSyncVersion } from './Watcher.js'
|
|
14
14
|
|
|
15
|
+
import pkgJSON from '../../package.json' with { type: 'json' }
|
|
15
16
|
import { IndexHtml, CSP } from '../client/indexHtml.js'
|
|
16
17
|
|
|
17
18
|
import { API } from './ApiConstants.js'
|
|
@@ -59,7 +60,7 @@ export const apiPatchReqs = new Map([
|
|
|
59
60
|
/** # GET */
|
|
60
61
|
|
|
61
62
|
function serveDashboard(_, response) {
|
|
62
|
-
response.html(IndexHtml(config.hotReload), CSP)
|
|
63
|
+
response.html(IndexHtml(config.hotReload, pkgJSON.version), CSP)
|
|
63
64
|
}
|
|
64
65
|
|
|
65
66
|
function serveStatic(f) {
|