Agentforce を使用してアプリケーションを修正する

メモ

日本語で受講されている方へ
Challenge は日本語の Trailhead Playground で開始し、かっこ内の翻訳を参照しながら進めていってください。Challenge での評価は英語データを対象に行われるため、英語の値のみをコピーして貼り付けるようにしてください。日本語の組織で Challenge が不合格だった場合は、(1) この手順に従って [Locale (地域)] を [United States (米国)] に切り替え、(2) [Language (言語)] を [English (英語)] に切り替えてから、(3) [Check Challenge (Challenge を確認)] ボタンをクリックしてみることをお勧めします。

翻訳版 Trailhead を活用する方法の詳細は、自分の言語の Trailhead バッジを参照してください。

Agentforce Adventure Tools (Agentforce アドベンチャーツール) アプリケーション

この特別な Playground には、テーブルトップ RPG (ロールプレイングゲーム) キャンペーン用の Quick Dice Roller (クイックダイスローラー) が搭載されている Agentforce Adventure Tools (Agentforce アドベンチャーツール) というカスタムコンパニオンアプリケーションが含まれています。

これは、Playground でダイスローラーを使用できる軽量のサンプルアプリケーションです。このアプリケーションでは、コマンドでダイス (サイコロ) を振り、補正値 (魔法装備や呪文の効果など) を加え、クリティカルをトリガーする栄光のナチュラル 20 を出せるかを試すことができます。

テーブルトップ RPG では、クリティカルは結果が非常に良い (または悪い) ダイスロールのことです。多くの場合、決定的成功のクリティカルヒット、または特にひどい結果の致命的失敗となります。このアプリケーションでは、ダイスで最大の目が出たときのみ、クリティカルヒットとカウントされます。

すべてのロールは「Dice Roll」(ダイスロール) という名前のカスタムオブジェクト (Dice_Roll__c) のアドベンチャーログに追加され、後で自慢できるように、表記法、総計、クリティカルフラグ、結果が保存されます。キャラクターのランダムな運命が記録されたシートのようなものと考えてください。

RPG では、このようなサービスによってダイスのメカニズムが処理されます。ルールの適用によりクエストの公平性が保たれ、すべての冒険のダイスロールを記録することができるようになります。

画面の大きさによっては、すべての結果を表示するためにスクロールダウンすることが必要になる場合があります。

ダイスロールの補正値を設定し、ダイスをロールするユーザーを選択し、一般的なダイス (たとえば、D4 は 4 面のダイス、D6 は 6 面のダイス) をワンタップでロールできます。各ロールの明確な総計、クリティカルのコールアウト、結果の整然とした履歴が示されます。ダイスロールで順番を決め、D20 を投げて、望みどおりにクリティカルが出るよう祈りましょう。

その内部では、シンプルな Apex コントローラーと Lightning Web コンポーネントが組み合わされています。Agentforce からのコード提案やリファクタリングのサポートを確認するのにうってつけです。学習の間は冒険の拠点として使用し、後で各自のキャンペーンに合わせてカスタマイズしてください。

ミッション: いくつかのコードを更新した後で、ほかの開発者が、Quick Dice Roller (クイックダイスローラー) が正常に動作していないことに気づきました。頼りになる Agentforce を使用して、バグを見つけ出し、コードを調整して、ダイスロールのバランスを取り戻す必要があります。

いざ冒険へ!

1. Playground でブラウザータブに戻ります。再びログインを求められたら、ログイン情報を使用してログインします。
   
2. をクリックして、アプリケーションランチャーを開き、[Agentforce Adventure Tools (Agentforce アドベンチャーツール)] を検索して選択します。
   
3. [Quick Dice Roller (クイックダイスローラー)] ページで、任意のダイスロールボタンをクリックします。たとえば、[D20] セクションで、[1 D20] ボタンをクリックします。
   
4. ロールが保存されたことを伝えるトーストメッセージが現れますが、合計が未定義と表示されます。
   

合計が未定義であるだけではなく、各タイルに示されている値の書式も正しくありません。最終的な合計が計算されていないか、適切に表示されていません。

さっそく調査しましょう。潜伏場所のIDE タブに戻ります。

アプリケーションの修正に Agentforce を使用する

まず、Playground に接続されたままであることを確認します。

sf org display や sf org list といったコマンドを実行できますが、 もっと楽しく、簡単に始められるようにするために、Agentforce に尋ねることにします。

1. Agentforce パネルから、スクロールダウンして [Start New Task (新しいタスクを開始)] をクリックします。
   
2. 次のプロンプトを使用して、結果を示すよう Agentforce に要求します: What is the username of the Salesforce Org I'm currently connected to? (現在接続している Salesforce 組織のユーザー名は何ですか?)
   
