Pseudo-lokalisasi untuk Pengujian i18n Otomatis

Pseudo-lokalisasi adalah teknik pengujian yang kuat yang mengubah teks sumber Anda menjadi bahasa palsu untuk mengidentifikasi masalah internasionalisasi (i18n) sebelum terjemahan sebenarnya dimulai. Panduan ini menunjukkan cara mengotomatiskan pengujian pseudo-lokalisasi menggunakan paket npm pseudo-l10n.

Apa itu Pseudo-lokalisasi?

Pseudo-lokalisasi adalah proses mengubah teks sumber aplikasi Anda menjadi bahasa palsu yang diubah yang meniru bagaimana UI berperilaku setelah terjemahan. Ini membantu insinyur QA dan pengembang mengidentifikasi masalah i18n sejak awal dalam siklus pengembangan.

Contoh penggunaan pseudo-lokalisasi untuk mengidentifikasi potensi masalah internasionalisasi. Font dan ukuran identik di kedua sisi, tetapi mendukung skrip lain sering kali membutuhkan lebih banyak ruang.

Mengapa Pseudo-lokalisasi Berguna

Pseudo-lokalisasi membantu Anda menangkap masalah i18n sejak dini:

• Mengekspos kerusakan tata letak yang disebabkan oleh ekspansi teks (bahasa Jerman dan Finlandia biasanya 30-40% lebih panjang daripada bahasa Inggris).
• Memunculkan masalah pengkodean dengan menambahkan karakter beraksen untuk menguji dukungan UTF-8.
• Memastikan semua string dapat diterjemahkan - teks yang dikodekan secara keras tetap tidak berubah dan mudah dikenali.
• Mengungkap penanganan placeholder yang salah - konten dinamis seperti {{name}} harus dipertahankan.
• Membantu menentukan batas panjang terjemahan untuk komponen UI dengan batasan ruang.

Strategi Otomatisasi untuk QA

Berikut adalah strategi yang terbukti untuk mengotomatiskan pengujian i18n dengan pseudo-lokalisasi:

Karakter Beraksen & Non-Latin

Ganti huruf Latin dengan bentuk beraksen atau skrip yang berbeda untuk menguji pengkodean karakter dan dukungan font.

Contoh: "Save" → "Šàvē"

Pemeriksaan QA: Pastikan semua karakter ditampilkan dengan benar dan tidak ada yang rusak karena masalah pengkodean.

Simulasi Ekspansi Teks

Perluas setiap string secara otomatis sebesar ~30–40% untuk meniru bahasa panjang seperti bahasa Jerman atau Finlandia. Bungkus dengan penanda visual untuk deteksi pemotongan yang mudah.

Contoh: "Save" → ⟦Šàvēēēēē⟧

Pemeriksaan QA: Gunakan perbandingan tangkapan layar otomatis untuk menemukan luapan UI, pemotongan, atau ketidaksejajaran.

Pengujian Stres Placeholder

Ganti variabel interpolasi (placeholder) dengan penanda yang terlihat untuk memverifikasi bahwa variabel tersebut dipertahankan selama terjemahan.

Contoh: "You have {{count}} items" → "You have <COUNT> items"

Pemeriksaan QA: Jalankan pengujian regresi; gagal jika penanda hilang atau salah di-escape (&lt;COUNT&gt;).

Simulasi RTL

Bungkus teks dalam penanda kanan-ke-kiri (RTL) menggunakan karakter kontrol Unicode untuk mensimulasikan bahasa Arab atau Ibrani.

Pemeriksaan QA: Verifikasi perataan, arah teks, dan pencerminan sudah benar untuk bahasa RTL.

Integrasi CI/CD

Tambahkan pseudo-lokalisasi ke alur pengujian otomatis Anda untuk menangkap masalah i18n sebelum mencapai produksi.

Pemeriksaan QA: Blokir penyebaran jika pengujian mendeteksi terjemahan yang hilang, placeholder yang rusak, atau masalah tata letak.

Otomatisasi dengan Paket pseudo-l10n

Paket npm pseudo-l10n mengotomatiskan pseudo-lokalisasi untuk file terjemahan JSON Anda, membuatnya mudah untuk mengintegrasikan pengujian i18n ke dalam alur kerja pengembangan Anda.

Fitur Utama

• Ekspansi Teks: Mensimulasikan bagaimana teks yang diterjemahkan sering kali 30-40% lebih panjang daripada bahasa Inggris.
• Karakter Beraksen: Menguji pengkodean UTF-8 dan dukungan font dengan padanan beraksen.
• Penanda Visual: Membungkus string dengan penanda ⟦...⟧ agar mudah menemukan teks yang tidak diterjemahkan atau terpotong.
• Penanganan Placeholder: Mempertahankan placeholder seperti {{name}}, {count}, %key%, dll.
• Simulasi RTL: Mensimulasikan bahasa Kanan-ke-Kiri menggunakan karakter kontrol Unicode.

Instalasi

Instal pseudo-l10n secara global untuk penggunaan baris perintah:

npm install -g pseudo-l10n

Atau tambahkan sebagai dependensi pengembangan:

npm install --save-dev pseudo-l10n

Penggunaan Dasar

Ubah file terjemahan sumber Anda menjadi versi pseudo-lokal:

pseudo-l10n input.json output.json

Contoh Transformasi

Input (en.json):

{
  "welcome": "Welcome to our application",
  "greeting": "Hello, {{name}}!",
  "itemCount": "You have {{count}} items"
}

Output (pseudo-en.json):

