モデル駆動型アプリ用 JavaScript コードのデバッグ

各ブラウザーは特定の種類のデバッグ拡張機能を提供します。 Microsoft Edge は、モデル駆動型アプリのスクリプトをデバッグするために使用できる F12 開発者ツールを提供します。 Microsoft Edge を使用してページを表示する際に F12 を押すと、F12 開発ツールを開くことができます。 詳細については、F12 開発者ツール ガイド を参照してください。

Google Chrome の場合は、F12 を押して開発者ツールを開きます。 FireBug は、Mozilla Firefox を使用する Web 開発の一般的なブラウザー拡張機能です。 Apple Safari では、最初に 高度な設定 の 開発を表示 メニューを選択する必要があります。 次に 開発 メニューから Web 検査の表示 を選択できます。

モデル駆動型アプリで JavaScript ライブラリを使用するとき、ライブラリは Web ページでロードされます。 デバッグ環境では、自分の特定なライブラリを分離することが困難な場合があります。 Microsoft Edge でデバッグ ツールを使用している場合、 デバッガー タブで、左上隅のフォルダアイコンをクリックし、使用可能なスクリプトを展開して、以下に示す new_myCustomJavaScript.js Webリソースなど、JavaScript Webリソースの名前に対応する名前のスクリプトを探します。 検索ボックスにファイル名を入力することにより、JavaScript ライブラリも検索できます。

さまざまなブラウザーのデバッグ ツールは、同様の機能を備えています。 ライブラリを見つけたら、ブレーク ポイントを設定し、コードが実行する原因となるイベントを再作成します。

また、JavaScript コードのデバッグの詳細については、当チーム ブログ サイトのブログ投稿、ブログ: ブラウザの開発者ツールを使用して CRM でカスタム JavaScript コードをデバッグする を参照してください。

コードをデバッグするために適したフレームを選択する

モデル駆動型アプリのフォームは複数のフレームで構成されます。 ブラウザー開発者ツールの コンソール で動作するコードの場合、適切なフレームを選択する必要があります。

• Web クライアント フォームでは、ClientApiWrapper という名前のフレームを選択します。
• 新しい統一インターフェイス フォームでは、ClientApiFrame_[n] という名前のフレームを選択する必要があります。ここで n は内部ページ ID です。 [n] の最も大きい値のフレームを選択する必要があります。

コンソールにメッセージを作成する

JavaScript のデバッグ時に window.alert メソッドを使用することは、アプリケーション内のコードをトラブルシューティングするための一般的な方法です。 最近のすべてのブラウザーでは、デバッグ ツールへ簡単にアクセスできますが、デバッグしているアプリケーションを他の人が使用している場合、ベスト プラクティスではありません。

代わりにコンソールにメッセージを記述することを検討してください。 次に、ライブラリに追加できる小さな関数を示します。それにより、コンソールを開いたときに表示するメッセージを送信するために使用できます。

function writeToConsole(message)
{
 if (typeof console != 'undefined') {
  console.log(message);
 }
}

alert メソッドとは異なり、この関数を使用するコードを削除することを忘れた場合は、アプリケーションを使用するユーザーにはメッセージが表示されません。

注意

ドキュメントの言語設定についてお聞かせください。 簡単な調査を行います。 (この調査は英語です)

この調査には約 7 分かかります。 個人データは収集されません (プライバシー ステートメント)。