Add variable declaration node

src/components/EventLoop/useProcessEvent.ts

@@ -47,8 +47,8 @@ const processTask = async ({
 		const expression = nodeFactory({
 			node: (node.node as ArrowFunctionExpression).body,
 			context: {
+				...node.context,
 				actions: [],
-				functions: node.context.functions,
 			},
 			params: node.params,
 		});
@@ -77,8 +77,8 @@ const processMicroTask = async ({
 		const expression = nodeFactory({
 			node: (node.node as ArrowFunctionExpression).body,
 			context: {
+				...node.context,
 				actions: [],
-				functions: node.context.functions,
 			},
 			params: node.params,
 		});
@@ -118,8 +118,8 @@ const processRender = async ({
 		const expression = nodeFactory({
 			node: (node.node as ArrowFunctionExpression).body,
 			context: {
+				...node.context,
 				actions: [],
-				functions: node.context.functions,
 			},
 			params: node.params,
 		});

src/utils/nodes/AssignmentExpression.ts

@@ -0,0 +1,21 @@
+import { AssignmentExpression, Identifier } from 'acorn';
+import { NodeClass, NodeClassConstructor } from './Node.abstract.ts';
+
+export class AssignmentExpressionClass extends NodeClass {
+	constructor(params: NodeClassConstructor) {
+		super(params);
+	}
+
+	serialize = () => {
+		console.log(
+			'Serialize method is not implemented for the Assignment expressions'
+		);
+		return '';
+	};
+
+	traverse = () => {
+		const assignmentExpression = this.node as AssignmentExpression;
+		this.context.variables[(assignmentExpression.left as Identifier).name] =
+			assignmentExpression.right;
+	};
+}

src/utils/nodes/Identifier.ts

@@ -70,6 +70,15 @@ export class IdentifierClass extends NodeClass {
 					}),
 			});
 			return;
+		} else if (this.context.variables[identifier.name]) {
+			const variableValue = this.context.variables[identifier.name];
+			if (!variableValue) return;
+			const blockStatement = nodeFactory({
+				node: variableValue,
+				context: this.context,
+			});
+			blockStatement.traverse();
+			return;
 		} else if (this.context.functions[identifier.name]) {
 			const customFunction = this.context.functions[
 				identifier.name

src/utils/nodes/MemberExpression.ts

@@ -40,13 +40,23 @@ export class MemberExpressionClass extends NodeClass {
 				type: 'push',
 				value:
 					this.args
-						?.map((arg) =>
-							nodeFactory({
-								node: arg,
-								context: this.context,
-								params: this.params,
-							}).serialize()
-						)
+						?.map((arg) => {
+							if (arg.type === 'Identifier') {
+								const variableValue = this.context.variables[arg.name];
+								if (!variableValue) return '';
+								const literal = nodeFactory({
+									node: variableValue,
+									context: this.context,
+								}).serialize();
+								return literal;
+							} else {
+								return nodeFactory({
+									node: arg,
+									context: this.context,
+									params: this.params,
+								}).serialize();
+							}
+						})
 						.join(',') ?? '',
 			});
 		}

src/utils/nodes/VariableDeclaration.ts

@@ -0,0 +1,22 @@
+import { VariableDeclaration, Identifier } from 'acorn';
+import { NodeClass, NodeClassConstructor } from './Node.abstract.ts';
+
+export class VariableDeclarationClass extends NodeClass {
+	constructor(params: NodeClassConstructor) {
+		super(params);
+	}
+
+	serialize = () => {
+		console.log(
+			'Serialize method is not implemented for the Variable declarations'
+		);
+		return '';
+	};
+
+	traverse = () => {
+		const variableDeclaration = this.node as VariableDeclaration;
+		this.context.variables[
+			(variableDeclaration.declarations[0].id as Identifier).name
+		] = variableDeclaration.declarations[0].init;
+	};
+}

src/utils/nodes/factory.ts

@@ -9,6 +9,8 @@ import { ArrowFunctionExpressionClass } from './ArrowFunctionExpression.ts';
 import { NodeClass, NodeClassConstructor } from './Node.abstract.ts';
 import { BlockStatementClass } from './BlockStatement.ts';
 import { ProgramClass } from './Program.ts';
+import { VariableDeclarationClass } from './VariableDeclaration.ts';
+import { AssignmentExpressionClass } from './AssignmentExpression.ts';
 
 export const nodeFactory = (params: NodeClassConstructor): NodeClass => {
 	switch (params.node.type) {
@@ -30,6 +32,10 @@ export const nodeFactory = (params: NodeClassConstructor): NodeClass => {
 			return new BlockStatementClass(params);
 		case 'Program':
 			return new ProgramClass(params);
+		case 'VariableDeclaration':
+			return new VariableDeclarationClass(params);
+		case 'AssignmentExpression':
+			return new AssignmentExpressionClass(params);
 		default:
 			return new NotImplementedNodeClass(params);
 	}

src/utils/parse.ts

@@ -7,6 +7,7 @@ export const parse = (code: string): NodeClass => {
 	const context: ParseContextInterface = {
 		actions: [],
 		functions: {},
+		variables: {},
 	};
 	const parsed = acornParse(code, { ecmaVersion: 2020 });
 	return nodeFactory({ node: parsed, context });

src/utils/parse.types.ts

@@ -4,6 +4,7 @@ import { ActionInterface } from '../store/store.types.ts';
 export interface ParseContextInterface {
 	actions: ActionInterface[];
 	functions: Record<string, FunctionDeclaration>;
+	variables: Record<string, Expression | null | undefined>;
 }
 
 export type AcornArgument = Expression | SpreadElement;