hdw2/src/debug.js

鸿蒙前端hdc调试工具

/*
 * @Author: tankunpeng
 * @Date: 2024-06-26 19:47:35
 * @LastEditTime: 2024-07-19 17:34:04
 * @LastEditors: tankunpeng
 * @Description: 调试webview页面
 * Come on, worker!
 */
const shell = require('shelljs');
const chalk = require('chalk');
const open = require('open');
const cp = require('copy-paste');
const { getHdc } = require('./util');

function printTitle(text = '=====>调试端口映射结束<=====') {
    shell.echo(chalk.italic(chalk.bold(chalk.magenta(text))));
}

function debug(options = {}, command = {}) {
    const commandName = command._name || '';
    const hdc = getHdc();
    printTitle('=====>调试端口映射开始<=====');
    shell.echo(chalk.cyan('查询可调试应用PID列表...'));
    const catCmd = `${hdc} shell cat /proc/net/unix`;
    const pidListExec = shell.exec(catCmd, { silent: true });
    if (pidListExec.code !== 0) {
        shell.echo(`${chalk.cyan('调试端口映射结果: ')}${chalk.red('失败')}`);
        shell.echo(
            `${chalk.cyan('处理建议: ')}${
                chalk.yellow('查询webview pid命令执行失败,请手动执行命令尝试\n命令:') + chalk.green(catCmd)
            }`
        );
        printTitle();
        shell.exit(1);
    }
    const pidListStdout = pidListExec.stdout;
    const lines = pidListStdout
        .split(/\n|\r/)
        .filter((item) => item.includes('webview_devtools_remote_'))
        .map((item) => {
            return item.split('webview_devtools_remote_')[1];
        });

    const pidArr = Array.from(new Set(lines));

    if (!pidArr.length) {
        shell.echo(`${chalk.cyan('调试端口映射结果: ')}${chalk.red('失败')}`);
        shell.echo(
            `${chalk.cyan('处理建议: ')}${chalk.yellow(
                `未找到可调试应用,请打开需要调试的应用,且确保该应用已打开webview调试开关\n文档地址:${chalk.green(
                    'https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/web-debugging-with-devtools-V5'
                )}`
            )}`
        );
        printTitle();
        shell.exit(1);
    }
    shell.echo(`${chalk.cyan('应用PID列表: \n')}${chalk.green(pidArr.join('\n'))}\n`);
    shell.echo(chalk.cyan('进行端口映射...'));
    const inputPort = parseInt(options.port);
    const defaultPort = 9222;
    let port = inputPort || defaultPort;

    shell.echo(`${chalk.cyan('映射起始端口号: ')}${chalk.green(port)}`);
    for (let i = 0; i < pidArr.length; i++) {
        const pid = pidArr[i];
        const fportCmd = `${hdc} fport tcp:${port} localabstract:webview_devtools_remote_${pid}`;
        const pidExec = shell.exec(fportCmd, { silent: true });
        if (pidExec.code !== 0 || /\[Fail\]/.test(pidExec.stdout)) {
            shell.echo(`${chalk.cyan('调试端口映射结果: ')}${chalk.red('失败')}`);
            shell.echo(`${chalk.cyan('报错信息:\n')}${chalk.red(pidExec.stdout)}`);
            shell.echo(
                `${chalk.cyan('处理建议: ')}${chalk.yellow(
                    `端口映射命令执行失败,请手动执行命令尝试,可以尝试更换端口号,如将${port}更换为${
                        port + 1
                    }\n命令: ${chalk.green(fportCmd)}`
                )}`
            );
            printTitle();
            shell.exit(1);
        }
        port++;
    }
    shell.echo(chalk.cyan('查询调试端口映射结果...'));
    const fportLsCmd = `${hdc} fport ls`;
    const fportLsExec = shell.exec(fportLsCmd, { silent: true });
    if (fportLsExec.code !== 0) {
        shell.echo(`${chalk.cyan('调试端口映射结果: ')}${chalk.red('失败')}`);
        shell.echo(
            `${chalk.cyan('处理建议: ')}${chalk.yellow(
                '查询端口映射列表命令执行失败,请手动执行命令尝试\n命令:' + chalk.green(fportLsCmd)
            )}`
        );
        printTitle();
        shell.exit(1);
    }
    const fportLs = fportLsExec.stdout;
    shell.echo(`${chalk.cyan('调试端口映射结果: ')}${chalk.green('成功')}`);
    shell.echo(`${chalk.cyan('调试映射列表: \n')}${chalk.green(fportLs)}`);
    printTitle();

    shell.echo(chalk.green('\n=====>浏览器调试地址<====='));
    const edgeUrl = 'edge://inspect/#devices';
    const chromeUrl = 'chrome://inspect/#devices';
    const suffix = ' ==>已复制到剪贴板';
    shell.echo(`${chalk.cyan('edge: ')}${chalk.green(`${edgeUrl}${(!options.chrome && suffix) || ''}`)}`);
    shell.echo(`${chalk.cyan('chrome: ')}${chalk.green(`${chromeUrl}${(options.chrome && suffix) || ''}`)}`);

    const curUrl = options.chrome ? chromeUrl : edgeUrl;
    cp.copy(curUrl);
    if (options.open) {
        const appNames = options.chrome ? [open.apps.chrome, open.apps.edge] : [open.apps.edge, open.apps.chrome];
        // edge浏览器兼容chrome://协议地址
        open(chromeUrl, {
            app: { name: appNames }
        });
    }
}

exports.debug = debug;