mockaton 12.3.3 → 12.3.5

package/package.json

@@ -2,7 +2,7 @@
 	"name": "mockaton",
 	"description": "HTTP Mock Server",
 	"type": "module",
-	"version": "12.3.3",
+	"version": "12.3.5",
 	"exports": {
 		".": {
 			"import": "./index.js",

package/src/client/app.js

@@ -734,7 +734,7 @@ function CloudIcon() {
 function HelpIcon() {
 	return (
 		s('svg', { viewBox: '0 0 24 24' },
-			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' })))
+			s('path', { d: 'M11 18h2v-2h-2zm1-16C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8m0-14c-2.21 0-4 1.79-4 4h2c0-1.1.9-2 2-2s2 .9 2 2c0 2-3 1.75-3 5h2c0-2.25 3-2.5 3-5 0-2.21-1.79-4-4-4' })))
 }
 
 

package/src/client/styles.css

@@ -18,7 +18,6 @@
 		--colorDisabledMockSelector: #444;
 		--colorHover: rgba(119, 193, 255, 0.4);
 		--colorLabel: #555;
-		--colorLightRed: #ffe4ee;
 		--colorRed: #da0f00;
 		--colorText: #000;
 		--colorPink: #ed206a;
@@ -41,7 +40,6 @@
 		--colorDisabledMockSelector: #b9b9b9;
 		--colorHover: rgba(0, 63, 115, 0.5);
 		--colorLabel: #aaa;
-		--colorLightRed: #ffe4ee;
 		--colorRed: #f41606;
 		--colorText: #fff;
 		--colorPink: #f92672;
@@ -111,6 +109,7 @@ select {
 	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23888888'><path d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/></svg>") no-repeat;
 	background-size: 16px;
 	background-position: calc(100% - 3px) center;
+	transition: all 240ms ease-out;
 
 	&:enabled {
 		border-color: var(--colorSecondaryActionBorder);
@@ -137,7 +136,7 @@ header {
 		align-self: end;
 		margin-right: 22px;
 		margin-bottom: 3px;
-		opacity: 85%;
+		opacity: 90%;
 		transition: opacity 240ms ease-in-out;
 
 		&:hover {
@@ -182,8 +181,9 @@ header {
 		background: transparent;
 		border-radius: 50px;
 		color: var(--colorRed);
+		
 		@media (prefers-color-scheme: dark) {
-			color: var(--colorLightRed);
+			color: var(--colorText);
 		}
 
 		&:hover {
@@ -217,6 +217,13 @@ header {
 		color: var(--colorLabel);
 		font-size: 11px;
 		gap: 4px;
+		transition: color 200ms ease-out;
+	}
+
+	&:hover {
+		span {
+			color: var(--colorText);
+		}
 	}
 
 	input[type=url],
@@ -412,10 +419,10 @@ main {
 			margin-left: 100px;
 		}
 		&.nonGroupedByMethod {
-			margin-left: 122px;
+			margin-left: 118px;
 
 			&.canProxy {
-				margin-left: 160px;
+				margin-left: 146px;
 			}
 		}
 	}
@@ -583,6 +590,7 @@ main {
 		&:not(:checked):enabled:hover + .checkboxBody {
 			border-color: var(--colorRed);
 			color: var(--colorRed);
+			background: transparent;
 		}
 		&:checked + .checkboxBody {
 			border-color: var(--colorRed);

package/src/server/MockDispatcher.js

@@ -68,7 +68,7 @@ async function applyPlugins(filePath, req, response) {
 }
 
 export async function jsToJsonPlugin(filePath, req, response) {
-	const jsExport = (await import(pathToFileURL(filePath) + '?' + Date.now())).default // date for cache busting
+	const jsExport = (await import(pathToFileURL(filePath))).default
 	const body = typeof jsExport === 'function'
 		? await jsExport(req, response)
 		: JSON.stringify(jsExport, null, 2)

package/src/server/Mockaton.js

@@ -1,3 +1,4 @@
+import { register } from 'node:module'
 import { createServer } from 'node:http'
 
 import pkgJSON from '../../package.json' with { type: 'json' }
@@ -25,6 +26,7 @@ import { watchMocksDir, watchStaticDir } from './Watcher.js'
 
 export function Mockaton(options) {
 	return new Promise((resolve, reject) => {
+		register('./cacheBustResolver.js', import.meta.url)
 		setup(options)
 
 		mockBrokerCollection.init()

package/src/server/cacheBustResolver.js

@@ -0,0 +1,11 @@
+// We register this hook at runtime so it doesn’t interfere with non-dynamic imports. 
+export async function resolve(specifier, context, nextResolve) {
+	const result = await nextResolve(specifier, context)
+	const url = new URL(result.url)
+	url.searchParams.set('t', performance.now())
+	return {
+		...result,
+		url: url.href,
+		shortCircuit: true
+	}
+}