はじめに
こんにちは！KIYOラーニングでQAエンジニアをしている@ayshiinaです。
私は普段テスト設計・実行を主業務としており、プログラミングコードについての知識はなく、書くことができません。
そんな私が今回、MagicPodでWebAPIステップやTypeScriptステップを使って、モバイルアプリ（Android）の「リアルタイム通知ポップアップ」を検証する自動テストを実装しました。
この実装にあたって、コード作成や処理の検討にはClaude Codeを活用しました。
この記事の目的
この記事では、ノーコードテスト自動化ツールMagicPodとClaude Codeを組み合わせて、
- WebAPI × TypeScriptステップで自動テストを実装した方法
- コードが書けないQAでも実装できた実体験
を具体的に紹介します。
背景
テスト対象「勉強仲間」機能とは
今回のテスト対象としたのは、STUDYing（スタディング） の 「勉強仲間」機能 です。
STUDYingは資格取得を目指す学習者向けのオンライン学習サービスで、「勉強仲間」は同じ資格を目指す仲間と励まし合ってモチベーションを高めるための学習SNS的な機能です。学習内容をタイムラインに投稿し、他の学習者の投稿にいいね等のリアクションやコメントを送って交流できます。（参考：https://studying.jp/social/guide.html ）
そして、こうしたやり取りが起きると、モバイルアプリではリアルタイムで通知が届きます。今回はこのリアルタイム通知のテストを実装することになりました。
このテストで実現したかったこと
「アプリを開いている状態で、他のユーザーからの反応（いいね・コメント・返信）の通知ポップアップをリアルタイムに受信できること」 を確認することがテストの目的です。
実装で難しかった点
このテストの実装で難しかった点は、該当機能が「2人のユーザーによる操作」を前提としていることでした。
自分の投稿に対して、別のユーザーがいいねやコメントをしない限り、通知は発生しません。しかしMagicPodでは、1つのテストケースの中で複数ユーザーが同時にログインし、それぞれUI操作を行うことができません。
そのため、UI操作だけで「2人のユーザーの操作」を再現しようとすると、テストが成立しないという課題がありました。
解決アプローチ
このテストで必要な「通知を受け取る側（投稿する側）」と「通知を発生させる側（リアクションする側）」の2人のユーザーのうち、通知を発生させる側の操作は、UIではなくWebAPIで再現する という方針にしました。
| 投稿者（実機のUI操作） | リアクション者（WebAPIで操作） |
|---|---|
| ログイン | APIでセッション取得 |
| 勉強仲間に投稿 | いいね／コメント／返信をPOST |
| 通知ポップアップを受信 | （＝通知を発生させる） |
この構成で、「複数ユーザーが同時にUI操作できない」という制約を、UIに依存しないWebAPIのステップで回避しました。あわせて、APIのレスポンスから必要なデータ（投稿IDなど）を取り出す処理をTypeScriptステップで補いました。
テストケースの構成
テストの構成は以下の通りです。
③〜④を、いいね → コメント → コメントへのいいね → 返信と繰り返すことで、この機能で発生する各種の通知を1つのテストケースでカバーします。
実装のポイント① WebAPI × TypeScriptステップの活用
【WebAPIステップでやったこと】
リアクション者側の操作はすべてWebAPIで実行しました。
- リアクション者のセッションを事前取得（ログインAPIを叩く）
- 投稿者の投稿に対して いいね・コメント・返信を順番にPOSTして、通知を発生させる
【TypeScriptステップでやったこと】
APIのレスポンスやページのHTMLから、テストの続行に必要な値を取り出す処理をTypeScriptで書きました。
- ログインに必要な認証トークンをHTMLから抽出
- タイムラインのレスポンスから、対象となる投稿IDやコメントIDを抽出
たとえば「投稿IDを取り出す」ステップは、APIレスポンス（JSON）を受け取って、目的の投稿のIDだけを返す——というイメージです。
ちなみにですが、今回活用した TypeScriptステップは 2026年3月にMagicPodに追加された新機能 です。
これまで標準のコマンドだけでは難しかった処理も、コードを書くことで実現できるようになりました。今回のテストも、この機能により実現できたものです。
参考：https://support.magic-pod.com/hc/ja/articles/55827159422873-%E3%83%90%E3%83%BC%E3%82%B8%E3%83%A7%E3%83%B31-59-0-2026-3-8
実装のポイント② Claude Codeをフル活用
ここまで「WebAPI」「TypeScript」と書いてきましたが、冒頭の通り私はコードを書けません。
「このようなテストを実装したいので、実現するためのコードを書いて」とClaude Codeにお願いして生成してもらい、MagicPodのステップにコピペすることで実装しました。
【使い方】
基本的には次の繰り返しです。
- やりたいことを日本語で伝える （例：「このAPIレスポンスのJSONから、最新の投稿のIDだけを取り出すTypeScriptを書いて」）
- Claude Codeが生成したコードを MagicPodのTypeScriptステップに貼る
- 動かしてみて、エラーや想定外の挙動が出たら、エラー文ごとClaude Codeに渡して直してもらう
★詰まったときの聞き方のコツ
-
エラーを丸ごと貼る
自分で見てもよくわからなかったので、実行ログやエラーメッセージをそのまま渡し、「失敗の原因と修正方法を教えて」と尋ねることでトライアンドエラーを繰り返しました。
まとめ
今回の記事では、MagicPodのWebAPIステップとTypeScriptステップを活用し、UI操作だけでは難しかったテストを自動化した事例を紹介しました。
私のようにコードが書けないQAでも、Claude Codeを活用することで、必要な処理を補いながら実装することができました。
この経験が、どなたかの参考になれば幸いです。最後までお読みいただきありがとうございました。
KIYOラーニング株式会社について
当社のビジョンは『世界一「学びやすく、分かりやすく、続けやすい」学習手段を提供する』ことです。革新的な教育サービスを作り成長させていく事で、オンライン教育分野でナンバーワンの存在となり、世界に展開していくことを目指しています。
プロダクト
- スタディング：「学びやすく・わかりやすく・続けやすい」オンライン資格対策講座
- スタディングキャリア：資格取得者の仕事探しやキャリア形成を支援する転職サービス
- AirCourse：受け放題の動画研修がついたeラーニングシステム（LMS）
KIYOラーニング株式会社では一緒に働く仲間を募集しています