chrome调试、移动端调试】的更多相关文章

chrome 32版本后,添加 DevTools for Mobile 插件就可远程手机调试 DevTools for Mobile插件安装https://support.google.com/chrome/topic/3422804?hl=zh-Hans&ref_topic=3422738 chrome 32版本之前的调试需要安装 ADB插件和 android SDK 软件 Android上使用Chrome DevTools 远程调试WebView   相关文章: http://blog.cs…
使用Chrome开发者工具调试Android端内网页(微信,QQ,UC,App内嵌页等) 前言 移动端页面调试一直是好多朋友头疼的问题,iOS 由于其封闭的特性和整体较高的性能,整体适配相对好做,调试也由于 safari 的打通变得很方便.而 Android 系统,尤其是国内环境下的 Android 系统,由于版本跨度大,且各家厂商采用自研内核,使得其成为移动端页面问题出现的主要平台.工程师们采用了各种各样的方式来对其进行调试:alert 大法,页面引入或注入VConsole/eruda开启移动…
Chrome浏览器如何调试移动端网页信息 2017年08月12日 12:42:20 阅读数:835 最近在弄项目,用WebView加载一个页面,想追踪页面中一个按钮的点击事件.这个可能就需要调试这个页面了.而关于WebView调试页面,我觉得有点麻烦,所以这里直接利用PC端的Chrome浏览器进行调试即可.因为Chrome浏览器可以支持预览手机页面.关于需要调试的页面地址为:https://ds.alipay.com 下面就来开始直接进行调试功能,首先我们在PC端用Chrome打开这个链接: 我…
Learning Hybird App Test–Appium Java(Leyden) 浏览器的远程调试工具,使得我们可以通过PC上开启的控制台,调试手机浏览器中正在运行的代码.运行于 Android 4+系统的Chrome for Android 同样也可以配合ADB(Android Debug Bridge)实现桌面远程调试.桌面版Chrome32+已经支持免安装ADB即可实现远程调试移动设备页面/WebView . Android远程调试目前支持所有操作系统,并且支持以下: ● 调试站点…
我使用的是魅族(魅蓝NOTE6 ),电脑是win 7系统,以下几步就可以轻松使用浏览器内置的功能调试移动端网页了: 注意:谷歌浏览器需要先FQ,不然调试页面会空白或者报404错误,(不会FQ的可以联系我 QQ:2417301781) 1. 手机开启调试模式连接电脑,确保是调试模式连接的(不知道怎么打开调试模式的可以参考:http://jingyan.baidu.com/article/046a7b3ee3b565f9c27fa9b2.html): 2. 手机上打开一个网页,只要是webview形…
谷歌输入(chrome://inspect/#devices) 我使用的是小米(红米NOTE2 ),电脑是win 10 系统,以下几步就可以轻松使用浏览器内置的功能调试移动端网页了: 1. 手机开启调试模式连接电脑,确保是调试模式连接的(不知道怎么打开调试模式的可以参考:http://jingyan.baidu.com/article/046a7b3ee3b565f9c27fa9b2.html): 2. 手机上打开一个网页,只要是webview形式的网页应该都是可以的: 3. 电脑chrome浏…
现在的产品,移动端应用占据很大市场,在测试过程中,就会测试各种各样的移动端页面.测试过程,或多或少会发现些问题,无非就是前端.后端问题.后端接口问题,可以利用工具:Fiddler或charles抓包查看:前端页面问题,可以让开发把调试工具放在页面中,可如果没有该调试工具,那该如何查看前端报错问题呢?比如,页面白屏,抓包没调接口,如何拿到报错信息呢. 讲到这里,就需要"请"出今天的主角了,Chrome网页调试工具.该调试工具,只需要将手机与电脑连接就可以调试了,但其中有个问题就是FQ了,…
一:背景通常情况我们调试移动端页面最常用的方法就是:切换pc端浏览器的userAgent来模拟手机或其他移动设备调试页面 然后用手机打开要调试的页面 刷新页面查看调试结果 但是这就存在两个问题 在pc浏览器模拟手机可能造成调试不准 用手机直接调试 又多一步刷新 那怎么能达到在pc端修改代码 在手机上直接看到修改结果这样的所见即所得的效果呢 chrome做到了 二.功能 我们先看下最终想要达到的效果 上图的左边是pc端的chrome浏览器,右边是手机上的chrome 然后可以看到当鼠标移动到某个d…
尝试了各种Mac版本的安卓模拟器,包括Android Studio.Genymotion以及国内的网易MuMu.夜神.蓝叠.腾讯手游助手,做的最好的是Android Studio,最难上手的也是Android Studio. Android Studio有两种架构类型的镜像可选,分别是x86和ram,安装ram架构的镜像,非常卡,没法用,x86的镜像很流畅,只能用来调试基于x86架构的App 其它几个从安装到使用都非常简单,国内的几个,稳定性都比较差,全部都存在启动时进度卡在99%的问题,相对稳…
移动端调试神器vconsole,手机端网页的调试工具Eruda 移动端中使用 vConsole调试 移动端调试工具vconsole安装Git地址:https://github.com/WechatFE/vConsolevConsole是一款由微信公众平台前端团队打造的前端调试面板,专治手机端看log难题.目前vConsole自带有2个面板,默认为“日志”面板,负责展示log. 项目开发时经常需要debug调试,但在移动端debug则会阻断代码运行,并且很难判断出错在哪里,这里我们需要借助第三方插…
移动端调试Web页面 虽然可以在PC下,通过开发者工具,模拟移动端,但是这样只能模拟页面样式,对于代码的执行情况是无法模拟的,所以在此结合实际调试经验,针对安卓与IOS设备,进行总结. IOS 安卓 IOS 软件准备 Node.js Scoop Remotedebug-ios-webkit-adapter 说明: Scoop是一款Windows下命令行包管理工具 Scoop安装完后,通过它下载 ios-webkit-debug-proxy 安装Node模块:remotedebug-ios-web…
在Chrome+Visual Studio中调试asp.net程序很慢的问题(Firefox也有类似问题) 今天开始起在Chrome中调试,发现问题主要出在菜单栏(layout文件)中,google了一番,查到很多原因,不过最终解决方法倒是很简单,特此分享一下: 在C:/Windows/System32/drivers/etc里边有一个hosts文件,用记事本打开,里边最后几行原来是: # localhost name resolution is handled within DNS itsel…
先看这篇文章 Web应用调试:现在是Weinre和JSConsole,最终会是WebKit的远程调试协议. 我们先不看未来,从此文可见,当下的移动端调试还是 Weinre 和 JSConsole 的天下.Weinre 我们在前面已经有所了解(详见 移动端页面(css)调试之"weinre大法"),它主要是为了移动端 css 的调试,能兼容各种浏览器,支持 css 修改,且不用刷新就能在移动端看到效果.今天我们来了解下另一种利器 -- JSConsole. 移动端的调试最蛋疼的恐怕就是想…
最近发现了一个移动端调试的新技能,这里简单描述一下基本情况. 移动端调试常遇到的问题 手机访问只能看到页面的展现,除此之外看不到任何其他信息 无法像调试PC页面那么方便的查看js.dom.network.cookie.storage等信息 js调试只能通过alert来提示了,当然经验丰富的开发者,会制作一个简单的调试信息展示页面,相当于控制台的功能. debuggap简介 run easily and debug powerfully 无需安装,就可以在windows.linux和mac上运行…
记:今天调试时出现的一个PC端调试运行正常,但打包apk文件后在手机上点击闪退的问题. 可能在不同的情况条件下,会有不同的原因导致apk安装后闪退问题.拿android studio等软件来说,开发安卓程序时会有日志log文件包含生成错误信息等,但是cocos2dx开发在命令行里编译apk,意外的错误缘由难以直面地展现给我们. 闪退的大致问题都殊途同归:资源的加载出现问题. 我今天出现这个问题之后,进行了一些尝试,在解决问题的过程当中,大致操作如下: 1.将Resources资源文件夹下的全部目…
  chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装后无法使用,出现vue.js not detected提示的解决办法 找到插件的安装目录: (可以通过id搜索ID:nhdogjmejiglipccpnnnanhbledajbpd) C:\Users\liangsuya\AppData\Local\Google\Chrome\User Data\D…
在 Chrome 中调试 JS 代码,那你不得不与 Chrome DevTools 的 Sources 面板打交道,所以文章主要通过介绍 Sources 面板上的各部分功能来介绍如何调试网页中的 JS. 熟悉 Sources 面板 先来认识一下 Sources 面板(以我的 Github 首页举例). 可以看到面板被分为左中右三个部分,左边是文件导航,中间是文件的具体内容,右边可以统称为调试面板.整个面板就像一个 IDE,所以还是挺亲切的. 左边的文件导航面板包含 3 个面板:,分别是: Sou…
我的安装环境:XAMPP版本号V3.1.0 ;phpStorm版本8.0.3;windowsxp 32bit.您老人家先过目一下,不然怕影响意义. XAMPP.phpStorm 都直接安装在了D盘根目录,9999m目录建在D:\xampp\htocts下,即目录工程文件夹路径为D:\xampp\htocts\9999m.在phpStorm>File>open,找到9999m,点击确定,加载9999m到了phpStorm(安装环境路径根据需要自行更改,后面的配置内容也类似).图1 XAMPP+p…
一.背景 使用Visual Studio Code写了一个简单的Html页面,想调试下其中script标签里的javascript代码,网上查了一通,基本都是复制粘贴或者大同小异的文章,就是要安装Debugger for Chrome插件,修改launch.json配置信息,F5启动,这些都照做了,但是仍有两个问题,一个是Html文件里不能打断点,只能在js文件里面打,二是chrome打开后说连接不到localhost,下面分别讲讲是怎么解决. 二.Html文件中不能打断点问题 默认情况下,VS…
调试场景 1.调试页面在手机上.2.调试工具在PC的chrome3.手机跟pc要在同一个网络环境下,也就是都使用一个wifi 一.安装 Weinre 1.Weinre是基于nodejs实现的,所以使用它必须先安装node运行环境,新版的node已经集成了npm, 所以直接在在命令行键入下面的命令即可安装, 如果你是Mac/Linux用户, 还需要在前面加入"sudo": npm -g install weinre 2.安装后输入命令 "weinre", 查看wein…
一.概述 有一个项目需要在手机端显示一个 web 页面,而每次把应用 launch 后,从手机端看比较麻烦,因此搜罗了几种在 PC 端调试手机端页面的工具. 二.工具 http://fonkie.iteye.com/blog/1846858 http://blog.csdn.net/dojotoolkit/article/details/6280924…
现在移动端开发越来越火,随之而来的问题也越来越多,今天给大家介绍一款移动端调试神器,vconsole. 一.先引用文件,可以从https://www.bootcdn.cn/vConsole/下载,也可以下载保存在本地,直接引用 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>demo.html</title> <script src=&q…
vConsole.js 其实就是重写console方法,实现了类似于微信小程序的移动端调试效果 在普通html文件里使用 <script src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script> <script> // init vConsole var vConsole = new VConsole(); console.log('Hello world'); &l…
chrome浏览器安装vue调试器vue-devtools https://blog.csdn.net/zhangjnwei/article/details/76693053…
chrome禁用缓存:调试javascript   chrome对js和图片的缓存,导致调试的程序不是最新的,有时F5刷新了都没用. 可以禁用缓存: 先按F12,再按F1, 勾选 Disable cache (while DevTools is open)…
一:背景在使用appium进行app端自动化测试的时候,一般使用的是uiautomatorviewer来给页面元素做定位.但如果遇到页面元素类型是webview的时候,则只能定位整个页面,而不能更进一步定位页面内容,这通常是不方便的.经过一番搜索,发现可以使用谷歌浏览器的inspect功能来实现类似功能,该功能一般用于调试前端代码. 二.功能 我们先看下最终想要达到的效果 上图的左边是手机上的chrome 截图,可以看到,当鼠标移动到某个span上时,手机上的这个区域高亮显示,右边则实时显示的是…
一 使用浏览器chrome打开程序,进行调试.跟普通js程序一样. 要么自行搭建服务器,利用python脚本,或者用其他服务器程序(LAMP或XAMPP).然后用浏览器打开服务器地址. 要么直接使用cocos提供好的命令行:cocos run –p web 浏览器调试好处是,方便,对于小程序或者非native代码是非常有意义的.但部署到真机后遇到的问题,这就无法解决了,而且一些native代码也无法调试. 二 使用firefox远程调试. 因为cocos2d-js使用spidermonkey作为…
vsCode 添加浏览器调试和js调试的方法 1.直接按F5可以调试的方法或者点击运行按钮(可以直接运行html文件或者js文件) 在launch.json文件中的配置如下: {     "version": "0.2.0",     "configurations": [{             "name": "谷歌浏览器", //运行html文件,用谷歌浏览器打开             "…
0.介绍 先上图:不知道有多少人发现,在浏览器开发工具的“Console”上的百度首页的关于百度招聘的信息: 今天要给大家介绍的就是是Web前端调试工具中的Console面板,应该说只要是个浏览器就会有的开发者工具,按F12出现的即是,就是我们上面图片上显示的Console,我这以谷歌浏览器为例进行下基本的讲解. Console探险 今天我们重点要学的是开发者工具中的"Console",在介绍Console之前,我们先将其它的几个面板介绍下: Element:主要是用来调试网页中的ht…
gdb thread apply all bt 如果你发现有那么几个栈停在 pthread_wait 或者类似调用上,大致就可以得出结论:就是它们几个儿女情长,耽误了整个进程. 注意gdb的版本要高于7.0,之前使用过gdb6.3调试多线程是不行的. 从上图可以看出两个线程都阻塞在wait上,而且还给出了在哪一行代码中,很容易就定位到产生死锁的位置. 有时候线程太多,想写到文件里,可以: (gdb)set logging file <文件名> (gdb)set logging on (gdb)…