mockaton 1.0.0 → 2.0.0

package/README.md

@@ -26,6 +26,26 @@ UI, or programmatically, for instance, for setting up tests.
 
 The first file in **alphabetical order** becomes the default mock.
 
+### Optionally, you can write mocks in JavaScript
+An Object, Array, or String is sent as JSON.
+
+`api/user/likes.GET.200.js`
+```js
+export default [
+  { id: 0 }
+]
+```
+
+Or, export default a function. There, you
+can override the response status and the default JSON content
+type. But don’t call `response.end()`, just return a string.
+```js
+export default function (req, response) {
+  return JSON.stringify({ a: 1 })
+}
+```
+
+
 ### Proxying Routes
 `Config.proxyFallback` lets you specify a target
 server for serving routes you don’t have mocks for.
@@ -75,10 +95,9 @@ interface Config {
   port?: number // defaults to 0, which means auto-assigned
   delay?: number // defaults to 1200 (ms)
   cookies?: object 
-  database?: object // for "Transforms"
   skipOpen?: boolean // Prevents opening the dashboard in a browser
   proxyFallback?: string // e.g. http://localhost:9999 Target for relaying routes without mocks
-  allowedExt?: RegExp // /\.(json|txt|md|mjs)$/ Just for excluding temporary editor files (e.g. JetBrains appends a ~)
+  allowedExt?: RegExp // /\.(json|txt|md|js)$/ Just for excluding temporary editor files (e.g. JetBrains appends a ~)
 }
 ```
 
@@ -164,19 +183,6 @@ api/foo/[user-id].POST.201.md
 api/foo/[user-id].POST.201.json
 ```
 
-## Transforms (.mjs)
-Using the same filename convention, files ending
-with `.mjs` will process the mock before serving it.
-
-For example, this handler will capitalize the mock body and increment a counter.
-```js
-export default function capitalizeAllText(mockAsText, requestBody, config) {
-  config.database.myCount ??= 0
-  config.database.myCount++
-  return mockAsText.toUpperCase()
-}
-```
-
 
 ## API
 
