From ec4374c3872b320af60f322289c30cd3d7066bdf Mon Sep 17 00:00:00 2001 From: Joseph Savona <6425824+josephsavona@users.noreply.github.com> Date: Wed, 9 Jul 2025 12:22:49 -0400 Subject: [PATCH] [compiler] Show logged errors in playground (#33740) In playground it's helpful to show all errors, even those that don't completely abort compilation. For example, to help demonstrate that the compiler catches things like setState in effects. This detects these errors and ensures we show them. --- .../apps/playground/components/Editor/EditorImpl.tsx | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/compiler/apps/playground/components/Editor/EditorImpl.tsx b/compiler/apps/playground/components/Editor/EditorImpl.tsx index 39571fa092..02813a8d2f 100644 --- a/compiler/apps/playground/components/Editor/EditorImpl.tsx +++ b/compiler/apps/playground/components/Editor/EditorImpl.tsx @@ -44,6 +44,7 @@ import { PrintedCompilerPipelineValue, } from './Output'; import {transformFromAstSync} from '@babel/core'; +import {LoggerEvent} from 'babel-plugin-react-compiler/dist/Entrypoint'; function parseInput( input: string, @@ -143,6 +144,7 @@ const COMMON_HOOKS: Array<[string, Hook]> = [ function compile(source: string): [CompilerOutput, 'flow' | 'typescript'] { const results = new Map>(); const error = new CompilerError(); + const otherErrors: Array = []; const upsert: (result: PrintedCompilerPipelineValue) => void = result => { const entry = results.get(result.name); if (Array.isArray(entry)) { @@ -210,7 +212,11 @@ function compile(source: string): [CompilerOutput, 'flow' | 'typescript'] { }, logger: { debugLogIRs: logIR, - logEvent: () => {}, + logEvent: (_filename: string | null, event: LoggerEvent) => { + if (event.kind === 'CompileError') { + otherErrors.push(new CompilerErrorDetail(event.detail)); + } + }, }, }); transformOutput = invokeCompiler(source, language, opts); @@ -237,6 +243,10 @@ function compile(source: string): [CompilerOutput, 'flow' | 'typescript'] { ); } } + // Only include logger errors if there weren't other errors + if (!error.hasErrors() && otherErrors.length !== 0) { + otherErrors.forEach(e => error.push(e)); + } if (error.hasErrors()) { return [{kind: 'err', results, error: error}, language]; }