3. Enter キーを押します。メモ: Agentforce が要求を実行できるように、コマンドの承認を求められたら、承認します。
   

プロンプトを完了するために、いくつかのアクションが実行される場合があります。複数回コマンドを承認することが必要になる場合があります。ボタンのラベルはアクションによって異なる可能性があります。最終的な出力が要求を満たしていれば、その出力が、予想される適切な結果です。

タスクの結果にユーザー名が表示されます。その正しい Playground に接続していない場合、変更してデフォルト組織を開きます。

ヒーローであるソースを表示する

1. Ctrl + Shift + E キー (Windows) または Cmd + Shift + E キー (macOS) を押して、ファイルエクスプローラービューを開きます。
   
2. プロジェクトのルートディレクトリに [manifest] という名前のフォルダーがあり、[package.xml] ファイルが含まれているかどうかを確認します。メモ: プロジェクトのルートフォルダーに [manifest] フォルダーがない場合は追加する必要があります。
   
   • [dx-project] フォルダーが強調表示されていることを確認し、新規フォルダーボタンをクリックします。
     

• 新しいフォルダーに manifest という名前を付けます。
  
• [manifest] フォルダーが選択された状態で、新規ファイルボタンをクリックして package.xml という名前を付けます。
  

3. manifest/package.xml ファイルの内容を次のコードで置き換えます。
   

<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<Package xmlns="http://soap.sforce.com/2006/04/metadata">
   <types>
       <members>DiceRollService</members>
       <members>DiceRollServiceTest</members>
       <name>ApexClass</name>
   </types>
   <types>
       <members>Agentforce_Adventure_Tools</members>
       <name>CustomApplication</name>
   </types>
   <types>
       <members>Dice_Roll__c</members>
       <name>CustomObject</name>
   </types>
   <types>
       <members>Adventure_Tools</members>
       <members>Dice_Roll__c</members>
       <name>CustomTab</name>
   </types>
   <types>
       <members>Agentforce_Adventure_Tools_Landing</members>
       <members>Agentforce_Adventure_Tools_UtilityBar</members>
       <name>FlexiPage</name>
   </types>
   <types>
       <members>diceRoller</members>
       <name>LightningComponentBundle</name>
   </types>
   <version>64.0</version>
</Package>

4. Ctrl + S キー (Windows) または Cmd + S キー (macOS) を押してファイルを保存します。
   

画面に従って、[Start New Task (新しいタスクを開始)] ボタンが使用できない場合は、コマンドパレットから [Developer: Reload Window (開発者: ウィンドウを再読み込み)] を実行し、ステップを再度実行します。

5. Agentforce アイコン を再びクリックしてウィンドウを開きます。
   
6. [Start New Task (新しいタスクを開始)] ボタンをクリックします。
   
7. 次のプロンプトを使用して、組織からソースを取得するよう Agentforce に要求します: Please retrieve the source from my default org based on the manifest file (manifest ファイルに基づいてデフォルト組織からソースを取得してください)
   
8. Enter キーを押します。メモ: コマンドの承認を求められたら、承認してデフォルト組織を使用します。
   
   • または、コマンドパレットから次のコマンドを実行することもできます: SFDX: Retrieve Source in Manifest from Org (SFDX: 組織からマニフェストのソースを取得)
     
9. クラスと LWC ファイルが表示されていることを確認します。
   
   • エクスプローラービューを開きます。
     
   • ルートディレクトリ内の force-app フォルダーを展開します。
     
   • /force-app/main/default/classes という名前のサブフォルダーに DiceRollService クラスが含まれていることを確認します。
     
   • /force-app/main/default/lwc という名前のサブフォルダーに diceRoller という Lightning Web コンポーネントのファイルが含まれていることを確認します。
     

組織からファイルが取得されている場合、準備完了です。

Agentforce は AI で駆動し、強力な味方になれますが、完璧ではありません。時には、正しくないコードやステップを提案することがあります。必ず、出力を慎重に確認し、自分自身で判断を行い、ソリューションをテストしてから使用してください。

Agentforce を使用してコードの書式を整える

Apex コードの書式設定が少しおかしいようです。Agentforce を呼び出して、読みやすさと一貫性が向上するようにコードを適切な書式に整えましょう。

1. Ctrl + P キー (Windows) または Cmd + P キー (macOS) を押して、ファイル検索パレットを開きます。
   
2. DiceRollService.cls と入力し、Enter キーを押して選択します。
   
3. メモ: /force-app/main/default/classes フォルダー内にあるファイルです。
   
4. アクティビティバーにある Agentforce アイコン をクリックします。
   
5. [Start New Task (新しいタスクを開始)] ボタンをクリックします。
   