@@ -223,14 +229,6 @@ Sends a list of the available cookies along with a flag indicated if it’s the
 fetch(addr + '/mockaton/cookies')
 ```
 
-### Select a Transform
-```js
-fetch(addr + '/mockaton/transform', {
-  method: 'PATCH',
-  body: JSON.stringify('api/video/list(concat newly uploaded).GET.200.mjs')
-})
-```
-
 ### Update Fallback Proxy
 ```js
 fetch(addr + '/mockaton/fallback', {

package/Tests.js

@@ -96,6 +96,9 @@ write('api/.GET.500.txt', 'keeps non-autogenerated 500')
 write('api/alternative(comment-2).GET.200.json', JSON.stringify({ comment: 2 }))
 write('api/my-route(comment-2).GET.200.json', JSON.stringify({ comment: 2 }))
 
+// JavaScript to JSON
+write('/api/object.GET.200.js', 'export default { JSON_FROM_JS: true }')
+
 writeStatic('index.html', '<h1>Static</h1>')
 writeStatic('assets/app.js', 'const app = 1')
 writeStatic('another-entry/index.html', '<h1>Another</h1>')
@@ -154,9 +157,11 @@ async function runTests() {
 	await reset()
 	for (const [url, file, body] of fixtures)
 		await testMockDispatching(url, file, body)
+	
+	await testMockDispatching('/api/object', 'api/object.GET.200.js', { JSON_FROM_JS: true }, mimeFor('.json'))
+	await testJsFunctionMocks()
 
 	await testItUpdatesUserRole()
-	await testTransforms()
 	await testStaticFileServing()
 	await testInvalidFilenamesAreIgnored()
 	await testEnableFallbackSoRoutesWithoutMocksGetRelayed()
@@ -185,11 +190,11 @@ async function test404() {
 	})
 }
 
-async function testMockDispatching(url, file, expectedBody, reqBody = void 0) {
+async function testMockDispatching(url, file, expectedBody, forcedMime = void 0) {
 	const { urlMask, method, status } = Route.parseFilename(file)
-	const mime = mimeFor(file)
+	const mime = forcedMime || mimeFor(file)
 	const now = new Date()
-	const res = await request(url, { method, body: reqBody })
+	const res = await request(url, { method })
 	const body = mime === 'application/json'
 		? await res.json()
 		: await res.text()
@@ -300,25 +305,18 @@ async function testItUpdatesUserRole() {
 	})
 }
 
-async function testTransforms() {
-	await describe('Applies transform', async () => {
-		write('api/transform.POST.200.json', JSON.stringify(['initial']))
-		write('api/transform.POST.200.mjs', `
-export default function (mock, reqBody, config) {
-  const body = JSON.parse(mock);
-  body.push(reqBody[0]);
-  body.push(config.mocksDir);
-  return JSON.stringify(body);
+async function testJsFunctionMocks() {
+	await describe('JS Function Mocks', async () => {
+		write('api/js-func.POST.200.js', `
+export default function (req, response) {
+  response.setHeader('content-type', 'custom-mime')
+  return 'SOME_STRING'
 }`)
-		await reset() // for registering the files
-		await request(API.transform, {
-			method: 'PATCH',
-			body: JSON.stringify('api/transform.POST.200.mjs')
-		})
-		await testMockDispatching('/api/transform',
-			'api/transform.POST.200.json',
-			['initial', 'another', tmpDir],
-			JSON.stringify(['another']))
+		await reset() // for registering the file
+		await testMockDispatching('/api/js-func',
+			'api/js-func.POST.200.js',
+			'SOME_STRING',
+			'custom-mime')
 	})
 }
 

package/package.json

@@ -2,7 +2,7 @@
 	"name": "mockaton",
 	"description": "A deterministic server-side for developing and testing frontend clients",
 	"type": "module",
-	"version": "1.0.0",
+	"version": "2.0.0",
 	"main": "index.js",
 	"types": "index.d.ts",
 	"license": "MIT",

package/sample-mocks/api/user/likes.GET.200.js

@@ -0,0 +1,7 @@
+// You can write JSON responses in JavaScript.
+
+export default [
+	{ id: 0 },
+	{ id: 1 },
+	{ id: 2 },
+]

package/sample-mocks/api/user/loves.GET.200.js

@@ -0,0 +1,7 @@
+// You can write JSON responses in JavaScript.
+
+export default function (req, response) {
+	return JSON.stringify([
+		{ id: 0 }
+	])
+}

package/src/Api.js

@@ -28,7 +28,6 @@ export const apiPatchRequests = new Map([
 	[API.edit, updateBroker],
 	[API.reset, reinitialize],
 	[API.cookies, selectCookie],
-	[API.transform, updateBrokerTransform],
 	[API.fallback, updateProxyFallback]
 ])
 
@@ -92,19 +91,6 @@ async function bulkUpdateBrokersByCommentTag(req, response) {
 	}
 }
 
-async function updateBrokerTransform(req, response) {
-	try {
-		const file = await parseJSON(req)
-		const broker = mockBrokersCollection.getBrokerByFilename(file)
-		broker.updateTransform(file)
-		sendOK(response)
-	}
-	catch (error) {
-		console.error(error)
-		sendBadRequest(response)
-	}
-}
-
 async function updateProxyFallback(req, response) {
 	try {
 		Config.proxyFallback = await parseJSON(req)

package/src/ApiConstants.js

@@ -6,13 +6,11 @@ export const API = {
 	edit: MOUNT + '/edit',
 	mocks: MOUNT + '/mocks',
 	reset: MOUNT + '/reset',
-	transform: MOUNT + '/transform',
 	cookies: MOUNT + '/cookies',
 	fallback: MOUNT + '/fallback'
 }
 
 export const DF = { // Dashboard Fields (XHR)
 	delayed: 'delayed',
-	file: 'file',
-	isForDashboard: 'mock_request_payload'
+	file: 'file'
 }

package/src/Config.js

@@ -1,4 +1,4 @@
-import { existsSync, lstatSync } from 'node:fs'
+import { existsSync as exists, lstatSync } from 'node:fs'
 import { validate, is, optional } from './utils/validate.js'
 
 
@@ -12,7 +12,7 @@ export const Config = {
 	database: {},
 	skipOpen: false,
 	proxyFallback: '', // e.g. http://localhost:9999
-	allowedExt: /\.(json|txt|md|mjs)$/ // Just for excluding temporary editor files (e.g. JetBrains appends a ~)
+	allowedExt: /\.(json|txt|md|js)$/ // Just for excluding temporary editor files (e.g. JetBrains appends a ~)
 }
 
 export function setup(options) {
@@ -32,7 +32,7 @@ export function setup(options) {
 }
 
 function isDirectory(dir) {
-	return existsSync(dir) && lstatSync(dir).isDirectory()
+	return exists(dir) && lstatSync(dir).isDirectory()
 }
 
 

package/src/Dashboard.css

@@ -135,17 +135,11 @@ main {
 .BulkSelectSection {
 	margin: 20px 0;
 }
-.TransformsSection {
-	padding-top: 30px;
-	border-top: 1px solid #ccc;
-	margin: 30px 0;
-}
 
 .BulkSelectSection select {
 	margin-top: 5px;
 }
 
-.TransformSelector,
 .MockSelector {
 	width: 300px;
 	padding: 8px 1px;

package/src/Dashboard.js

@@ -10,11 +10,9 @@ const Strings = {
 	empty_response_body: '/* Empty Response Body */',
 	fetching: '⌚ Fetching…',
 	mock: 'Mock',
-	none: 'None',
 	reset: 'Reset',
 	select_one: 'Select One',
-	title: 'Mockaton',
-	transforms: 'Transforms'
+	title: 'Mockaton'
 }
 
 const CSS = {
@@ -26,8 +24,6 @@ const CSS = {
 	PayloadViewer: 'PayloadViewer',
 	PreviewLink: 'PreviewLink',
 	TitleWrap: 'TitleWrap',
-	TransformSelector: 'TransformSelector',
-	TransformsSection: 'TransformsSection',
 
 	bold: 'bold',
 	chosen: 'chosen',
@@ -74,10 +70,7 @@ function DevPanel(brokersByMethod, cookies, comments) {
 				r('div', { className: CSS.PayloadViewer },
 					r('pre', { ref: refDocumentation, className: CSS.Documentation }),
 					r('h2', { ref: refPayloadFile }, Strings.mock),
-					r('pre', { ref: refPayloadViewer }, Strings.click_link_to_preview))),
-			r('div', { className: CSS.TransformsSection },
-				r('h2', null, Strings.transforms),
-				r(Transforms, { brokersByMethod }))))
+					r('pre', { ref: refPayloadViewer }, Strings.click_link_to_preview)))))
 }
 
 
@@ -142,7 +135,7 @@ function SectionByMethod({ method, brokers }) {
 			r('th', null, method),
 			Object.entries(brokers)
 				.sort((a, b) => a[0].localeCompare(b[0]))
-				.filter(([, broker]) => broker.mocks.length) // handles Markdown doc or js transform without mocks
+				.filter(([, broker]) => broker.mocks.length) // handles Markdown doc
 				.map(([urlMask, broker]) =>
 					r('tr', null,
 						r('td', null, r(PreviewLink, { method, urlMask, documentation: broker.documentation })),
@@ -168,8 +161,7 @@ function PreviewLink({ method, urlMask, documentation }) {
 
 					const spinner = setTimeout(() => refPayloadViewer.current.innerText = Strings.fetching, 180)
 					const res = await fetch(this.href, {
-						method: this.getAttribute('data-method'),
-						headers: { [DF.isForDashboard]: '1' }
+						method: this.getAttribute('data-method')
 					})
 					document.querySelector(`.${CSS.PreviewLink}.${CSS.chosen}`)?.classList.remove(CSS.chosen)
 					this.classList.add(CSS.chosen)
@@ -246,47 +238,6 @@ function TimerIcon() {
 }
 
 
-function Transforms({ brokersByMethod }) {
-	const brokersWithTransforms = []
-	for (const brokers of Object.values(brokersByMethod))
-		for (const [urlMask, broker] of Object.entries(brokers))
-			if (broker.transforms.length)
-				brokersWithTransforms.push([urlMask, broker])
-	return (
-		r('table', null, brokersWithTransforms.map(([urlMask, broker]) =>
-			r('tr', null,
-				r('td', null, r(PreviewLink, { method: broker.method, urlMask })),
-				r('td', null, r(TransformSelector, {
-					items: ['', ...broker.transforms],
-					selected: broker.currentTransform
-				})))
-		)))
-}
-
-function TransformSelector({ items, selected }) {
-	const className = defaultIsSelected => cssClass(
-		CSS.TransformSelector,
-		!defaultIsSelected && CSS.bold)
-	return (
-		r('select', {
-			className: className(selected === items[0]),
-			autocomplete: 'off',
-			onChange() {
-				fetch(API.transform, {
-					method: 'PATCH',
-					body: JSON.stringify(this.value)
-				}).then(() => {
-					this.closest('tr').querySelector('a').click()
-					this.className = className(this.value === this.options[0].value)
-				})
-			}
-		}, items.map(item =>
-			r('option', {
-				value: item,
-				selected: item === selected
-			}, item || Strings.none))))
-}
-
 
 /* === Utils === */
 function cssClass(...args) {

package/src/MockBroker.js

@@ -5,9 +5,9 @@ import { Route } from './Route.js'
 import { Config } from './Config.js'
 
 
-// MockBroker is a state for a particular route. It knows the available mock files
-// that can be served for the route, the currently selected file, and its delay. Also,
-// knows if the route has js preprocessors (transforms) and documentation (md).
+// MockBroker is a state for a particular route. It knows the available
+// mock files that can be served for the route, the currently selected
+// file, and its delay. Also, knows if the route has documentation (md).
 export class MockBroker {
 	#route
 
@@ -17,23 +17,18 @@ export class MockBroker {
 
 		this.documentation = '' // .md
 
-		this.mocks = [] // *.json,txt
+		this.mocks = [] // *.json,txt,js
 		this.currentMock = {
 			file: '',
 			delay: 0
 		}
 
-		this.transforms = [] // *.mjs
-		this.currentTransform = ''
-
 		this.register(file)
 	}
 
 	register(file) {
 		if (file.endsWith('.md'))
 			this.documentation = file
-		else if (file.endsWith('.mjs'))
-			this.transforms.push(file)
 		else {
 			if (!this.mocks.length)
 				this.currentMock.file = file // The first mock file option for a particular route becomes the default
@@ -55,26 +50,17 @@ export class MockBroker {
 		this.currentMock.delay = Number(delayed) * Config.delay
 	}
 
-	updateTransform(filename) {
-		this.currentTransform = filename
-	}
-
 	setByMatchingComment(comment) {
 		for (const file of this.mocks)
 			if (Route.hasInParentheses(file, comment)) {
 				this.updateFile(file)
 				break
 			}
-		for (const file of this.transforms)
-			if (Route.hasInParentheses(file, comment)) {
-				this.updateTransform(file)
-				break
-			}
 	}
 
 	extractComments() {
 		let comments = []
-		for (const file of [...this.mocks, ...this.transforms])
+		for (const file of this.mocks)
 			comments = comments.concat(Route.extractComments(file))
 		return comments
 	}
@@ -90,7 +76,6 @@ export class MockBroker {
 	}
 
 	#write500() {
-		// TODO handle route with transforms but without mocks
 		const { urlMask, method } = Route.parseFilename(this.mocks[0])
 		let mask = urlMask
 		const t = join(Config.mocksDir, urlMask)

package/src/MockDispatcher.js

@@ -28,7 +28,7 @@ export async function dispatchMock(req, response) {
 	}
 
 	try {
-		const { file, status, delay, currentTransform } = broker
+		const { file, status, delay } = broker
 		console.log('\n', req.url, '→\n ', file)
 
 		response.statusCode = status
@@ -36,13 +36,17 @@ export async function dispatchMock(req, response) {
 		if (cookie.getCurrent())
 			response.setHeader('set-cookie', cookie.getCurrent())
 
-		let mockAsText = readMock(file)
-		if (broker.currentTransform) {
-			const body = await requestBodyForTransform(req, mockAsText)
-			const transformFunc = await importTransformFunc(currentTransform)
-			mockAsText = transformFunc(mockAsText, body, Config)
+		let mockText
+		if (file.endsWith('.js')) {
+			response.setHeader('content-type', mimeFor('.json'))
+			const jsExport = await importDefault(file)
+			mockText = typeof jsExport === 'function'
+				? jsExport(req, response)
+				: JSON.stringify(jsExport)
 		}
-		setTimeout(() => response.end(mockAsText), delay)
+		else
+			mockText = readMock(file)
+		setTimeout(() => response.end(mockText), delay)
 	}
 	catch (error) {
 		console.error(error)
@@ -55,21 +59,11 @@ export async function dispatchMock(req, response) {
 	}
 }
 
-const nonSafeMethods = ['PATCH', 'POST', 'PUT', 'DELETE', 'CONNECT']
-
-async function requestBodyForTransform(req, mockAsText) {
-	if (nonSafeMethods.includes(req.method))
-		return req.headers[DF.isForDashboard] // TODO unit TESTME
-			? JSON.parse(mockAsText)
-			: await parseJSON(req)
-	return ''
-}
-
 function readMock(file) {
 	return readFileSync(join(Config.mocksDir, file), 'utf8')
 }
 
-async function importTransformFunc(file) {
+async function importDefault(file) {
 	// The date param is just for cache busting
 	return (await import(join(Config.mocksDir, file) + '?' + Date.now())).default
 }

package/src/mockBrokersCollection.js

@@ -34,7 +34,7 @@ export function init() {
 			continue
 		}
 		collection[method] ??= {}
-		if (!(urlMask in collection[method]))
+		if (!collection[method][urlMask])
 			collection[method][urlMask] = new MockBroker(file)
 		else
 			collection[method][urlMask].register(file)

package/sample-mocks/api/video/list(concat newly uploaded).GET.200.mjs

@@ -1,8 +0,0 @@
-// This is an example "transform". It takes the mock for the same route as
-// input, so you can modify it. In this case, it uses the `database` field.
-
-export default function concatNewlyUploadedVideos(mockAsText, _, config) {
-	const mockList = JSON.parse(mockAsText)
-	mockList.videos = mockList.videos.concat(config.database.videos || [])
-	return JSON.stringify(mockList, null, 2)
-}

package/sample-mocks/api/video/list.GET.200.json

@@ -1,11 +0,0 @@
-{
-	"_": "This file has query string params, but they are fully ignored. i.e. /api/video/list and /api/video/list?page_num=1 would match as well",
-	"videos": [
-		{
-			"url": "https://example.com/1"
-		},
-		{
-			"url": "https://example.com/2"
-		}
-	]
-}

package/sample-mocks/api/video/upload(insert newly uploaded).POST.201.mjs

@@ -1,10 +0,0 @@
-// An example "transform" for saving a POST request payload into the `config.database`
-
-export default function concatNewlyUploadedVideos(mockAsText, requestBody, config) {
-	config.database.videos ??= []
-	config.database.videos.push({
-		createdAt: Date.now(),
-		...requestBody
-	})
-	return JSON.stringify({})
-}

package/sample-mocks/api/video/upload.POST.201.json

@@ -1,3 +0,0 @@
-{
-	"created": "OK"
-}