Fix the Lite dev mode only to create an app and expose the controller…

… for Playwright, without editors etc.

js/app/src/lite/dev/App.svelte

@@ -79,12 +79,8 @@ def hi(name):
 			controlPageTitle: false,
 			appMode: true
 		});
-		// @ts-ignore
-		window.controller = controller; // For Playwright
 	});
 	onDestroy(() => {
-		// @ts-ignore
-		window.controller = undefined;
 		controller.unmount();
 	});
 

js/app/src/lite/index.ts

@@ -261,12 +261,34 @@ globalThis.createGradioApp = create;
 bootstrap_custom_element(create);
 
 declare let BUILD_MODE: string;
+declare let GRADIO_E2E_TEST_LITE: string;
 if (BUILD_MODE === "dev") {
-	(async function () {
-		const DevApp = (await import("./dev/App.svelte")).default;
-
-		const app = new DevApp({
-			target: document.getElementById("dev-app")!
+	if (GRADIO_E2E_TEST_LITE) {
+		// For the Playwright E2E tests, we create an app and expose the controller to the global scope.
+		const controller = create({
+			target: document.getElementById("gradio-app")!,
+			code: "import gradio as gr; demo = gr.Interface(lambda x: x, 'text', 'text'); demo.launch()",
+			requirements: [],
+			sharedWorkerMode: true,
+			info: true,
+			container: true,
+			isEmbed: false,
+			initialHeight: "300px",
+			eager: false,
+			themeMode: null,
+			autoScroll: false,
+			controlPageTitle: false,
+			appMode: true
 		});
-	})();
+		// @ts-ignore
+		window.controller = controller;
+	} else {
+		(async function () {
+			const DevApp = (await import("./dev/App.svelte")).default;
+
+			const app = new DevApp({
+				target: document.getElementById("dev-app")!
+			});
+		})();
+	}
 }

js/app/vite.config.ts

@@ -100,6 +100,7 @@ export default defineConfig(({ mode }) => {
 
 		define: {
 			BUILD_MODE: production ? JSON.stringify("prod") : JSON.stringify("dev"),
+			GRADIO_E2E_TEST_LITE: process.env.GRADIO_E2E_TEST_LITE,
 			BACKEND_URL: production
 				? JSON.stringify("")
 				: JSON.stringify("http://localhost:7860/"),