sim-preview
sim-preview builds and launches your iOS app in the simulator, then exposes it via TrollVNC for remote viewing and interaction. Connect from iPhone using RealVNC Viewer over Tailscale to see UI changes and test interactions live as you iterate with hot reload.
sim-preview lets you build and launch iOS apps in the simulator, then view and control them remotely from iPhone via VNC.
AI-generated summary based on this skill's SKILL.md
Install
K9i-0/ccpocket/sim-preview · repository language: Dart
git clone https://github.com/K9i-0/ccpocket
cp -r ccpocket/.claude/skills/sim-preview ~/.claude/skills/sim-previewFrequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
How do I set up remote iOS simulator preview via VNC?
sim-preview automates the setup by building your iOS app in the simulator and exposing it through TrollVNC. After installation, the tool configures a VNC server on the simulator. You then connect using RealVNC Viewer on your iPhone over Tailscale to view the simulator screen in real time. The MIT-licensed tool handles the bridge between your development environment and remote viewing.
Can I build and run my app on simulator with VNC viewer access?
Yes. sim-preview builds and launches your iOS app directly on the simulator, then immediately makes it accessible via VNC. Once running, you can connect a VNC viewer (like RealVNC Viewer on an iPhone) to see the live simulator display. This lets you monitor UI rendering and app behavior remotely without needing to sit at your development machine.
What is the TrollVNC simulator preview setup process?
sim-preview handles TrollVNC configuration automatically. The tool sets up a VNC server on your iOS simulator and integrates with Tailscale for secure remote access. You install sim-preview, run your build command, and the VNC endpoint becomes available. Connect from your iPhone using RealVNC Viewer over your Tailscale network to start previewing.
How does sim-preview enable hot reload feedback with remote viewing?
sim-preview maintains a persistent VNC connection to your simulator while supporting hot reload workflows. As you make code changes and trigger hot reload, the remote viewer on your iPhone updates in real time, showing UI changes instantly. This creates a live feedback loop where you can iterate on your app and see results immediately from a remote device.
Can I view simulator output on my iPhone device remotely?
sim-preview enables exactly this by exposing your simulator via TrollVNC and Tailscale. Install RealVNC Viewer on your iPhone, connect over Tailscale to the VNC server running on your simulator, and you'll see the full simulator screen. You can interact with the app, observe UI behavior, and test functionality all from your iPhone.
What do I need to configure for remote simulator debugging on iPhone?
sim-preview requires Tailscale for secure networking and RealVNC Viewer installed on your iPhone. The tool itself handles VNC server setup on the simulator. Once sim-preview builds your app, your iPhone connects to the Tailscale network and uses RealVNC Viewer to access the simulator's VNC endpoint. No manual VNC configuration is needed.
SKILL.md
rendered from the published skill — quoted content, verbatim
Simulator Preview (TrollVNC)
iOSシミュレーターでアプリを起動し、TrollVNC でリモートプレビュー環境を提供する。 ユーザーは iPhone の VNC Viewer アプリ（RealVNC Viewer 推奨）から Tailscale 経由で接続し、シミュレーター画面をリアルタイムで確認・操作できる。
ワークフロー概要
iPhone (ユーザー)
├── ccpocket で Claude Code に指示
├── RealVNC Viewer でシミュレーター画面を確認
└── 指示 → 変更 → hot reload → 目視確認 のループ
手順
1. アプリをビルド・起動
dart-mcp の launch_app でシミュレーターにアプリを起動する。
hot reload が使えるデバッグモードで起動される。
シミュレーターがまだ起動していない場合は、先にブートする:
# 利用可能なiPhoneシミュレーターを確認
xcrun simctl list devices available | grep iPhone
# 起動（UDIDを指定）
xcrun simctl boot <UDID>
起動済みのシミュレーターを確認:
xcrun simctl list devices booted
dart-mcp でアプリを起動:
- root: プロジェクトの apps/mobile ディレクトリ
- device に booted なシミュレーターの UDID を指定
2. TrollVNC 起動（スクリプト）
bash .claude/skills/sim-preview/scripts/sim-preview.sh
スクリプトが以下を行う: - シミュレーターの起動確認（未起動なら自動ブート） - trollvncserver バイナリをシミュレーターに配置 - VNC サーバー起動（ポート 5901、スケール 0.75、ナチュラルスクロール、サーバーサイドカーソル） - Tailscale IP を検出して接続情報を出力
出力例:
```text SIMULATOR:
(truncated - see the full file via the links below)
Read as markdown · JSON record · Browse the source repository
File tree — 2 files
.claude/skills/sim-preview/SKILL.md
.claude/skills/sim-preview/scripts/sim-preview.sh