feat: delay mask import

packages/extension/src/agent/RemotePageController.content.ts

@@ -15,8 +15,7 @@ export function initPageController() {
 
 	function getPC(): PageController {
 		if (!pageController) {
-			pageController = new PageController({ enableMask: true })
-			pageController.hideMask()
+			pageController = new PageController({ enableMask: false })
 		}
 		return pageController
 	}
@@ -35,7 +34,9 @@ export function initPageController() {
 		// })
 
 		if (shouldShowMask) {
-			await getPC().showMask()
+			const pc = getPC()
+			pc.initMask()
+			await pc.showMask()
 		} else {
 			// await getPC().hideMask()
 			if (pageController) {

packages/page-controller/src/PageController.ts

@@ -94,17 +94,18 @@ export class PageController extends EventTarget {
 
 		patchReact(this)
 
-		if (config.enableMask) {
-			this.maskReady = this.initMask()
-		}
+		if (config.enableMask) this.initMask()
 	}
 
 	/**
 	 * Initialize mask asynchronously (dynamic import to avoid CSS loading in Node)
 	 */
-	private async initMask(): Promise<void> {
-		const { SimulatorMask } = await import('./mask/SimulatorMask')
-		this.mask = new SimulatorMask()
+	initMask() {
+		if (this.maskReady !== null) return
+		this.maskReady = (async () => {
+			const { SimulatorMask } = await import('./mask/SimulatorMask')
+			this.mask = new SimulatorMask()
+		})()
 	}
 	// ======= State Queries =======
 
@@ -394,7 +395,7 @@ export class PageController extends EventTarget {
 
 	/**
 	 * Show the visual mask overlay.
-	 * Only works if enableMask was set to true in config.
+	 * Only works after mask is setup.
 	 */
 	async showMask(): Promise<void> {
 		await this.maskReady
@@ -403,7 +404,7 @@ export class PageController extends EventTarget {
 
 	/**
 	 * Hide the visual mask overlay.
-	 * Only works if enableMask was set to true in config.
+	 * Only works after mask is setup.
 	 */
 	async hideMask(): Promise<void> {
 		await this.maskReady