[playground] Show error when compiling unsupported functions
Before: <img width="1117" alt="Screenshot 2023-11-14 at 9 11 28 AM" src="https://github.com/facebook/react-forget/assets/565765/d1ec2b5f-1bc5-4d29-9811-effcd39581e4"> After: <img width="1115" alt="Screenshot 2023-11-14 at 9 11 18 AM" src="https://github.com/facebook/react-forget/assets/565765/9a41889c-cf7b-4f31-8b6e-e26bfb204883">
Sathya Gunasekaran committed
Nov 14, 2023 at 09:10 UTC
07d6c6d8aad8767f1b6dc9b6724e60951df5598d
1 file changed
+46
-12
compiler/apps/playground/components/Editor/EditorImpl.tsx
+46
-12
@@ -9,7 +9,10 @@ import { parse, ParserPlugin } from "@babel/parser";
9
import traverse, { NodePath } from "@babel/traverse";
10
import * as t from "@babel/types";
11
import {
12
+ CompilerError,
13
+ CompilerErrorDetail,
14
Effect,
15
+ ErrorSeverity,
16
Hook,
17
parseConfigPragma,
18
printHIR,
@@ -40,8 +43,16 @@ import {
43
44
function parseFunctions(
45
source: string,
43
-): Array<NodePath<t.FunctionDeclaration>> {
44
- const items: Array<NodePath<t.FunctionDeclaration>> = [];
46
+): Array<
47
+ NodePath<
48
+ t.FunctionDeclaration | t.ArrowFunctionExpression | t.FunctionExpression
49
+ >
50
+> {
51
+ const items: Array<
52
+ NodePath<
53
+ t.FunctionDeclaration | t.ArrowFunctionExpression | t.FunctionExpression
54
+ >
55
+ > = [];
56
try {
57
const isFlow = source
58
.trim()
@@ -58,11 +69,17 @@ function parseFunctions(
69
sourceType: "module",
70
});
71
traverse(ast, {
61
- FunctionDeclaration: {
62
- enter(nodePath) {
63
- items.push(nodePath);
64
- nodePath.skip();
65
- },
72
+ FunctionDeclaration(nodePath) {
73
+ items.push(nodePath);
74
+ nodePath.skip();
75
+ },
76
+ ArrowFunctionExpression(nodePath) {
77
+ items.push(nodePath);
78
+ nodePath.skip();
79
+ },
80
+ FunctionExpression(nodePath) {
81
+ items.push(nodePath);
82
+ nodePath.skip();
83
},
84
});
85
} catch (e) {
@@ -121,6 +138,7 @@ const COMMON_HOOKS: Array<[string, Hook]> = [
138
139
function compile(source: string): CompilerOutput {
140
const results = new Map<string, PrintedCompilerPipelineValue[]>();
141
+ const error = new CompilerError();
142
const upsert = (result: PrintedCompilerPipelineValue) => {
143
const entry = results.get(result.name);
144
if (Array.isArray(entry)) {
@@ -135,6 +153,20 @@ function compile(source: string): CompilerOutput {
153
const config = parseConfigPragma(pragma);
154
155
for (const fn of parseFunctions(source)) {
156
+ if (!fn.isFunctionDeclaration()) {
157
+ error.pushErrorDetail(
158
+ new CompilerErrorDetail({
159
+ reason: `Unexpected function type ${fn.node.type}`,
160
+ description:
161
+ "Playground only supports parsing function declarations",
162
+ severity: ErrorSeverity.Todo,
163
+ loc: fn.node.loc ?? null,
164
+ suggestions: null,
165
+ }),
166
+ );
167
+ continue;
168
+ }
169
+
170
for (const result of run(fn, {
171
...config,
172
customHooks: new Map([...COMMON_HOOKS]),
@@ -191,15 +223,17 @@ function compile(source: string): CompilerOutput {
223
}
224
}
225
}
194
- return { kind: "ok", results };
195
- } catch (error: any) {
226
+ } catch (err: any) {
227
// error might be an invariant violation or other runtime error
228
// (i.e. object shape that is not CompilerError)
198
- if (error.details == null) {
199
- error.details = [];
229
+ if (err.details !== null) {
230
+ error.details.push(...err.details);
231
}
201
- return { kind: "err", results, error };
232
}
233
+ if (error.hasErrors()) {
234
+ return { kind: "err", results, error: error };
235
+ }
236
+ return { kind: "ok", results };
237
}
238
239
export default function Editor() {