简体繁体 English

如何在 iPhone X 的浏览器中检查元素？

[英]How can I inspect element in an iPhone X's browser?

原文 2020-01-05 06:31:37 2 1 ios/ iphone

I have a CSS bug (visual difference) that seems to happen only in iPhone X devices.我有一个似乎只发生在 iPhone X 设备中的 CSS 错误（视觉差异）。

what I would usually do in cases like these is use the inspector tool in the browser the bug occurs to find the rule I wrote that is not cross browser, and do a trial and error in the inspector tool until I find what works cross browser and cross platform.在这种情况下，我通常会做的是在浏览器中使用检查器工具出现错误来查找我编写的不是跨浏览器的规则，并在检查器工具中进行试验和错误，直到找到跨浏览器有效的方法和跨平台。

knowing that iPhone uses safari browser - I installed safari on my windows PC but couldn't reproduce the bug.知道 iPhone 使用 safari 浏览器 - 我在 Windows PC 上安装了 safari 但无法重现该错误。

how can I simulate a browser in a iPhone on my windows PC?如何在 Windows PC 上模拟 iPhone 中的浏览器？ or is there another way to find the quirk in this case in order to fix it?还是有另一种方法可以找到这种情况下的怪癖来解决它？

I can't afford a mac.我买不起 Mac。 I have windows 10 on my PC but can also use a linux distribution if needed.我的 PC 上装有 Windows 10，但如果需要，也可以使用 linux 发行版。 also, this cannot be debugged in a cloud because the security team won't allow the code to be hosted on an external cloud at the stage of development.此外，这不能在云中调试，因为安全团队不允许在开发阶段将代码托管在外部云上。

1 个解决方案

As far as I know, your best/cheapest approach would be to run MacOS within a Virtual Machine and then perform the steps Neal suggested.据我所知，您最好/最便宜的方法是在虚拟机中运行 MacOS，然后执行 Neal 建议的步骤。

But keep in mind that you need to run the network config of your Virtual Machine in "Bridge Mode" otherwise your virtual macos can't see any devices on your network.但请记住，您需要在“桥接模式”下运行虚拟机的网络配置，否则您的虚拟 macos 无法看到您网络上的任何设备。