6. Agentforce にコードの書式を整えるよう要求します。次のプロンプトをコピーして入力ボックスに貼り付けます: Please format the DiceRollService class using prettier-plugin-apex. If the plugin is not installed, install it using npm and then use the npx prettier --write command. (prettier-plugin-apex を使用して DiceRollService クラスの書式を整えてください。プラグインがインストールされていない場合は、npm を使用してインストールしてから npx prettier --write コマンドを使用してください。)
   
7. Enter キーを押します。[Allow (許可)]、[Run Command (コマンドを実行)]、[Proceed While Running (実行中に続行)]、[Yes, proceed (はい、続行します)] のクリックを求められたら、クリックします。数回クリックすることが必要になる場合があります。
   

Agentforce で一時的に警告やエラーが表示されることがあります。これは Agentforce の非決定的な動作の一部で想定内です。タスクに取り組んでいる人間の開発者のように、さまざまな手法を試行した結果、警告やエラーがトリガーされる場合があります。最終的な出力が要求を満たしている限り、問題ありません。

8. Agentforce が提案したコマンドを確認します。Prettier コードフォーマッターの基本ルールが使用されています。詳細は、Salesforce 拡張機能に関するドキュメントを参照してください。
   
9. [Problems (問題)] タブに表示されている問題は無視します。
   
10. すべてが正しいことを再確認し、Ctrl+S キー (Windows) または Cmd+S キー (macOS) を使用してクラスを保存します。
    

Agentforce を使用してバグを修正する

では、バグを修正しましょう。

1. Agentforce ウィンドウで、[Start New Task (新しいタスクを開始)] ボタンをクリックします。
   
2. 次のプロンプトをコピーして、入力ボックスに貼り付けます:
   

The diceRoller LWC is not displaying the total sum of all dice rolls or indicating whether a roll was a critical hit.
Please help me identify and fix the issue. This component uses the DiceRollService Apex class.
I suspect the problem may be related to the visibility of fields in the RollResult inner class. Don't add debug logs, investigate the issue with the variables in the RollResult subclass to make sure they have the appropriate aura annotations for continuation. I'm pretty sure the problem is in those variables, in the Apex class. Not in the LWC. Important: keep the changes inside the RollResult class. Finally, after the changes are accepted, run the command npx prettier --write again to adjust the indentation.

3. Enter/Return キーを押して、Agentforce の応答を確認します。

Agentforce は AI で駆動し、強力な味方になれますが、完璧ではありません。時には、正しくないコードやステップを提案することがあります。必ず、出力を慎重に確認し、自分自身で判断を行い、ソリューションをテストしてから使用してください。

提案が正確ではない場合や、エラーメッセージが表示された場合、または問題が解決されない場合は、応答を却下して Agentforce に再度試すよう要求してみてください。要求の処理に時間がかかりすぎる場合、[Developer: Reload Window (開発者: ウィンドウを再読み込み)] を実行して、再度ステップを実行することもできます。

Agentforce で DiceRollService クラスの変更が試行されます。修正案を含む分割画面が表示される場合があります。

Agentforce が問題を発見して修正し、そのクラスに問題がなければ、変更を受け入れます。[Save (保存)] および [Run Command (コマンドを実行)] のクリックを求められたら、クリックします。ファイルの保存は、Ctrl + S キー (Windows) または Cmd + S キー (macOS) を押して手動で行うこともできます。次は、変更をリリースします。

1. Agentforce ウィンドウでスクロールダウンし、[Start New Task (新しいタスクを開始)] ボタンをクリックします。
   
2. 次のプロンプトを使用して、組織に変更をリリースするよう Agentforce に要求します: Deploy the DiceRollService.cls class to my default org (DiceRollService.cls クラスをデフォルト組織にリリースしてください)
3. コマンドの承認を求められたら、承認します。
   
4. リリースコマンドが失敗した場合は、Agentforce にアクションを再度実行するよう要求するか、手動でコードを修正して、ソースコードのリリースを再度試行します。
   
   • ワークスペースに DiceRollService.cls クラスが開いた状態で SFDX: Deploy This Source to Org (SFDX: 組織にこのソースをリリース) を実行することもできます。
     

修正 (および幸運) をテストする

再びダイスをロールするときがきました! 先ほどと同じように、幸運を試してみます。補正値を追加して、運命をゆだねるダイスの数を選択します。これまでの準備が適切であれば、結果が明確に表示され、総計と、クリティカルヒットであるかどうかが示されます。

良い目が出ますように!

1. Playground に戻り、[Agentforce Adventure Tools (Agentforce アドベンチャーツール)] ページを更新します。
   
2. [Modifier (補正値)] 項目に、正の値か負の値を入力します。
   
