perf: avoid infinite enhancer loops

meetalva · Sep 10, 2018 · 0c33f71 · 0c33f71
1 parent a00ba8a
commit 0c33f71
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 18 deletions.
diff --git a/src/container/pane-development-editor.tsx b/src/container/pane-development-editor.tsx
@@ -55,24 +55,38 @@ export class PaneDevelopmentEditor extends React.Component {
 		});
 
 		this.editor.onDidChangeModelContent(async () => {
-			storeEnhancer.setTypeScript(this.editor.getValue());
+			const value = this.editor.getValue();
+			storeEnhancer.setTypeScript(value);
 
 			const model = this.editor.getModel();
-			const worker = await Monaco.languages.typescript.getTypeScriptWorker();
-			const client = await worker(model.uri);
+			const getClient = await Monaco.languages.typescript.getTypeScriptWorker();
+			const client = await getClient(model.uri);
 			const emitOutput = await client.getEmitOutput(model.uri.toString());
+
 			const outputFile = emitOutput.outputFiles.find(
 				file => file.name === `${model.uri.toString()}.js`
 			);
 
 			if (outputFile) {
-				console.log(outputFile.text);
 				storeEnhancer.setJavaScript(outputFile.text);
 			}
 		});
 
-		this.editor.onDidBlurEditor(() => {
+		this.editor.onDidBlurEditor(async () => {
 			storeEnhancer.setTypeScript(this.editor.getValue());
+
+			const model = this.editor.getModel();
+			const getClient = await Monaco.languages.typescript.getTypeScriptWorker();
+			const client = await getClient(model.uri);
+			const emitOutput = await client.getEmitOutput(model.uri.toString());
+			const outputFile = emitOutput.outputFiles.find(
+				file => file.name === `${model.uri.toString()}.js`
+			);
+
+			if (outputFile) {
+				storeEnhancer.setJavaScript(outputFile.text);
+			}
+
 			props.store.commit();
 		});
 

diff --git a/src/model/user-store-enhancer.ts b/src/model/user-store-enhancer.ts
@@ -93,18 +93,6 @@ export class UserStoreEnhancer {
 	@Mobx.observable private typeScript: string;
 	@Mobx.observable private javaScript: string;
 
-	// @Mobx.computed
-	// private get js(): string {
-	// 	const fs = new MemoryFilesystem();
-	// 	fs.writeFileSync('/file.ts', this.code);
-	// 	compile('/file.ts', {
-	// 		compilerOptions: {},
-	// 		fs,
-	// 		languageVersion: TypeScript.ScriptTarget.ESNext
-	// 	});
-	// 	return String(fs.readFileSync('/file.js'));
-	// }
-
 	@Mobx.computed
 	private get module(): UserStoreEnhancerModule {
 		const context = { exports: {}, module: { exports: {} }, console };
@@ -171,5 +159,6 @@ export class UserStoreEnhancer {
 
 	public update(b: this): void {
 		this.typeScript = b.typeScript;
+		this.javaScript = b.javaScript;
 	}
 }
diff --git a/src/renderer/create-project-message-handler.ts b/src/renderer/create-project-message-handler.ts
@@ -109,7 +109,7 @@ export function createProjectMessageHandler({
 				break;
 			}
 			case Message.MessageType.ChangeUserStore: {
-				project.getUserStore().sync(message);
+				project.getUserStore().sync(message, { withEnhancer: false });
 				break;
 			}
 			case Message.MessageType.SelectElement: {