【问题标题】:How to simulate highlight text for mobile devices on Chrome Dev Tools?如何在 Chrome 开发工具上模拟移动设备的高亮文本?
【发布时间】:2021-07-15 00:16:07
【问题描述】:

我很好奇是否可以通过 Chrome 开发工具模拟“touchstart”上的突出显示文本,而不是直接在手机上进行测试。

我尝试了移动视图,但是当我拖动它时,触摸图标似乎没有突出显示文本。

非常感谢。

【问题讨论】:

  • FWIW 有手机模拟器。
  • 我忘了提到我的电脑在使用手机模拟器时崩溃/挂起。 :p

标签: google-chrome-devtools


【解决方案1】:

设备模式中不提供此级别的详细信息。您需要使用模拟器。

设备模式仅用于提供大多数开发人员测试其 Web 应用程序所需的 85-90%。它并不是要处理所有事情(因为突出显示的 UX 是特定于平台的),也不是要取代实际的设备测试。

【讨论】:

    【解决方案2】:

    很老的问题,但是现在我们可以使用 chrome 的新功能 Remote Debugging 代替模拟器。

    以下是步骤:

    1. Enable Developer Options - 启用点击 Build Number 7 次
    Settings > About Phone > Build Number
    

    上述位置可能因您的 Android 版本而异。

    1. Enable USB Debugging
    Settings > System > Developer Options > USB debugging
    
    1. 使用 USB 数据线将您的移动设备连接到计算机,然后点按确定 允许USB 调试
    2. 打开chrome://inspect/#devices并在远程目标部分检查您的设备是否在列表中,如果没有,请确保解锁您的设备。
    3. 设备部分,点击端口转发并输入您的网站端口(例如:8080),然后在下一个字段中输入 IP和端口(例如:localhost:8080
    4. 在手机上打开 chrome 并转到 localhost:8080

    您仍然可以使用 chrome devtools 进行调试,只需点击 Remote Target 部分中的检查即可。

    【讨论】:

      猜你喜欢
      • 2018-04-17
      • 1970-01-01
      • 2020-03-19
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-10-08
      • 2020-12-04
      • 2017-11-27
      相关资源
      最近更新 更多