{
  "welcome": "⟦Ŵëļçõɱë ţõ õür àƥƥļïçàţïõñēēēēēēēēēēēēēēēēēē⟧",
  "greeting": "⟦Ĥëļļõēēēēēē, {{name}}!ēēēēē⟧",
  "itemCount": "⟦Ŷõü ĥàṽë {{count}} ïţëɱšēēēēēēēēēēēēēēēē⟧"
}

Fitur Lanjutan

Ekspansi Kustom

pseudo-l10n en.json pseudo-en.json --expansion=30

Simulasi RTL

Mensimulasikan bahasa kanan-ke-kiri seperti bahasa Arab atau Ibrani:

pseudo-l10n en.json pseudo-ar.json --rtl

Ganti Placeholder untuk Pengujian Visual

Ganti placeholder dengan penanda huruf besar untuk deteksi visual yang lebih mudah:

pseudo-l10n en.json pseudo-en.json --replace-placeholders

# Input:  { "greeting": "Hello, {{name}}!" }
# Output: { "greeting": "⟦Ĥëļļõēēēēēē, <NAME>!ēēēēē⟧" }

Dukungan untuk Format Placeholder yang Berbeda

Paket ini mendukung berbagai format placeholder yang digunakan oleh pustaka i18n yang berbeda:

# For i18next (default)
pseudo-l10n en.json pseudo-en.json --placeholder-format="{{key}}"

# For Angular/React Intl
pseudo-l10n en.json pseudo-en.json --placeholder-format="{key}"

# For sprintf style
pseudo-l10n en.json pseudo-en.json --placeholder-format="%key%"

Penggunaan Programatik

Gunakan pseudo-l10n secara programatik dalam skrip Node.js atau proses build Anda:

const { generatePseudoLocaleSync, pseudoLocalize } = require('pseudo-l10n');

// Generate a pseudo-localized JSON file
generatePseudoLocaleSync('en.json', 'pseudo-en.json', {
  expansion: 40,
  rtl: false
});

// Pseudo-localize a single string
const result = pseudoLocalize('Hello, {{name}}!');
console.log(result);
// Output: ⟦Ĥëļļõēēēēēēēēēēēēēē, {{name}}!ēēēēē⟧

Integrasi ke dalam Alur Kerja Anda

Skrip npm

Tambahkan pembuatan pseudo-lokalisasi ke skrip package.json Anda:

{
  "scripts": {
    "pseudo": "pseudo-l10n src/locales/en.json src/locales/pseudo-en.json",
    "pseudo:rtl": "pseudo-l10n src/locales/en.json src/locales/pseudo-ar.json --rtl"
  }
}

Integrasi Proses Build

Hasilkan pseudo-lokal sebagai bagian dari proses build Anda:

// build.js
const { generatePseudoLocaleSync } = require('pseudo-l10n');

// Generate pseudo-locales as part of build
generatePseudoLocaleSync(
  './src/locales/en.json',
  './src/locales/pseudo-en.json',
  { expansion: 40 }
);

generatePseudoLocaleSync(
  './src/locales/en.json',
  './src/locales/pseudo-ar.json',
  { rtl: true }
);

Integrasi Pipeline CI/CD

Integrasikan pseudo-lokalisasi ke dalam pipeline integrasi berkelanjutan Anda:

# .github/workflows/test.yml
- name: Generate pseudo-locales
  run: |
    npm install -g pseudo-l10n
    pseudo-l10n src/locales/en.json src/locales/pseudo-en.json

- name: Run i18n tests
  run: npm run test:i18n

Strategi Pengujian

1. Hasilkan pseudo-lokal selama proses build Anda.
2. Tambahkan pseudo-lokal ke aplikasi Anda (misalnya, di pemilih bahasa).
3. Uji aplikasi Anda dengan pseudo-lokal diaktifkan.
4. Tinjau aplikasi untuk masalah i18n umum.

Apa yang Harus Dicari

• Penanda ⟦⟧ yang hilang = string yang tidak diterjemahkan (teks yang dikodekan secara keras).
• Penanda yang terpotong = pemotongan teks atau luapan UI.
• Tata letak rusak = ruang yang tidak mencukupi untuk ekspansi teks.
• Teks kacau = masalah pengkodean atau dukungan font yang hilang.
• Arah teks salah = masalah RTL (untuk pseudo-lokal RTL).

Dari Pengujian ke Terjemahan Nyata

Setelah Anda memvalidasi implementasi i18n Anda dengan pseudo-lokalisasi, saatnya untuk menerjemahkan aplikasi Anda bagi pengguna nyata. Di sinilah layanan terjemahan berbasis AI seperti l10n.dev berperan.

Mengapa l10n.dev untuk Terjemahan Produksi

Setelah memastikan aplikasi Anda menangani internasionalisasi dengan benar dengan pseudo-lokalisasi, gunakan l10n.dev untuk terjemahan berbasis AI profesional:

• Mempertahankan placeholder, format, dan struktur - persis seperti pseudo-l10n melindungi selama pengujian.
• Mendukung 165 bahasa dengan terjemahan AI yang sadar konteks.
• Menangani bentuk jamak, interpolasi, dan karakter khusus secara otomatis.
• Menyediakan integrasi CI/CD melalui API atau paket npm (ai-l10n) untuk alur kerja otomatis.
• Menawarkan ekstensi VS Code dan UI web untuk terjemahan dan peninjauan manual.

Alur Kerja i18n Lengkap

1. Uji implementasi i18n Anda dengan pseudo-l10n untuk mendeteksi masalah sejak dini.
2. Perbaiki masalah tata letak, pengodean, atau placeholder apa pun yang ditemukan selama pengujian.
3. Terjemahkan file sumber Anda yang telah divalidasi menggunakan l10n.dev untuk terjemahan yang siap produksi.

Siap untuk mendeteksi masalah i18n sejak dini dan menyederhanakan alur kerja lokalisasi Anda?