Dalam dunia pengembangan perangkat lunak yang terus berkembang, pengujian antarmuka pengguna (UI) tetap menjadi tantangan. Midscene: AI-powered UI Automation hadir sebagai pendekatan baru yang berani, mengubah cara kita mengotomatisasi pengujian UI dan tugas-tugas UI lainnya. Platform sumber terbuka ini menjanjikan pengujian UI berbasis visi yang memungkinkan Anda menulis tes dalam bahasa alami dan mengotomatisasi berbagai platform.
Mengapa Midscene Penting?
Sebagian besar alat otomasi UI, termasuk yang membaca DOM atau pohon aksesibilitas, sangat bergantung pada struktur halaman. Struktur semacam ini cenderung rapuh dan seringkali tidak lengkap. Selektor dapat rusak dengan setiap refactor. Elemen tanpa semantic markup seperti tombol berbasis ikon, kontrol kustom, atau elemen <canvas> menjadi tidak terlihat. Aplikasi native dan iframe lintas-asal juga berada di luar jangkauan. Terlebih lagi, metode ini tidak dapat memastikan apakah tampilan visual suatu elemen sudah benar.
Midscene mengatasi masalah ini dengan bekerja hanya dari tangkapan layar. Anda cukup menjelaskan setiap langkah dalam bahasa alami. Pendekatan ini menawarkan beberapa keunggulan kunci:
| Fitur Tradisional (Berbasis DOM/Struktur) | Keunggulan Midscene (Berbasis Visi) |
|---|---|
| Pemeliharaan tinggi, selektor sering rusak | Pemeliharaan rendah, tidak perlu mengejar selektor saat UI berubah |
| Elemen tertentu tidak terjangkau | Mencapai setiap elemen dan permukaan, jika manusia bisa melihat, Midscene bisa menargetkannya, bahkan pada <canvas>, aplikasi native, dan iframe lintas-asal |
| Tidak dapat memverifikasi tampilan visual yang sebenarnya | Memverifikasi apa yang sebenarnya dilihat pengguna, seperti warna, highlight, tata letak, dan status rendering |
Midscene dirancang utamanya untuk pengujian UI, tetapi mesin berbasis visinya mampu menangani berbagai tugas otomasi UI lainnya.
Cara Kerja dan Apa yang Bisa Diotomatisasi
Midscene bekerja di mana pun Anda bisa mengambil tangkapan layar, termasuk peramban web, Android, iOS, HarmonyOS, aplikasi desktop, dan antarmuka kustom apa pun. Semua ini dapat dilakukan melalui satu API terpadu. Anda dapat menulis otomasi menggunakan JavaScript SDK atau dalam format YAML. Agen AI juga dapat melakukan pengujian secara otonom melalui fitur Skills.
Beberapa metode inti yang bisa Anda gunakan meliputi:
aiAct: Melakukan tindakan berdasarkan deskripsi bahasa alami.aiQuery: Meminta informasi tentang elemen UI.aiAssert: Memastikan kondisi UI tertentu terpenuhi.
Midscene Skills, misalnya, memungkinkan Anda mengontrol platform apa pun dengan OpenClaw. Contoh penggunaannya termasuk otomasi pendaftaran formulir GitHub di peramban web, pemesanan kopi di aplikasi Meituan iOS, auto-like tweet, hingga pemeriksaan spesifikasi Xiaomi SU7 di aplikasi DCar Android atau memesan hotel untuk Natal. Bahkan, Midscene dapat digunakan untuk pengujian dalam kendaraan dengan lengan robot, visi, dan suara.
Berikut adalah contoh bagaimana Anda dapat berinteraksi dengan Midscene menggunakan SDK JavaScript:
jsx// Contoh sederhana dengan Midscene JavaScript SDK import { Midscene } from 'midscene'; async function testWebsite() { const midscene = new Midscene(); await midscene.goto('https://github.com/join'); await midscene.aiAct('Fill in username field with "johndoe"'); await midscene.aiAct('Fill in email field with "johndoe@example.com"'); await midscene.aiAct('Click the "Sign up for GitHub" button'); await midscene.aiAssert('Verify "Choose a strong password" text is visible'); await midscene.close(); } testWebsite();
Ditenagai Model Multimodal
Inti dari Midscene adalah penggunaan visi murni untuk tindakan UI. Lokalisasi elemen sepenuhnya didasarkan pada tangkapan layar. Teknologi ini berjalan di atas model multimodal dengan kemampuan lokalisasi UI yang kuat, seperti Qwen3.x, Doubao-Seed-2.1, GLM-4.6V, gemini-3.5-flash, dan UI-TARS. Tersedia juga pilihan model sumber terbuka yang dapat Anda self-host. Meskipun berbasis visi, Anda masih bisa memilih untuk menyertakan DOM saat diperlukan untuk ekstraksi data dan pemahaman halaman.
Memulai dengan Midscene
Untuk memulai perjalanan Anda dengan Midscene, tersedia berbagai jalur:
- Menulis script pertama Anda: Panduan cepat tersedia di dokumentasi resmi.
- Tanpa kode: Coba Midscene di halaman web apa pun menggunakan ekstensi Chrome.
- Platform lain: Ada panduan terpisah untuk Android, iOS, HarmonyOS, dan desktop.
Midscene dapat ditambahkan ke suite Playwright atau Vitest Anda, atau biarkan agen AI menguji secara otonom melalui Skills.
Komunitas dan Ekosistem
Midscene memiliki komunitas yang aktif dan terus berkembang. Anda bisa bergabung di Discord atau mengikuti akun X mereka untuk informasi terbaru. Ada juga beberapa proyek komunitas yang memperluas kemampuan Midscene.js, seperti midscene-ios untuk dukungan otomasi cermin iOS, midscene-pc untuk operasi PC di Windows, macOS, dan Linux, serta SDK dalam bahasa lain seperti Midscene-Python dan midscene-java.
Midscene mendapatkan dukungan dari berbagai proyek dan tim, termasuk Rsbuild, Rslib, UI-TARS, Qwen-VL, scrcpy, yume-chan, appium-adb, appium-webdriveragent, YADB, libnut-core, Puppeteer, dan Playwright. Ini menunjukkan kolaborasi yang kuat dalam membangun alat yang canggih ini.
Midscene.js berlisensi MIT. Jika proyek ini memberikan manfaat atau inspirasi, memberikan bintang di repositori GitHub mereka adalah bentuk apresiasi.