Electron-Vue集成Playwright自动化测试：Page.title()返回空值问题

在Electron-Vue项目中使用Playwright做自动化测试时，调用page.title()返回空字符串，可尝试以下几种解决方式：

1. 等待页面完全加载 #

electronApp.firstWindow()仅能获取窗口实例，但页面可能还未完成渲染。可以等待页面的load状态，或等待特定元素出现后再获取标题：

test("renders the screen splash", async () => {
  const page = await electronApp.firstWindow();
  // 等待页面加载完成（可选：也可等待特定DOM元素）
  await page.waitForLoadState('load');
  // 示例：等待 splash 页面的某个元素
  // await page.waitForSelector('.splash-content');
  
  const title = await page.title();
  console.log("Title: ", title);
  expect(title).toBe('Splash');
});

2. 确认Vue页面标题的设置时机 #

如果标题是在Vue组件的生命周期钩子（如mounted）中通过document.title = 'Splash'设置的，需确保该逻辑已执行。可通过等待组件渲染后的元素来验证页面状态，再获取标题。

3. 直接通过Electron API获取窗口标题 #

若窗口标题是由Electron主进程设置的，可绕过Web页面，直接调用Electron的窗口API获取标题：

test("renders the screen splash", async () => {
  const page = await electronApp.firstWindow();
  // 通过Electron API获取窗口标题
  const windowTitle = await page.evaluate(() => {
    // 注意：高版本Electron需确保remote模块已启用，或改用IPC通信
    return window.require('electron').remote.getCurrentWindow().getTitle();
  });
  
  console.log("Window Title: ", windowTitle);
  expect(windowTitle).toBe('Splash');
});

4. 检查Playwright的Electron配置 #

确保playwright.config.ts中正确配置了Electron应用的启动路径，比如指向开发环境的启动入口或打包后的可执行文件：

import { defineConfig } from '@playwright/test';

export default defineConfig({
  use: {
    electron: {
      // 指向你的Electron应用入口
      executablePath: './node_modules/.bin/electron',
      args: ['./src/main.js'],
    },
  },
});

内容的提问来源于stack exchange，提问作者Nikhil