自動i18nテストのための疑似ローカリゼーション
疑似ローカリゼーションは、実際の翻訳が始まる前に国際化（i18n）の問題を特定するために、ソーステキストを偽の言語に変換する強力なテスト手法です。このガイドでは、pseudo-l10n npmパッケージを使用して疑似ローカリゼーションテストを自動化する方法を紹介します。
疑似ローカリゼーションとは？
疑似ローカリゼーションは、アプリケーションのソーステキストを、翻訳後のUIの動作を模倣する変更された偽の言語に変換するプロセスです。QAエンジニアや開発者が開発サイクルの早い段階でi18nの問題を特定するのに役立ちます。
潜在的な国際化の問題を特定するために疑似ローカリゼーションを使用した例。フォントとサイズは両側で同じですが、他のスクリプトをサポートするにはより多くのスペースが必要になることがよくあります。
疑似ローカリゼーションが有用な理由
疑似ローカリゼーションは、i18nの問題を早期に発見するのに役立ちます：
- テキストの拡張によって引き起こされるレイアウトの崩れを露呈させます（ドイツ語やフィンランド語は通常、英語より30〜40％長くなります）。
- UTF-8サポートをテストするためにアクセント付き文字を追加することで、エンコーディングの問題を表面化させます。
- すべての文字列が翻訳可能であることを保証します - ハードコードされたテキストは変更されず、見つけやすくなります。
- プレースホルダーの誤った処理を明らかにします - {{name}}のような動的コンテンツは保持されなければなりません。
- スペースに制約のあるUIコンポーネントの翻訳の長さ制限を定義するのに役立ちます。
QAのための自動化戦略
疑似ローカリゼーションを使用してi18nテストを自動化するための実証済みの戦略を以下に示します：
ラテン文字をアクセント付きの形式や異なるスクリプトに置き換えて、文字エンコーディングとフォントサポートをテストします。
例： "Save" → "Šàvē"
QAチェック： すべての文字が正しく表示され、エンコーディングの問題によって何も壊れないことを確認します。
ドイツ語やフィンランド語のような長い言語を模倣するために、各文字列を自動的に約30〜40％拡張します。クリッピング（切り捨て）を簡単に検出できるように視覚的なマーカーでラップします。
例： "Save" → ⟦Šàvēēēēē⟧
QAチェック： 自動スクリーンショット比較を使用して、UIのオーバーフロー、クリッピング、または不整合を見つけます。
補間変数（プレースホルダー）を可視マーカーに置き換えて、翻訳中にそれらが保持されていることを確認します。
例： "You have {{count}} items" → "You have <COUNT> items"
QAチェック： 回帰テストを実行します。マーカーが欠落しているか、誤ってエスケープされている（<COUNT>）場合は失敗させます。
アラビア語やヘブライ語をシミュレートするために、Unicode制御文字を使用してテキストを右から左（RTL）マーカーでラップします。
QAチェック： RTL言語の配置、テキストの方向、およびミラーリングが正しいことを確認します。
自動テストパイプラインに疑似ローカリゼーションを追加して、本番環境に到達する前にi18nの問題をキャッチします。
QAチェック： テストで翻訳の欠落、壊れたプレースホルダー、またはレイアウトの問題が検出された場合は、デプロイをブロックします。
pseudo-l10nパッケージによる自動化
pseudo-l10n npmパッケージは、JSON翻訳ファイルの疑似ローカリゼーションを自動化し、開発ワークフローへのi18nテストの統合を容易にします。
- テキスト拡張：翻訳されたテキストが英語より30〜40％長くなることが多い状況をシミュレートします。
- アクセント付き文字：アクセント付きの同等文字を使用してUTF-8エンコーディングとフォントサポートをテストします。
- 視覚的マーカー：未翻訳または切り捨てられたテキストを簡単に見つけられるように、文字列を⟦...⟧マーカーでラップします。
- プレースホルダーの処理：{{name}}、{count}、%key%などのプレースホルダーを保持します。
- RTLシミュレーション：Unicode制御文字を使用して右から左へ読む言語をシミュレートします。
コマンドラインで使用するためにpseudo-l10nをグローバルにインストールします：
npm install -g pseudo-l10nまたは、開発依存関係として追加します：
npm install --save-dev pseudo-l10n
ソース翻訳ファイルを疑似ローカライズされたバージョンに変換します：
pseudo-l10n input.json output.json
入力 (en.json):
{
"welcome": "Welcome to our application",
"greeting": "Hello, {{name}}!",
"itemCount": "You have {{count}} items"
}出力 (pseudo-en.json):
{
"welcome": "⟦Ŵëļçõɱë ţõ õür àƥƥļïçàţïõñēēēēēēēēēēēēēēēēēē⟧",
"greeting": "⟦Ĥëļļõēēēēēē, {{name}}!ēēēēē⟧",
"itemCount": "⟦Ŷõü ĥàṽë {{count}} ïţëɱšēēēēēēēēēēēēēēēē⟧"
}
カスタム拡張
pseudo-l10n en.json pseudo-en.json --expansion=30RTLシミュレーション
アラビア語やヘブライ語のような右から左へ読む言語をシミュレートします：
pseudo-l10n en.json pseudo-ar.json --rtl視覚テストのためのプレースホルダーの置換
視覚的な検出を容易にするために、プレースホルダーを大文字のマーカーに置き換えます：
pseudo-l10n en.json pseudo-en.json --replace-placeholders
# Input: { "greeting": "Hello, {{name}}!" }
# Output: { "greeting": "⟦Ĥëļļõēēēēēē, <NAME>!ēēēēē⟧" }異なるプレースホルダー形式のサポート
このパッケージは、さまざまな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%"
Node.jsスクリプトやビルドプロセスでpseudo-l10nをプログラム的に使用します：
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}}!ēēēēē⟧ワークフローへの統合
package.jsonスクリプトに疑似ローカリゼーション生成を追加します：
{
"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"
}
}
ビルドプロセスの一部として疑似ロケールを生成します：
// 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 }
);
疑似ローカリゼーションを継続的インテグレーションパイプラインに統合します：
# .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テスト戦略
- ビルドプロセス中に疑似ロケールを生成します。
- アプリケーションに疑似ロケールを追加します（例：言語セレクター内）。
- 疑似ロケールを有効にしてアプリケーションをテストします。
- アプリケーションで一般的なi18nの問題を確認します。
- ⟦⟧マーカーがない = 未翻訳の文字列（ハードコードされたテキスト）。
- マーカーが切れている = テキストの切り捨てまたはUIのオーバーフロー。
- レイアウトの崩れ = テキスト拡張のためのスペース不足。
- 文字化け = エンコーディングの問題またはフォントサポートの欠如。
- テキストの方向が間違っている = RTLの問題（RTL疑似ロケールの場合）。
テストから実際の翻訳へ
疑似ローカリゼーションでi18nの実装を検証したら、実際のユーザー向けにアプリケーションを翻訳する時です。ここでl10n.devのようなAI対応翻訳サービスの出番です。
疑似ローカリゼーションでアプリが国際化を正しく処理することを確認した後、プロフェッショナルなAI対応翻訳のためにl10n.devを使用してください：
- プレースホルダー、フォーマット、構造を保持します - まさに疑似ローカリゼーションがテスト中に保護するのと同じです。
- コンテキストを認識するAI翻訳で165言語をサポートします。
- 複数形の形式、補間、特殊文字を自動的に処理します。
- 自動化ワークフローのために、APIまたはnpmパッケージ（ai-l10n）を介したCI/CDパイプライン統合を提供します。
- 手動翻訳およびレビュー用のVS Code拡張機能とWeb UIを提供します。
- 疑似ローカリゼーションを使用してi18n実装をテストし、問題を早期に発見します。
- テスト中に発見されたレイアウト、エンコーディング、またはプレースホルダーの問題を修正します。
- l10n.devを使用して検証済みのソースファイルを翻訳し、本番環境に対応した翻訳を作成します。
i18nの問題を早期に発見し、ローカリゼーションワークフローを効率化する準備はできていますか？
疑似ローカリゼーションは、本番環境に到達する前に国際化の問題を発見するのに役立つ不可欠なテスト手法です。pseudo-l10nパッケージで疑似ローカリゼーションテストを自動化することで、アプリケーションが真にグローバルなオーディエンスに対応していることを保証できます。
l10n.devのAI対応ローカリゼーションと組み合わせることで、堅牢な多言語アプリケーションをより迅速かつ確実に構築できます。