From 55eebadfa2111735c9b27ef628a0646f3ac242f8 Mon Sep 17 00:00:00 2001
From: Pavel Feldman <pavel.feldman@gmail.com>
Date: Mon, 22 May 2023 15:34:50 -0700
Subject: [PATCH] cherry-pick(#23211): chore: allow stub JSX instances in type
 module

---
 packages/playwright-test/jsx-runtime.js  |  3 +++
 packages/playwright-test/jsx-runtime.mjs | 21 ++++++++++++++++++
 packages/playwright-test/package.json    |  6 ++++-
 tests/playwright-test/loader.spec.ts     | 28 ++++++++++++++++++++++++
 4 files changed, 57 insertions(+), 1 deletion(-)
 create mode 100644 packages/playwright-test/jsx-runtime.mjs

diff --git a/packages/playwright-test/jsx-runtime.js b/packages/playwright-test/jsx-runtime.js
index bf03de3a5a677..56bbfb1ed8606 100644
--- a/packages/playwright-test/jsx-runtime.js
+++ b/packages/playwright-test/jsx-runtime.js
@@ -28,7 +28,10 @@ function jsxs(type, props) {
   };
 }
 
+const Fragment = {};
+
 module.exports = {
+  Fragment,
   jsx,
   jsxs,
 };
diff --git a/packages/playwright-test/jsx-runtime.mjs b/packages/playwright-test/jsx-runtime.mjs
new file mode 100644
index 0000000000000..742708825e4b8
--- /dev/null
+++ b/packages/playwright-test/jsx-runtime.mjs
@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import jsxRuntime from './jsx-runtime.js';
+
+export const jsx = jsxRuntime.jsx;
+export const jsxs = jsxRuntime.jsxs;
+export const Fragment = jsxRuntime.Fragment;
\ No newline at end of file
diff --git a/packages/playwright-test/package.json b/packages/playwright-test/package.json
index aefd00d01de17..8a1a9cb71f1a9 100644
--- a/packages/playwright-test/package.json
+++ b/packages/playwright-test/package.json
@@ -22,7 +22,11 @@
     "./lib/internalsForTest": "./lib/internalsForTest.js",
     "./lib/experimentalLoader": "./lib/experimentalLoader.js",
     "./lib/plugins": "./lib/plugins/index.js",
-    "./jsx-runtime": "./jsx-runtime.js",
+    "./jsx-runtime": {
+      "import": "./jsx-runtime.mjs",
+      "require": "./jsx-runtime.js",
+      "default": "./jsx-runtime.js"
+    },
     "./lib/util": "./lib/util.js",
     "./lib/utilsBundle": "./lib/utilsBundle.js",
     "./reporter": "./reporter.js"
diff --git a/tests/playwright-test/loader.spec.ts b/tests/playwright-test/loader.spec.ts
index 0ac5841ba6fa5..cd480a20940b7 100644
--- a/tests/playwright-test/loader.spec.ts
+++ b/tests/playwright-test/loader.spec.ts
@@ -488,6 +488,34 @@ test('should load a jsx/tsx files', async ({ runInlineTest }) => {
   expect(exitCode).toBe(0);
 });
 
+test('should load a jsx/tsx files in ESM mode', async ({ runInlineTest }) => {
+  const { exitCode, passed } = await runInlineTest({
+    'package.json': JSON.stringify({
+      type: 'module'
+    }),
+    'playwright.config.ts': `
+      import { defineConfig } from '@playwright/test';
+      export default defineConfig({ projects: [{name: 'foo'}] });
+    `,
+    'a.spec.tsx': `
+      import { test, expect } from '@playwright/test';
+      const component = () => <div></div>;
+      test('succeeds', () => {
+        expect(1 + 1).toBe(2);
+      });
+    `,
+    'b.spec.jsx': `
+      import { test, expect } from '@playwright/test';
+      const component = () => <div></div>;
+      test('succeeds', () => {
+        expect(1 + 1).toBe(2);
+      });
+    `
+  });
+  expect(passed).toBe(2);
+  expect(exitCode).toBe(0);
+});
+
 test('should load jsx with top-level component', async ({ runInlineTest }) => {
   const { exitCode, passed } = await runInlineTest({
     'a.spec.tsx': `