uiviewer 1.0.3

UI hierarchy visualization tool, supporting Android, iOS, HarmonyOS NEXT.

ui-viewer

UI hierarchy inspector, supporting Android, iOS, HarmonyOS NEXT.

This project is developed using FastAPI and Vue. It starts the service locally and displays UI hierarchy tree through web browser.

Installation

• python3.8+

pip3 install -U uiviewer

Run

Run the following command on the terminal. (default port 8000)

uiviewer
# or
python3 -m uiviewer

INFO:     Started server process [46814]
INFO:     Waiting for application startup.
INFO:     Application startup complete.
INFO:     Uvicorn running on http://127.0.0.1:8000 (Press CTRL+C to quit)
INFO:     127.0.0.1:55080 - "GET / HTTP/1.1" 307 Temporary Redirect
INFO:     127.0.0.1:55080 - "GET /static/index.html HTTP/1.1" 200 OK
INFO:     127.0.0.1:55080 - "GET /static/css/style.css HTTP/1.1" 200 OK
INFO:     127.0.0.1:55080 - "GET /static/js/index.js HTTP/1.1" 200 OK
INFO:     127.0.0.1:55080 - "GET /static/js/api.js HTTP/1.1" 200 OK
INFO:     127.0.0.1:55082 - "GET /static/js/utils.js HTTP/1.1" 200 OK
INFO:     127.0.0.1:55082 - "GET /static/js/config.js HTTP/1.1" 200 OK
INFO:     127.0.0.1:55082 - "GET /version HTTP/1.1" 200 OK

And then open the browser to http://localhost:8000

You can also customize port to start the service.

uiviewer -p <PORT>
# or
python3 -m uiviewer -p <PORT>

Tips

• If you are using a virtual environment, please make sure to activate it before running the command.

• On iOS, please ensure that WDA is successfully started and wda port forwarding is successful in advance.

  • First, Use xcode or tidevice or go-ios to launch wda.

  tidevice xctest -B <wda_bundle_id>
  

  • Second, Use tidevice or iproxy to forward the wda port，and keep it running.

  tidevice relay 8100 8100
  

  • And then, To ensure the success of the browser to access http://localhost:8100/status, return like this:

  {
    "value": {
        "build": {
            "productBundleIdentifier": "com.facebook.WebDriverAgentRunner",
            "time": "Mar 25 2024 15:17:30"
        },
        ...
        "state": "success",
        "ready": true
    },
    "sessionId": null
  } 
  

  • Finally, Input the wdaUrl in the web page, such as http://localhost:8100

• On iOS，WDA can easily freeze when dumping high UI hierarchy. You can reduce the maxDepth on the web page. The default is 30.

Preview

• HarmonyOS

• Android

• iOS

Relevant

• https://github.com/codematrixer/hmdriver2
• https://github.com/openatx/uiautomator2
• https://github.com/openatx/facebook-wda
• https://github.com/alibaba/web-editor