Fix tests, linting, and formatting errors

Author: EugeneChoi4

compiler/apps/playground/__tests__/e2e/page.spec.ts

@@ -136,7 +136,7 @@ test('editor should compile from hash successfully', async ({page}) => {
     path: 'test-results/01-compiles-from-hash.png',
   });
   const text =
-    (await page.locator('.monaco-editor').nth(1).allInnerTexts()) ?? [];
+    (await page.locator('.monaco-editor').nth(2).allInnerTexts()) ?? [];
   const output = await formatPrint(text);
 
   expect(output).not.toEqual('');
@@ -162,7 +162,7 @@ test('reset button works', async ({page}) => {
     path: 'test-results/02-reset-button-works.png',
   });
   const text =
-    (await page.locator('.monaco-editor').nth(1).allInnerTexts()) ?? [];
+    (await page.locator('.monaco-editor').nth(2).allInnerTexts()) ?? [];
   const output = await formatPrint(text);
 
   expect(output).not.toEqual('');
@@ -183,7 +183,7 @@ TEST_CASE_INPUTS.forEach((t, idx) =>
     });
 
     const text =
-      (await page.locator('.monaco-editor').nth(1).allInnerTexts()) ?? [];
+      (await page.locator('.monaco-editor').nth(2).allInnerTexts()) ?? [];
     let output: string;
     if (t.noFormat) {
       output = text.join('');

compiler/apps/playground/components/Editor/ConfigEditor.tsx

@@ -6,7 +6,10 @@
  */
 
 import MonacoEditor, {loader, type Monaco} from '@monaco-editor/react';
-import {parseConfigPragmaForTests, parsePluginOptions} from 'babel-plugin-react-compiler';
+import {
+  parseConfigPragmaForTests,
+  parsePluginOptions,
+} from 'babel-plugin-react-compiler';
 import type {editor} from 'monaco-editor';
 import * as monaco from 'monaco-editor';
 import {useState, useMemo} from 'react';
@@ -54,15 +57,22 @@ function isEqual(a: any, b: any): boolean {
  */
 function getOverriddenValues(current: any, defaults: any): Record<string, any> {
   if (isEqual(current, defaults)) return {};
-  if (current && defaults &&
-      typeof current === 'object' && typeof defaults === 'object' &&
-      !Array.isArray(current) && !Array.isArray(defaults)) {
-
+  if (
+    current &&
+    defaults &&
+    typeof current === 'object' &&
+    typeof defaults === 'object' &&
+    !Array.isArray(current) &&
+    !Array.isArray(defaults)
+  ) {
     const overrides: Record<string, any> = {};
 
     for (const key in current) {
       const nested = getOverriddenValues(current[key], defaults[key]);
-      if (Object.keys(nested).length > 0 || !isEqual(current[key], defaults[key])) {
+      if (
+        Object.keys(nested).length > 0 ||
+        !isEqual(current[key], defaults[key])
+      ) {
         overrides[key] = Object.keys(nested).length > 0 ? nested : current[key];
       }
     }
@@ -88,17 +98,21 @@ function formatConfigAsJavaScript(config: any): string {
       if (value.length === 0) {
         return '[]';
       }
-      const items = value.map(item => `${spaces}  ${formatValue(item, indent + 1)}`).join(',\n');
+      const items = value
+        .map(item => `${spaces}  ${formatValue(item, indent + 1)}`)
+        .join(',\n');
       return `[\n${items}\n${spaces}]`;
     } else if (typeof value === 'object' && value !== null) {
       const keys = Object.keys(value);
       if (keys.length === 0) {
         return '{}';
       }
-      const items = keys.map(key => {
-        const formattedValue = formatValue(value[key], indent + 1);
-        return `${spaces}  ${key}: ${formattedValue}`;
-      }).join(',\n');
+      const items = keys
+        .map(key => {
+          const formattedValue = formatValue(value[key], indent + 1);
+          return `${spaces}  ${key}: ${formattedValue}`;
+        })
+        .join(',\n');
       return `{\n${items}\n${spaces}}`;
     } else {
       return String(value);
@@ -110,7 +124,7 @@ function formatConfigAsJavaScript(config: any): string {
 }
 
 export default function ConfigEditor(): JSX.Element {
-  const [monaco, setMonaco] = useState<Monaco | null>(null);
+  const [, setMonaco] = useState<Monaco | null>(null);
   const store = useStore();
 
   // Parse current config from source pragma and show only overridden values
@@ -125,7 +139,7 @@ export default function ConfigEditor(): JSX.Element {
       const overrides = getOverriddenValues(parsedConfig, DEFAULT_CONFIG);
 
       return overrides;
-    } catch (error) {
+    } catch (_) {
       // If parsing fails, return empty object (no overrides)
       return {};
     }