cherry-pick(#30820): fix(electron): allow launching with spaces in pa…

…th (#30830)

This PR cherry-picks the following commits:

- 90765a2

Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>

packages/playwright-core/src/server/electron/electron.ts

@@ -161,7 +161,7 @@ export class Electron extends SdkObject {
     return controller.run(async progress => {
       let app: ElectronApplication | undefined = undefined;
       // --remote-debugging-port=0 must be the last playwright's argument, loader.ts relies on it.
-      const electronArguments = ['--inspect=0', '--remote-debugging-port=0', ...args];
+      let electronArguments = ['--inspect=0', '--remote-debugging-port=0', ...args];
 
       if (os.platform() === 'linux') {
         const runningAsRoot = process.geteuid && process.geteuid() === 0;
@@ -195,6 +195,16 @@ export class Electron extends SdkObject {
         // Packaged apps might have their own command line handling.
         electronArguments.unshift('-r', require.resolve('./loader'));
       }
+      let shell = false;
+      if (process.platform === 'win32') {
+        // On Windows in order to run .cmd files, shell: true is required.
+        // https://github.com/nodejs/node/issues/52554
+        shell = true;
+        // On Windows, we need to quote the executable path due to shell: true.
+        command = `"${command}"`;
+        // On Windows, we need to quote the arguments due to shell: true.
+        electronArguments = electronArguments.map(arg => `"${arg}"`);
+      }
 
       // When debugging Playwright test that runs Electron, NODE_OPTIONS
       // will make the debugger attach to Electron's Node. But Playwright
@@ -208,9 +218,7 @@ export class Electron extends SdkObject {
           progress.log(message);
           browserLogsCollector.log(message);
         },
-        // On Windows in order to run .cmd files, shell: true is required.
-        // https://github.com/nodejs/node/issues/52554
-        shell: process.platform === 'win32',
+        shell,
         stdio: 'pipe',
         cwd: options.cwd,
         tempDirectories: [artifactsDir],

tests/installation/playwright-electron-should-work.spec.ts

@@ -14,6 +14,8 @@
  * limitations under the License.
  */
 import { test } from './npmTest';
+import fs from 'fs';
+import path from 'path';
 
 test('electron should work', async ({ exec, tsc, writeFiles }) => {
   await exec('npm i playwright electron@19.0.11');
@@ -24,3 +26,16 @@ test('electron should work', async ({ exec, tsc, writeFiles }) => {
   });
   await tsc('test.ts');
 });
+
+test('electron should work with special characters in path', async ({ exec, tmpWorkspace }) => {
+  test.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/30755' });
+  const folderName = path.join(tmpWorkspace, '!@#$% тест with spaces and 😊');
+
+  await exec('npm i playwright electron@19.0.11');
+  await fs.promises.mkdir(folderName);
+  for (const file of ['electron-app.js', 'sanity-electron.js'])
+    await fs.promises.copyFile(path.join(tmpWorkspace, file), path.join(folderName, file));
+  await exec('node sanity-electron.js', {
+    cwd: path.join(folderName)
+  });
+});