3. ダイスをロールするボタンをクリックして結果を確認します。数回繰り返します。
   

ダイスロール後に上記のスクリーンショットのように合計と総計が表示され、ロールが Dice Rolls (ダイスロール) オブジェクトに保存されている場合、タスクは完了です。お疲れさまでした!

ロールのリストビューを参照するには、[Dice Rolls (ダイスロール)] タブに移動し、[All Rolls (すべてのロール)] リストビューを選択すると最近のロールが表示されます。任意のレコードをクリックし、ロールの詳細を表示します。

Agentforce を使用してコード (および知覚ロール) を改善する

Salesforce のベストプラクティスに従い、最新の更新を確認している開発者であれば、@track デコレーターが項目をリアクティブにするために使用されることを知っています。

1. [IDE] タブを開きます。
   
2. Ctrl + P キー (Windows) または Cmd + P キー (macOS) を押して、ファイル検索パレットを開きます。
   
3. diceRoller.js と入力し、Enter キーを押して選択します。
   

/force-app/main/default/lwc/diceRoller/ フォルダーからの diceRoller.js ファイルが開きます。

高知覚判定をロールすると、diceRoller コントローラーの tileResults 変数で不要な @track デコレーターが使用されている可能性があることに気づきました。さっそく調査しましょう。Agentforce に戻ります。

1. Agentforce ウィンドウから、[Start New Task (新しいタスクを開始)] ボタンをクリックします。
   
2. 次のプロンプトをコピーして、入力ボックスに貼り付けます:
   

I think the @track decorator might be unnecessary in the diceRoller.js file. As you know, @track is only needed for objects or arrays when mutating their internal properties directly. In this case, the code reassigns the entire tileResults object using the spread operator (...this.tileResults), so reactivity should still work without @track.
Instead of simply removing the decorator, let’s take a safer approach. What do you think about replacing the @track tileResults variable with a getter and setter?
Rename the internal variable to _tileResults, define a simple get tileResults() that returns the _tileResults, and a simple set tileResults(value) that sets the _tileResults. I think we might also remove the @track import. Please don't change anything else.

3. Enter/Return キーを押します。
   

Agentforce でファイル編集時に複数のパスが試行されるかもしれませんが、まったく問題ありません。やり残しがないことを確認しています。

提案が正確でない場合や問題が解決されない場合は、却下すると再度試行されます。要求の処理に時間がかかりすぎる場合やタスクがキャンセルされない場合は、[Developer: Reload Window (開発者: ウィンドウを再読み込み)] を実行して、もう一度試してください。

4. 適切な結果を得られたら、[Save (保存)] をクリックします。
   
5. 変数の名前が変更されて getter と setter が diceRoller.js ファイルに正常に作成され、Agentforce によってプロンプトで提供された値が使用されていることを確認します。
   
6. Agentforce ウィンドウから、[Start New Task (新しいタスクを開始)] ボタンをクリックします。
   
7. 次のプロンプトを使用して、Agentforce に変更を組織にリリースするよう要求します: Deploy the diceRoller LWC to my default org (diceRoller LWC をデフォルト組織にリリースしてください)
8. コマンドの承認を求められたら、承認します。
   
   • 手動リリースを強制するには、ワークスペースに diceRoller.js ファイルが開いた状態で SFDX: Deploy This Source to Org (SFDX: 組織にこのソースをリリース) を実行します。
     
9. [Agentforce Adventure Tools (Agentforce アドベンチャーツール)] アプリケーションに戻ります。
   
10. [Quick Dice Roller (クイックダイスローラー)] を再テストして、すべてが引き続きスムーズに動作していることを確認します。
    

冒険の旅が終わり、マスタリーの道へ

Agentforce は、バグの調査やコードのリファクタリングを行うときの強力な味方です。開発の課題を解決する際に、ガイダンス、インサイト、確かなサポートを提供してくれます。

クエストの途中で、頼りになる魔法使いを呼び出すようなものです。もちろん、自分で呪文を唱える (手動でコマンドを実行する) 方が速い場合もあるかもしれませんが、Agentforce を使用すると、コツを学んだり隠された知恵を発見したりすることができます。

決断する必要があるのは、用意されているダイスをロールする方法のみです。一緒にチームを組めば組むほど、Agentforce のコード作成能力は高まります。

リソース

• Trailhead モジュール: システム管理者のための Apex の基本
• Salesforce 開発者向けの記事: Change or Open Your Default Org (デフォルト組織の変更または起動)
• Salesforce 開発者向けの記事: Prettier Code Formatter for Apex, Aura, and LWC (Apex、Aura、LWC 向け Prettier コードフォーマッター)
• Salesforce 開発者向けの記事: Decorators (デコレーター)