Stripe.js テストモードアシスタント

Elements 導入のテストとデバッグは、ブラウザを使用して Web サイト上で直接実行できます。

Stripe.js テスト環境アシスタントを使用して導入を設定できます。

テスト環境アシスタントがページの右下に表示されます。

テスト環境アシスタントは、テスト環境で Elements が読み込まれた Web サイト上のどのページにも表示され、本番環境では表示されません。テスト環境アシスタントには、以下を可能にするツールが用意されています。

テスト環境アシスタントは、導入に含まれる決済手段のプリセットを自動的に表示します。これらのプリセットを使用して、さまざまな決済シナリオの Payment Element を自動入力できます。

決済手段のプリセットを使用して Elements を自動入力します。

たとえば、Magic Fill を選択すると、ページに存在するすべての Elements を同時に自動入力できます。

テスト環境アシスタントでは、導入エラーと警告が強調表示され、ベストプラクティスに従うのに役立ちます。また、動的な決済手段をまだ使用していない場合は使用するなど、導入の効果管理に役立つ最適化技術も提案されます。

導入エラーと警告の表示

テスト環境アシスタントは、顧客の所在地をシミュレーションして、世界中の顧客に表示される決済手段を表示します。

顧客の所在地をシミュレーションして、さまざまな国での導入を確認

Currency Selector Element を使用する場合は、顧客の所在地をシミュレーションして、顧客が選択した通貨に基づく決済手段を表示することもできます。

デフォルトでは、Stripe は、Elements と Checkout Sessions API を使用する導入、または Elements と Payment Intents API を使用する導入 (Clover バージョン以降) のテスト環境アシスタントを自動的に有効にします。

テスト環境アシスタントを非表示にするには、Elements の設定時に developerTools.assistant.enabled オプションを false に設定します。

index.js
const stripe = new Stripe(publicKey, {
  developerTools: {
    assistant: {
      enabled: false,
    },
  },
});