使用Safari调试UIWebView

关于富文本编辑，我只能说遍地是坑。

最近读了微信读书团队写的一篇博文，我真的是深有同感。这里附上链接http://www.tuicool.com/articles/QB36jyZ。有富文本编辑需求的可以看一下，会让你少走很多弯路。

想想去年刚进公司的第一个月就接手富文本编辑功能，当时技术组也没有对这个需求进行详细的讨论，三端各自开发各自的。一个月后测试，才发现样式什么的都不大一样，手机端都是用native来实现。我用的是TextKit，web端用的自己写的css。最后三端渲染出来的富文本不管是在字体大小还是颜色方面都略有差别。于是一个月写的代码被推翻，开始了漫无止境的js和native交互。

好了，回到文章主题。首先打开Safari中的偏好设置，点击【高级】，勾选底部【在菜单栏中显示“开发”菜单】。这样在顶部你就能看到开发两个字了。

屏幕快照 2018-07-12 上午10.39.09.png

然后点击开发，会出现一个下拉列表。这个时候你需要将工程跑在模拟器或者真机上，列表中会显示当前加载这个工程的模拟器或者真机。然后在你要调试的app上打开你要调试的UIWebView页面，这个时候下级目录里会显示你当前运行的app。

屏幕快照 2018-07-12 上午10.39.20.png

点击模拟器或者真机的下级目录下的app。桌面会弹出一个框，这个框就是网页检测器，此时，你就可以调试了。

[图片上传中...(屏幕快照 2018-07-12 上午10.39.43.png-5f8608-1531363283916-0)]

调试出的bug，会有红色数字的提示。

屏幕快照 2018-07-12 上午10.39.43.png

点击红色数字，进入bug详情

屏幕快照 2018-07-12 上午10.39.56.png