From f244824bd1637e1f50cb8d2b81e50f6f092428d8 Mon Sep 17 00:00:00 2001
From: Evan Bacon <bacon@expo.io>
Date: Fri, 12 Apr 2024 12:34:46 -0500
Subject: [PATCH] chore(babel): add more language tests (#27709)

# Why

Add tests to ensure our babel preset can parse these language features
that are used in native-component-list. This will help us with refactors
and additions to the babel preset.

---------

Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com>
---
 packages/babel-preset-expo/CHANGELOG.md       |  1 +
 .../__snapshots__/compiler.test.ts.snap       | 36 ++++++++++++++++++
 .../src/__tests__/compiler.test.ts            | 38 +++++++++++++++++++
 .../__tests__/samples/destructure-catch.tsx   | 13 +++++++
 .../src/__tests__/samples/try-catch-hook.tsx  | 16 ++++++++
 5 files changed, 104 insertions(+)
 create mode 100644 packages/babel-preset-expo/src/__tests__/__snapshots__/compiler.test.ts.snap
 create mode 100644 packages/babel-preset-expo/src/__tests__/compiler.test.ts
 create mode 100644 packages/babel-preset-expo/src/__tests__/samples/destructure-catch.tsx
 create mode 100644 packages/babel-preset-expo/src/__tests__/samples/try-catch-hook.tsx

diff --git a/packages/babel-preset-expo/CHANGELOG.md b/packages/babel-preset-expo/CHANGELOG.md
index 448b5896197ea..768211b15a607 100644
--- a/packages/babel-preset-expo/CHANGELOG.md
+++ b/packages/babel-preset-expo/CHANGELOG.md
@@ -19,6 +19,7 @@
 
 ### 💡 Others
 
+- Add more tests for obscure syntax used in Expo apps. ([#27709](https://github.com/expo/expo/pull/27709) by [@EvanBacon](https://github.com/EvanBacon))
 - Relax forbidden React server API errors to better support shared components. ([#27878](https://github.com/expo/expo/pull/27878) by [@EvanBacon](https://github.com/EvanBacon))
 - Reset env in tests. ([#27950](https://github.com/expo/expo/pull/27950) by [@EvanBacon](https://github.com/EvanBacon))
 - Add Hermes language support tests. ([#27900](https://github.com/expo/expo/pull/27900) by [@EvanBacon](https://github.com/EvanBacon))
diff --git a/packages/babel-preset-expo/src/__tests__/__snapshots__/compiler.test.ts.snap b/packages/babel-preset-expo/src/__tests__/__snapshots__/compiler.test.ts.snap
new file mode 100644
index 0000000000000..0ba169b7ae67c
--- /dev/null
+++ b/packages/babel-preset-expo/src/__tests__/__snapshots__/compiler.test.ts.snap
@@ -0,0 +1,36 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`allows destructuring in the catch block 1`] = `
+"Object.defineProperty(exports, "__esModule", { value: true });exports.App = App;var _jsxRuntime = require("react/jsx-runtime");function App() {
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  var foo = function () {
+    try {
+      console.log('hey');
+    } catch (_ref) {var message = _ref.message;
+      // NOTE(EvanBacon): React compiler throws:
+      // (BuildHIR::lowerAssignment) Could not find binding for declaration.
+      console.error(message);
+    }
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", { children: "Hello" });
+}"
+`;
+
+exports[`supports functions with discarded return values in try/catch blocks that run in memos 1`] = `
+"Object.defineProperty(exports, "__esModule", { value: true });exports.useSideEffectMayThrow = useSideEffectMayThrow;var _react = require("react");
+
+function SIDE_EFFECT_MAY_THROW() {}
+
+// NOTE(EvanBacon): React compiler throws:
+// Cannot read properties of undefined (reading 'preds')
+function useSideEffectMayThrow() {
+  return (0, _react.useMemo)(function () {
+    try {
+      SIDE_EFFECT_MAY_THROW();
+      return true;
+    } catch {
+      return false;
+    }
+  }, []);
+}"
+`;
diff --git a/packages/babel-preset-expo/src/__tests__/compiler.test.ts b/packages/babel-preset-expo/src/__tests__/compiler.test.ts
new file mode 100644
index 0000000000000..85e09b1c441e5
--- /dev/null
+++ b/packages/babel-preset-expo/src/__tests__/compiler.test.ts
@@ -0,0 +1,38 @@
+import * as babel from '@babel/core';
+import * as path from 'node:path';
+
+import preset from '..';
+
+function getCaller(props: Record<string, string | boolean>): babel.TransformCaller {
+  return props as unknown as babel.TransformCaller;
+}
+
+const options = {
+  caller: getCaller({ name: 'metro', engine: 'hermes', platform: 'ios', isDev: false }),
+  babelrc: false,
+  presets: [preset],
+  sourceMaps: false,
+
+  compact: false,
+  comments: true,
+  retainLines: true,
+};
+
+it(`allows destructuring in the catch block`, () => {
+  // Ensuring the transform doesn't throw.
+  const { code } = babel.transformFileSync(
+    path.resolve(__dirname, 'samples/destructure-catch.tsx'),
+    options
+  )!;
+
+  expect(code).toMatchSnapshot();
+});
+it(`supports functions with discarded return values in try/catch blocks that run in memos`, () => {
+  // Ensuring the transform doesn't throw.
+  const { code } = babel.transformFileSync(
+    path.resolve(__dirname, 'samples/try-catch-hook.tsx'),
+    options
+  )!;
+
+  expect(code).toMatchSnapshot();
+});
diff --git a/packages/babel-preset-expo/src/__tests__/samples/destructure-catch.tsx b/packages/babel-preset-expo/src/__tests__/samples/destructure-catch.tsx
new file mode 100644
index 0000000000000..37312e0b7c0c1
--- /dev/null
+++ b/packages/babel-preset-expo/src/__tests__/samples/destructure-catch.tsx
@@ -0,0 +1,13 @@
+export function App() {
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const foo = () => {
+    try {
+      console.log('hey');
+    } catch ({ message }) {
+      // NOTE(EvanBacon): React compiler throws:
+      // (BuildHIR::lowerAssignment) Could not find binding for declaration.
+      console.error(message);
+    }
+  };
+  return <div>Hello</div>;
+}
diff --git a/packages/babel-preset-expo/src/__tests__/samples/try-catch-hook.tsx b/packages/babel-preset-expo/src/__tests__/samples/try-catch-hook.tsx
new file mode 100644
index 0000000000000..76043a22ba651
--- /dev/null
+++ b/packages/babel-preset-expo/src/__tests__/samples/try-catch-hook.tsx
@@ -0,0 +1,16 @@
+import { useMemo } from 'react';
+
+function SIDE_EFFECT_MAY_THROW() {}
+
+// NOTE(EvanBacon): React compiler throws:
+// Cannot read properties of undefined (reading 'preds')
+export function useSideEffectMayThrow() {
+  return useMemo(() => {
+    try {
+      SIDE_EFFECT_MAY_THROW();
+      return true;
+    } catch {
+      return false;
+    }
+  }, []);
+}