移动端开发调试

响应式测试

  • 响应式的测试特别简单,通过改变视窗大小(也就是缩放你的浏览器)即可测试
  • Firefox 工具 -》Web 开发者 -》自适应设计视图
  • Chrome 模拟设备尺寸

基于 Android 的移动端前端开发调试

Android 虚拟机

  • ADT(Android Developer Tools)
  • Genymotion

Android 真机调试

public class WebViewHook implements IXposedHookLoadPackage {
    // handleLoadPackage 会在android加载每一个apk后执行
    public void handleLoadPackage(LoadPackageParam lpparam) throws Throwable {
           // 可以从lpparam中获取当前apk的名字
        if (! lpparam.packageName.equals("com.tencent.mobileqq")) {
            return;
        }
        XposedBridge.log("WebViewHook handleLoadPackage: " + lpparam.packageName);
        // 勾住 WebView 所有的构造器
        XposedBridge.hookAllConstructors(WebView.class, new XC_MethodHook() {
            @Override
            protected void beforeHookedMethod(MethodHookParam param) throws Throwable {
                // 打开webContentsDebuggingEnabled
                XposedHelpers.callStaticMethod(WebView.class, "setWebContentsDebuggingEnabled", true);
                XposedBridge.log("WebViewHook new WebView(): " + packageName);
            }
        });
    }
}

基于 iOS 的移动端前端开发调试

  1. Safari 开发者选项
  2. OS Simulator 
Made with Slides.com