feat: Add Mirage.js server to enable editor-ui unit tests (#5671)

feat: add Mirage.js server to enable editor-ui unit tests

packages/editor-ui/src/__tests__/server/endpoints/credential.ts

@@ -0,0 +1,10 @@
+import { Response, Server } from 'miragejs';
+import { AppSchema } from '../types';
+
+export function routesForCredentials(server: Server) {
+	server.get('/rest/credentials', (schema: AppSchema) => {
+		const { models: data } = schema.all('credential');
+
+		return new Response(200, {}, { data });
+	});
+}

packages/editor-ui/src/__tests__/server/endpoints/credentialType.ts

@@ -0,0 +1,10 @@
+import { Response, Server } from 'miragejs';
+import { AppSchema } from '../types';
+
+export function routesForCredentialTypes(server: Server) {
+	server.get('/types/credentials.json', (schema: AppSchema) => {
+		const { models: data } = schema.all('credentialType');
+
+		return new Response(200, {}, data);
+	});
+}

packages/editor-ui/src/__tests__/server/endpoints/index.ts

@@ -0,0 +1,12 @@
+import { routesForUsers } from './user';
+import { routesForCredentials } from './credential';
+import { Server } from 'miragejs';
+import { routesForCredentialTypes } from '@/__tests__/server/endpoints/credentialType';
+
+const endpoints: Array<(server: Server) => void> = [
+	routesForCredentials,
+	routesForCredentialTypes,
+	routesForUsers,
+];
+
+export { endpoints };

packages/editor-ui/src/__tests__/server/endpoints/user.ts

@@ -0,0 +1,10 @@
+import { Response, Server } from 'miragejs';
+import { AppSchema } from '../types';
+
+export function routesForUsers(server: Server) {
+	server.get('/rest/users', (schema: AppSchema) => {
+		const { models: data } = schema.all('user');
+
+		return new Response(200, {}, { data });
+	});
+}

packages/editor-ui/src/__tests__/server/factories/credential.ts

@@ -0,0 +1,24 @@
+import { Factory } from 'miragejs';
+import { faker } from '@faker-js/faker';
+import type { ICredentialsResponse } from '@/Interface';
+
+export const credentialFactory = Factory.extend<ICredentialsResponse>({
+	id(i: number) {
+		return `${i}`;
+	},
+	createdAt() {
+		return faker.date.recent().toISOString();
+	},
+	name() {
+		return faker.company.name();
+	},
+	nodesAccess() {
+		return [];
+	},
+	type() {
+		return 'notionApi';
+	},
+	updatedAt() {
+		return '';
+	},
+});

packages/editor-ui/src/__tests__/server/factories/credentialType.ts

@@ -0,0 +1,26 @@
+import { Factory } from 'miragejs';
+import { faker } from '@faker-js/faker';
+import type { ICredentialType } from 'n8n-workflow';
+
+const credentialTypes = [
+	'airtableApi',
+	'dropboxApi',
+	'figmaApi',
+	'googleApi',
+	'gitlabApi',
+	'jenkinsApi',
+	'metabaseApi',
+	'notionApi',
+];
+
+export const credentialTypeFactory = Factory.extend<ICredentialType>({
+	name(i) {
+		return credentialTypes[i];
+	},
+	displayName(i) {
+		return credentialTypes[i];
+	},
+	properties() {
+		return [];
+	},
+});

packages/editor-ui/src/__tests__/server/factories/index.ts

@@ -0,0 +1,13 @@
+import { userFactory } from './user';
+import { credentialFactory } from './credential';
+import { credentialTypeFactory } from './credentialType';
+
+export * from './user';
+export * from './credential';
+export * from './credentialType';
+
+export const factories = {
+	credential: credentialFactory,
+	credentialType: credentialTypeFactory,
+	user: userFactory,
+};

packages/editor-ui/src/__tests__/server/factories/user.ts

@@ -0,0 +1,31 @@
+import { Factory } from 'miragejs';
+import { faker } from '@faker-js/faker';
+import { SignInType } from '@/constants';
+import type { IUser } from '@/Interface';
+
+export const userFactory = Factory.extend<IUser>({
+	id(i: number) {
+		return `${i}`;
+	},
+	firstName() {
+		return faker.name.firstName();
+	},
+	lastName() {
+		return faker.name.lastName();
+	},
+	isDefaultUser() {
+		return false;
+	},
+	isOwner() {
+		return false;
+	},
+	isPending() {
+		return false;
+	},
+	isPendingUser() {
+		return false;
+	},
+	signInType(): SignInType {
+		return SignInType.EMAIL;
+	},
+});

packages/editor-ui/src/__tests__/server/index.ts

@@ -0,0 +1,42 @@
+import { createServer } from 'miragejs';
+import { endpoints } from './endpoints';
+import { models } from './models';
+import { factories } from './factories';
+
+export function setupServer() {
+	const server = createServer({
+		models,
+		factories,
+		seeds(server) {
+			server.createList('credentialType', 8);
+			server.create('user', {
+				isDefaultUser: true,
+			});
+		},
+	});
+
+	// Set server url prefix
+	server.urlPrefix = process.env.API_URL || '';
+
+	// Enable logging
+	server.logging = false;
+
+	// Handle undefined endpoints
+	server.post('/rest/:any', () => new Promise(() => {}));
+
+	// Handle defined endpoints
+	for (const endpointsFn of endpoints) {
+		endpointsFn(server);
+	}
+
+	// Reset for everything else
+	server.namespace = '';
+	server.passthrough();
+
+	if (server.logging) {
+		console.log('Mirage database');
+		console.log(server.db.dump());
+	}
+
+	return server;
+}

packages/editor-ui/src/__tests__/server/models/credential.ts

@@ -0,0 +1,5 @@
+import { ICredentialsResponse } from '@/Interface';
+import { Model } from 'miragejs';
+import type { ModelDefinition } from 'miragejs/-types';
+
+export const CredentialModel: ModelDefinition<ICredentialsResponse> = Model.extend({});

packages/editor-ui/src/__tests__/server/models/credentialType.ts

@@ -0,0 +1,5 @@
+import { Model } from 'miragejs';
+import type { ModelDefinition } from 'miragejs/-types';
+import type { ICredentialType } from 'n8n-workflow';
+
+export const CredentialTypeModel: ModelDefinition<ICredentialType> = Model.extend({});

packages/editor-ui/src/__tests__/server/models/index.ts

@@ -0,0 +1,9 @@
+import { UserModel } from './user';
+import { CredentialModel } from './credential';
+import { CredentialTypeModel } from './credentialType';
+
+export const models = {
+	credential: CredentialModel,
+	credentialType: CredentialTypeModel,
+	user: UserModel,
+};

packages/editor-ui/src/__tests__/server/models/user.ts

@@ -0,0 +1,5 @@
+import { IUser } from '@/Interface';
+import { Model } from 'miragejs';
+import type { ModelDefinition } from 'miragejs/-types';
+
+export const UserModel: ModelDefinition<IUser> = Model.extend({});

packages/editor-ui/src/__tests__/server/types.ts

@@ -0,0 +1,10 @@
+import { Registry } from 'miragejs';
+
+// eslint-disable-next-line import/no-unresolved
+import Schema from 'miragejs/orm/schema';
+
+import { models } from './models';
+import { factories } from './factories';
+
+type AppRegistry = Registry<typeof models, typeof factories>;
+export type AppSchema = Schema<AppRegistry>;