Remote Android — VS Code extension

Remote-control an Android device from inside VS Code. The extension mirrors the device screen to a webview and forwards touch / swipe / key / paste input back to the phone over ADB. No root required — built on the same idea as scrcpy.

Architecture

Host (src/) — Node.js extension code. Manages adb, pushes the scrcpy-server.jar to the device, sets up a reverse tunnel, opens the video + control sockets, and bridges frames / input events to the webview.
Webview (webview-ui/) — React 19 + Vite UI. Decodes the H.264 Annex-B stream via the WebCodecs VideoDecoder, paints frames onto a <canvas>, and captures pointer events.

android-scpy/
├── src/
│   ├── extension.ts               entry, registers the view provider
│   ├── ScrcpyPanelProvider.ts     webview host, message bridge
│   ├── adb/                       adb bootstrap + device polling
│   └── scrcpy/                    protocol: deploy, session, video, control
├── resources/
│   └── scrcpy-server-v2.7.jar     download from upstream (see resources/README.md)
├── webview-ui/                    React app rendered inside the webview
└── esbuild.js                     bundles src/ → dist/extension.js

Prerequisites

Node.js ≥ 20
An Android device with USB debugging enabled (Settings → Developer options → USB debugging)
scrcpy-server-v2.7.jar placed in the resources/ folder — see resources/README.md for the download link.

adb is auto-detected from $PATH; if not found, the extension downloads Android platform-tools into the extension's global storage on first use.

Remote phones (over internet, 4G/5G/cross-network)

adb only talks TCP, so any transport that makes the device reachable by IP works. Recommended setup:

Install Tailscale (or ZeroTier / any VPN) on both the desktop running VS Code and the Android device. The phone now has a stable peer IP (e.g. 100.64.x.y) reachable from your laptop regardless of mobile carrier / NAT.
Enable wireless debugging on the phone:
- Android 10 and earlier: plug via USB once and run adb tcpip 5555 — then unplug. The phone listens on port 5555.
- Android 11+: Settings → Developer options → Wireless debugging → Pair device with pairing code (one-time; port is shown).
In the Remote Android toolbar, type the phone's VPN IP (and port) into the host[:port] field and press Connect. It will appear in the device list; pick it and press Start.

To forget a remote device, select it and press Disconnect.

Build

npm install
cd webview-ui && npm install && cd ..
npm run compile

Output:

dist/extension.js — extension entry
dist/webview/index.html + assets — React bundle
dist/resources/scrcpy-server-v2.7.jar — pushed to device at session start

Run (development)

Open this folder in VS Code.
Press F5 to launch the Extension Development Host.
In the new window, open the Remote Android view from the activity bar.
Plug in a phone (or start an emulator), pick it from the dropdown, press Start.

Pointer events on the canvas become touch events on the device. Use the toolbar buttons for Home / Back / Recents.

Configuration

Setting	Default	Description
`androidScpy.adbPath`	`""`	Override adb location. Empty = auto-detect / download.
`androidScpy.maxSize`	`1080`	Longest side in pixels.`0` = native resolution.
`androidScpy.videoBitRate`	`8000000`	H.264 bitrate (bps).

Scope

MVP ships screen mirror + touch + common keys. File push/pull, APK install, and an interactive shell are planned for a later release.

Publishing

Packaged with @vscode/vsce:

npm install -g @vscode/vsce     # one-time
npm run vsix                    # produces android-scpy-<version>.vsix
npm run publish                 # requires a Personal Access Token for the luongwnv publisher

The marketplace tile uses screenshot.webp via the README hero image; the repository field in package.json lets the marketplace resolve the relative path.

Licensing

This extension: MIT.