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 yang 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 dimodifikasi yang meniru bagaimana UI berperilaku setelah terjemahan. Ini membantu insinyur QA dan pengembang mengidentifikasi masalah i18n lebih awal dalam siklus pengembangan.

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

Mengapa Pseudo-lokalisasi Berguna

Pseudo-lokalisasi membantu Anda menangkap masalah i18n lebih awal:

• Mengungkap kerusakan tata letak yang disebabkan oleh perluasan teks (Jerman dan Finlandia biasanya 30-40% lebih panjang daripada bahasa Inggris).
• Mengungkap masalah pengkodean dengan menambahkan karakter aksen untuk menguji dukungan UTF-8.
• Memastikan semua string dapat diterjemahkan - teks yang dikodekan keras tetap tidak berubah dan mudah dikenali.
• Mengungkap penanganan placeholder yang salah - konten dinamis seperti {{name}} harus dilestarikan.
• Membantu mendefinisikan 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 Aksen & Non-Latin

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

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

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

Simulasi Perluasan Teks

Secara otomatis perluas setiap string sekitar 30–40% untuk meniru bahasa panjang seperti Jerman atau Finlandia. Bungkus dengan penanda visual untuk deteksi pemotongan yang mudah.

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

Pemeriksaan QA: Gunakan perbandingan tangkapan layar otomatis untuk menemukan overflow UI, pemotongan, atau ketidakselarasan.

Pengujian Stres Placeholder

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

Contoh: "Anda memiliki {{count}} item" → "Anda memiliki <COUNT> item"

Pemeriksaan QA: Jalankan pengujian regresi; gagal jika penanda hilang atau tidak terhindarkan (&lt;COUNT&gt;).

Simulasi RTL

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

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

Integrasi CI/CD

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

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

Mengotomatiskan 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

• Perluasan Teks: Mensimulasikan bagaimana teks terjemahan sering kali 30-40% lebih panjang daripada bahasa Inggris.
• Karakter Aksen: Menguji pengkodean UTF-8 dan dukungan font dengan ekuivalen aksen.
• Penanda Visual: Membungkus string dengan penanda ⟦...⟧ untuk dengan mudah menemukan teks yang belum diterjemahkan atau terpotong.
• Penanganan Placeholder: Mempertahankan placeholder seperti {{name}}, {count}, %key%, dll.
• Simulasi RTL: Mensimulasikan bahasa dari 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 dari kanan ke kiri seperti 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 Berbagai Format Placeholder

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

# 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-lokal 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-locale 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-lokal 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-locale selama proses build Anda.
2. Tambahkan pseudo-locale ke aplikasi Anda (misalnya, di pemilih bahasa).
3. Uji aplikasi Anda dengan pseudo-locale diaktifkan.
4. Tinjau aplikasi untuk masalah i18n yang umum.

Apa yang Harus Dicari

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

Dari Pengujian ke Terjemahan Nyata

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

Mengapa l10n.dev untuk Terjemahan Produksi

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

• Mempertahankan placeholder, format, dan struktur - sama 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 tinjauan manual.

Alur Kerja i18n Lengkap

1. Uji implementasi i18n Anda dengan pseudo-l10n untuk menangkap masalah lebih awal.
2. Perbaiki masalah tata letak, pengkodean, atau placeholder yang ditemukan selama pengujian.
3. Terjemahkan file sumber yang telah divalidasi menggunakan l10n.dev untuk terjemahan siap produksi.

Siap untuk menangkap masalah i18n lebih awal dan memperlancar alur kerja lokalisasi Anda?