[Microsoft Teams 用開発ツール] タブ

Teams がブラウザーで実行されている場合、ブラウザーの開発ツールに簡単にアクセスできます。 Windows で Dev Tools にアクセスするには、F12 キーを押し、macOS で Command-Option-I キーを押します。 Dev Tools を使用すると、以下にアクセスできます。

  • コンソール ログを表示します。
  • 実行時に HTML、CSS、およびネットワーク要求を表示または変更します。
  • JavaScript コードにブレークポイントを追加し、対話型デバッグを実行します。

注:

Dev Tools は、デスクトップと Android クライアントでのみ使用できます。 Dev Tools にアクセスするには、 パブリック プレビューを有効にする必要があります。

デスクトップで開発ツールにアクセスする

Teams の Web バージョンとデスクトップ バージョンはほぼ同じですが、認証にはいくつかの違いがあります。 何が起こっているかを把握する唯一の方法は、開発ツールを使用することである場合があります。 デスクトップ クライアントで開発ツールを使用するには、次の手順に従います。

  1. パブリック プレビューを有効にします。 [開発ツール] オプションを表示するには、Teams を再起動する必要があります。

  2. タブを開き、Dev Tools で検査します。

  3. 次のいずれかの方法で開発ツールを開きます。

    • Windows の場合: デスクトップ トレイを開き、右クリックして Microsoft Teams アイコンを選択します。 [ 開発ツールを開く] を選択します。

      スクリーンショットは、Windows デスクトップから開発ツールを開くオプションを示しています。

    • macOS の場合: [開発ツールを開く] を選択します。

      macOS ドックから開発ツールを開くオプションを示すスクリーンショット。

    次の例は DevTools を示しています 。 スクリーンショットは、タブと DevTools を示しています。

Teams Android クライアントから DevTools にアクセスする

Teams Android クライアントで DevTools を有効にできます。 DevTools を有効にするには、次の手順に従います。

  1. Android 用 DevTools は、ベータ版の Teams アプリでのみ使用できます。 Teams アプリのベータ版に参加するには、「アプリのベータ版を入手する」に記載されている手順に従います。

    スクリーンショットは、ベータに参加するオプションを示しています。

  2. パブリック プレビューを有効にします。 [開発ツール] オプションを表示するには、Teams を再起動する必要があります。

  3. デバイスをデスクトップ コンピューターに接続し、Teams Android クライアントを リモート デバッグ用にセットアップします。

  4. Chrome ブラウザーで、chrome://inspect/#devices を開きます。

  5. 次の図のように、デバッグするタブで検査を選択します。

    スクリーンショットは、Android DevTools を示しています。

Teams iOS クライアント用の DevTools にアクセスする

Teams iOS クライアントで DevTools にアクセスできます。 これには、必要な前提条件を満たし、それをアクティブ化するための手順に従うことが含まれます。

前提条件

Teams iOS クライアントの DevTools にアクセスするには、次の要件を満たしていることを確認してください。

  • Safari を搭載した Mac システム。
  • Teams iOS バージョン 6.10.0 以降。 iOS 用 Microsoft Teams は AppStore からダウンロードできます。

Teams iOS クライアント用に DevTools をアクティブ化する

DevTools をアクティブ化するには:

  1. ユーザーまたはテナントがターゲット リリースに対してアクティブ化されているかどうかを確認します。 有効でない場合は、有効にする必要があります。

    詳細については、Targeted release for entire organization を参照してください。

    重要

    ユーザーまたはテナントでターゲット指定リリースを有効にした後、設定が有効になるまで 24 時間待ちます。 この期間が過ぎたら、サインアウトしてから Teams iOS クライアントに再度サインインして、ライセンス認証を確認してください。

  2. Teams iOS アプリにサインインし、開発者プレビューを有効にします。 開発者プレビューの詳細については、「 Teams の開発者向けパブリック プレビュー」を参照してください。

  3. Mac システムと iOS クライアント用の Web インスペクターを有効にします。 詳細については、「 Web インスペクタを有効にする」を参照してください。

  4. Teams iOS クライアントを Mac システムに接続します。 メッセージが表示されたら、クライアントを信頼していることを確認し、接続を許可することに同意します。

    iOS クライアントは、Mac システムの Safari の [開発 ] オプションの下に一覧表示されます。

  5. Mac システムの Safari の [開発 ] メニューから、iOS クライアントの [開発に使用する...] を選択します。 これは、初めて Safari を使用して iOS クライアントの DevTools にアクセスするときに構成する 1 回限りの設定です。

    スクリーンショットには、接続された Teams iOS クライアントで使用されているアプリの開発または検査に Safari を使用するためのリンクが表示されます。

  6. 接続された Teams iOS クライアントで Teams を開き、Teams 内でアプリを開きます。

  7. [ 開発] メニューで接続されている iOS クライアントを選択して、アプリの検査リンクを表示します。

    スクリーンショットには、アプリケーションのアプリ検査リンクが表示されます。

  8. リンクを選択して、アプリの Safari Web インスペクターを開きます。

    スクリーンショットは、Safari の Web インスペクターを示しています。

    Teams iOS クライアントに DevTools を利用できるようになりました。

関連項目