mockaton 10.6.5 → 10.6.7
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/Api.js +2 -2
- package/src/ApiCommander.js +4 -10
- package/src/ApiConstants.js +1 -1
- package/src/Dashboard.css +42 -52
- package/src/Dashboard.js +137 -492
- package/src/DashboardDom.js +81 -0
- package/src/DashboardHtml.js +2 -0
- package/src/DashboardStore.js +467 -0
- package/src/MockBroker.js +3 -3
- package/src/mockBrokersCollection.js +2 -2
package/package.json
CHANGED
package/src/Api.js
CHANGED
|
@@ -21,7 +21,7 @@ export const apiGetRequests = new Map([
|
|
|
21
21
|
...[
|
|
22
22
|
'Dashboard.css',
|
|
23
23
|
'Dashboard.js',
|
|
24
|
-
'ApiConstants.js', 'ApiCommander.js', 'Filename.js',
|
|
24
|
+
'ApiConstants.js', 'ApiCommander.js', 'Filename.js', 'DashboardStore.js', 'DashboardDom.js',
|
|
25
25
|
'Logo.svg'
|
|
26
26
|
].map(f => [API.dashboard + '/' + f, serveStatic(f)]),
|
|
27
27
|
|
|
@@ -107,7 +107,7 @@ async function selectCookie(req, response) {
|
|
|
107
107
|
if (error)
|
|
108
108
|
sendUnprocessableContent(response, error?.message || error)
|
|
109
109
|
else
|
|
110
|
-
|
|
110
|
+
sendJSON(response, cookie.list())
|
|
111
111
|
}
|
|
112
112
|
|
|
113
113
|
async function selectMock(req, response) {
|
package/src/ApiCommander.js
CHANGED
|
@@ -4,31 +4,25 @@ import { API, DF, LONG_POLL_SERVER_TIMEOUT } from './ApiConstants.js'
|
|
|
4
4
|
/** Client for controlling Mockaton via its HTTP API */
|
|
5
5
|
export class Commander {
|
|
6
6
|
#addr = ''
|
|
7
|
-
#then = a => a
|
|
8
|
-
#catch = e => { throw e }
|
|
9
7
|
|
|
10
|
-
constructor(addr
|
|
8
|
+
constructor(addr) {
|
|
11
9
|
this.#addr = addr
|
|
12
|
-
if (_then) this.#then = _then
|
|
13
|
-
if (_catch) this.#catch = _catch
|
|
14
10
|
}
|
|
15
11
|
|
|
16
|
-
#patch(api, body) {
|
|
12
|
+
#patch = (api, body) => {
|
|
17
13
|
return fetch(this.#addr + api, {
|
|
18
14
|
method: 'PATCH',
|
|
19
15
|
body: JSON.stringify(body)
|
|
20
16
|
})
|
|
21
|
-
.then(this.#then)
|
|
22
|
-
.catch(this.#catch)
|
|
23
17
|
}
|
|
24
18
|
|
|
25
19
|
/** @returns {JsonPromise<State>} */
|
|
26
|
-
getState() {
|
|
20
|
+
getState = () => {
|
|
27
21
|
return fetch(this.#addr + API.state)
|
|
28
22
|
}
|
|
29
23
|
|
|
30
24
|
/** @returns {JsonPromise<number>} */
|
|
31
|
-
getSyncVersion(currentSyncVersion, abortSignal) {
|
|
25
|
+
getSyncVersion = (currentSyncVersion, abortSignal) => {
|
|
32
26
|
return fetch(this.#addr + API.syncVersion, {
|
|
33
27
|
signal: AbortSignal.any([abortSignal, AbortSignal.timeout(LONG_POLL_SERVER_TIMEOUT + 1000)]),
|
|
34
28
|
headers: {
|
package/src/ApiConstants.js
CHANGED
|
@@ -30,7 +30,7 @@ export const DF = { // Dashboard Fields (XHR)
|
|
|
30
30
|
|
|
31
31
|
// TODO @ThinkAbout these affecting partial matches when bulk-selecting
|
|
32
32
|
// e.g. 'ton' would match
|
|
33
|
-
export const
|
|
33
|
+
export const AUTO_500_COMMENT = '(Mockaton 500)'
|
|
34
34
|
export const DEFAULT_MOCK_COMMENT = '(default)'
|
|
35
35
|
|
|
36
36
|
export const EXT_FOR_UNKNOWN_MIME = 'unknown'
|
package/src/Dashboard.css
CHANGED
|
@@ -20,23 +20,14 @@
|
|
|
20
20
|
--colorLightRed: #ffe4ee;
|
|
21
21
|
--colorRed: #da0f00;
|
|
22
22
|
--colorText: #000;
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
}
|
|
27
|
-
.syntaxKey, .syntaxTag {
|
|
28
|
-
color: #ed206a
|
|
29
|
-
}
|
|
30
|
-
.syntaxVal, .syntaxAttr {
|
|
31
|
-
color: #9b71e8
|
|
32
|
-
}
|
|
33
|
-
.syntaxStr, .syntaxAttrVal {
|
|
34
|
-
color: #388E3C
|
|
23
|
+
--colorPink: #ed206a;
|
|
24
|
+
--colorPurple: #9b71e8;
|
|
25
|
+
--colorGreen: #388e3c;
|
|
35
26
|
}
|
|
36
27
|
}
|
|
37
28
|
@media (prefers-color-scheme: dark) {
|
|
38
29
|
:root {
|
|
39
|
-
--color4xxBackground: #
|
|
30
|
+
--color4xxBackground: #68554a;
|
|
40
31
|
--colorAccent: #2495ff;
|
|
41
32
|
--colorBackground: #181818;
|
|
42
33
|
--colorHeaderBackground: #111;
|
|
@@ -51,18 +42,9 @@
|
|
|
51
42
|
--colorLightRed: #ffe4ee;
|
|
52
43
|
--colorRed: #f41606;
|
|
53
44
|
--colorText: #fff;
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
}
|
|
58
|
-
.syntaxKey, .syntaxTag {
|
|
59
|
-
color: #f92672
|
|
60
|
-
}
|
|
61
|
-
.syntaxVal, .syntaxAttr {
|
|
62
|
-
color: #ae81ff
|
|
63
|
-
}
|
|
64
|
-
.syntaxStr, .syntaxAttrVal {
|
|
65
|
-
color: #a6e22e
|
|
45
|
+
--colorPink: #f92672;
|
|
46
|
+
--colorPurple: #ae81ff;
|
|
47
|
+
--colorGreen: #a6e22e;
|
|
66
48
|
}
|
|
67
49
|
}
|
|
68
50
|
|
|
@@ -95,6 +77,8 @@ body {
|
|
|
95
77
|
}
|
|
96
78
|
|
|
97
79
|
select, a, input, button {
|
|
80
|
+
cursor: pointer;
|
|
81
|
+
|
|
98
82
|
&:focus-visible {
|
|
99
83
|
outline: 2px solid var(--colorAccent);
|
|
100
84
|
}
|
|
@@ -104,15 +88,10 @@ a {
|
|
|
104
88
|
text-decoration: none;
|
|
105
89
|
}
|
|
106
90
|
|
|
107
|
-
a,
|
|
108
|
-
button,
|
|
109
|
-
input[type=checkbox]
|
|
110
|
-
|
|
111
|
-
cursor: pointer;
|
|
112
|
-
|
|
113
|
-
&:active {
|
|
114
|
-
cursor: grabbing;
|
|
115
|
-
}
|
|
91
|
+
a:active,
|
|
92
|
+
button:active,
|
|
93
|
+
input[type=checkbox]:active {
|
|
94
|
+
cursor: grabbing;
|
|
116
95
|
}
|
|
117
96
|
|
|
118
97
|
select {
|
|
@@ -270,8 +249,11 @@ header {
|
|
|
270
249
|
margin-left: 4px;
|
|
271
250
|
outline-offset: 1px;
|
|
272
251
|
background: transparent;
|
|
273
|
-
color: var(--colorRed);
|
|
274
252
|
border-radius: 50px;
|
|
253
|
+
color: var(--colorRed);
|
|
254
|
+
@media (prefers-color-scheme: dark) {
|
|
255
|
+
color: var(--colorLightRed);
|
|
256
|
+
}
|
|
275
257
|
|
|
276
258
|
&:hover {
|
|
277
259
|
background: var(--colorRed);
|
|
@@ -343,7 +325,7 @@ main {
|
|
|
343
325
|
}
|
|
344
326
|
|
|
345
327
|
.leftSide {
|
|
346
|
-
|
|
328
|
+
width: 50%; /* resizable in js */
|
|
347
329
|
padding: 16px;
|
|
348
330
|
border-right: 1px solid var(--colorSecondaryActionBorder);
|
|
349
331
|
user-select: none;
|
|
@@ -389,10 +371,6 @@ table {
|
|
|
389
371
|
}
|
|
390
372
|
}
|
|
391
373
|
|
|
392
|
-
.empty {
|
|
393
|
-
margin-top: 80px;
|
|
394
|
-
}
|
|
395
|
-
|
|
396
374
|
.Method {
|
|
397
375
|
padding-right: 8px;
|
|
398
376
|
color: var(--colorSecondaryAction);
|
|
@@ -419,6 +397,10 @@ table {
|
|
|
419
397
|
color: white;
|
|
420
398
|
background: var(--colorAccent);
|
|
421
399
|
}
|
|
400
|
+
.dittoDir {
|
|
401
|
+
opacity: 0.9;
|
|
402
|
+
filter: saturate(0.1);
|
|
403
|
+
}
|
|
422
404
|
}
|
|
423
405
|
|
|
424
406
|
|
|
@@ -467,7 +449,6 @@ table {
|
|
|
467
449
|
}
|
|
468
450
|
|
|
469
451
|
> svg {
|
|
470
|
-
vertical-align: bottom;
|
|
471
452
|
fill: none;
|
|
472
453
|
stroke: var(--colorSecondaryAction);
|
|
473
454
|
}
|
|
@@ -582,6 +563,9 @@ table {
|
|
|
582
563
|
border-color: var(--colorRed);
|
|
583
564
|
color: var(--colorRed);
|
|
584
565
|
}
|
|
566
|
+
&:active {
|
|
567
|
+
cursor: grabbing;
|
|
568
|
+
}
|
|
585
569
|
}
|
|
586
570
|
}
|
|
587
571
|
|
|
@@ -592,25 +576,38 @@ table {
|
|
|
592
576
|
flex-direction: column;
|
|
593
577
|
padding-top: 16px;
|
|
594
578
|
|
|
595
|
-
h2 {
|
|
579
|
+
> h2 {
|
|
596
580
|
padding-bottom: 4px;
|
|
597
581
|
padding-left: 16px;
|
|
598
582
|
}
|
|
599
583
|
|
|
600
|
-
pre {
|
|
584
|
+
> pre {
|
|
601
585
|
overflow: auto;
|
|
602
586
|
height: 100%;
|
|
603
587
|
padding: 16px;
|
|
604
588
|
padding-top: 12px;
|
|
605
589
|
font-family: monospace;
|
|
606
590
|
|
|
607
|
-
code {
|
|
591
|
+
> code {
|
|
608
592
|
white-space: pre;
|
|
609
593
|
tab-size: 2;
|
|
610
594
|
|
|
611
|
-
.json {
|
|
595
|
+
> .json {
|
|
612
596
|
color: var(--colorSecondaryAction);
|
|
613
597
|
}
|
|
598
|
+
|
|
599
|
+
.syntaxPunc {
|
|
600
|
+
color: var(--colorSecondaryAction);
|
|
601
|
+
}
|
|
602
|
+
.syntaxKey, .syntaxTag {
|
|
603
|
+
color: var(--colorPink);
|
|
604
|
+
}
|
|
605
|
+
.syntaxVal, .syntaxAttr {
|
|
606
|
+
color: var(--colorPurple);
|
|
607
|
+
}
|
|
608
|
+
.syntaxStr, .syntaxAttrVal {
|
|
609
|
+
color: var(--colorGreen);
|
|
610
|
+
}
|
|
614
611
|
}
|
|
615
612
|
}
|
|
616
613
|
}
|
|
@@ -640,13 +637,6 @@ table {
|
|
|
640
637
|
}
|
|
641
638
|
}
|
|
642
639
|
|
|
643
|
-
.red {
|
|
644
|
-
color: var(--colorRed);
|
|
645
|
-
}
|
|
646
|
-
|
|
647
|
-
.dittoDir {
|
|
648
|
-
opacity: 0.6;
|
|
649
|
-
}
|
|
650
640
|
|
|
651
641
|
.ErrorToast {
|
|
652
642
|
position: fixed;
|