Playwright技术问询：运行时如何获取browserContext的isMobile属性

1. 直接获取Context的isMobile配置 #

isMobile是创建BrowserContext时传入的初始化选项，并非BrowserType的方法。你可以通过两种方式获取：

• 方式一：保存初始化时的配置值
  创建context时，把isMobile的值存在变量中，后续直接使用：

  const isMobile = true; // 或者根据你的逻辑动态设置
  const context = await browser.newContext({ isMobile });
  
  // 后续需要判断时直接用这个变量
  if (isMobile) {
    // 移动端逻辑
  }
  

• 方式二：从Context的配置中读取
  Playwright的BrowserContext对象可以通过options()方法获取初始化参数：

  const contextOptions = page.context().options();
  const isMobile = contextOptions.isMobile;
  

2. 通过视口尺寸判断 #

如果你的场景是根据当前视口大小判断是否为移动端，可以直接获取当前页面的视口尺寸，结合通用的移动端阈值（比如宽度≤768px）判断：

const viewport = await page.viewportSize();
const isMobile = viewport.width <= 768; // 可根据需求调整阈值

3. 通过浏览器端JS检测 #

如果需要更精准的客户端环境判断，可以在页面中执行JS来检测：

// 方式一：检测视口宽度
const isMobile = await page.evaluate(() => window.innerWidth <= 768);

// 方式二：使用媒体查询
const isMobile = await page.evaluate(() => window.matchMedia('(max-width: 768px)').matches);

// 方式三：检测User-Agent中的移动设备标识
const isMobile = await page.evaluate(() => /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent));

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