Playwright MCPとCursorで、E2Eテストを自動生成してみた 〜AI×ブラウザ操作の新アプローチ〜
概要 playwright-mcpとCursorを活用し、E2Eテストをゼロから自動生成してみました。 本記事ではその検証プロセスと得られた知見を紹介します。 この記事で分かること Playwright MCPでE2Eテストを自動生成する方法 Playwright MCPの活用のヒント はじめに 昨今のMCPブームは収まることを知らず、日々新しいMCP Serverが公開されています。 そんな中、自動化テストツールとして有名なPlaywrightのMCP Serverが公開されました。 Playwrightには、既にユーザーがブラウザを操作しテストを生成できる非常に便利な機能がありますが、今回はそれを超えるために、ユーザーの代わりにCursor（MCP Client）を使用し、ブラウザの自動操作とE2Eテストの自動生成を行えるのかを検証しました。 検証環境 Cursor: claude-s
【完全解説】Clineソースコードから学ぶAIエージェント機能の設計 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 1. はじめに Cline は、VS Code の拡張機能として動作する AI エージェントです。 ユーザーが自然言語（チャット）でコード修正を指示すると、Cline は内部で大規模言語モデル（LLM）を活用し、以下の流れを 自動的 に実行します。 VS Code 上で対象ファイルを確認 修正案の生成（LLM への問い合わせ） 提案内容に応じたファイル更新 このような「チャットベースのコード修正ワークフロー」を実現するために、Cline は以下の特徴を備えています。 多様な LLM（OpenAI / Anthropic / DeepSe
色々なことをClineにやらせてみた - karaage. [からあげ]
AIエージェント 最近、LLMエージェントのイベントにゲストで登壇しましたが、流行りのAIエージェントに私も注目しています。 特に、最近よく使っているのがCline（Roo Code）というAIコーディングツールです。Clineの概要や、環境の構築方法・使い方に関しては以下記事にまとめました。 Clineは、もちろんコーディングに使っているのですが、ClineだとAIがVS Codeのターミナルを通じて、好きにコマンドを実行することができるので、実はコーディングだけじゃなくて、色々なことが出来て面白いです。 この記事では、Clineでコーディング含めて色々やらせてみた内容を簡単に紹介します。 コーディング タワーディフェンスゲームとか、一瞬で作ってデプロイしてくれます。 あとは、最近音楽ソフトもつくってYouTube配信とかもしています。 karaage.hatenadiary.jp マリ
![色々なことをClineにやらせてみた - karaage. [からあげ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/ff014f604a88143acba538c4098f2c97ee405e49/height=288;version=1;width=512/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F954cdea37235959aed05e679f10801d56f734b9a%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttps%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fk%252Fkaraage%252F20250227%252F20250227002317.png)
Cline+Claudeでの開発を試してみた感想
2年くらい前からCopilotやCursorによるコーディングサポートを受けた開発は実際に行なっていたのだけど、先週くらいからコーディングエージェントによる開発にも本腰を入れて調査を始めた。以下はその際に雑に調べた情報まとめ。 そんでこの土日くらいまで毎日、主にCline+Claude(その他versionや派生系クライアントも含む)を使って色々とコード生成させたりして実験したのでその感想を書く。 試してみたこと 最初は簡単なpromptを入力してポン出しで生成させるToDoリストとか管理画面みたいなものを作らせてワイワイしてた。だけど何回かやったら流石に飽きてきたので、もう少し規模の大きなタスクに取り掛からせることにした。 既存プロジェクトへのテスト追加 まず最初に、個人開発してるモンハンnowのTA走者向けのwebサイトが現状テストゼロだったので、これに対してClaude 3.5 so
Clineが実行したコマンドの結果がCline自身で読み込めない場合の対処法
Clineにコマンドを実行させた場合に通常であればVSCode内のshellが立ち上がり、コマンド実行してその結果を元に次のフローに進む。 しかし自分の環境ではコマンドの実行結果をClineが読めないというエラーが出てた(コマンドの実行結果が表示されていないようです。というメッセージがClineから返ってくる。)。 色々調べると下記のTroubleshootingにあるようにVSCodeのshell integrationを有効にしてVSCodeを立ち上げさせるような設定([[ "$TERM_PROGRAM" == "vscode" ]] && . "$(code --locate-shell-integration-path zsh)")を.zshrcなどに追記すればいいらしい。 まず自分はこれを試したがダメだった。 原因を調べるとcode --locate-shell-integrat
Cursor Agentベストプラクティス｜すてぃお
元々はJebbrains製のIDE（Goland、Webstorm）を利用していたのですがCursorを使い始めて数ヶ月経ちます。 Cusorを使い始める前よりもだいぶ早く実装できるようになったと感じます。 Cursorベストプラクティス ・Claude Sonnet 3.7を使え ・Project Rules（.cursor/rules）を使え ・ビルド、lint、テストなどで高速にフィードバックさせろ ・1セッションあたりで依頼することはできるだけ少なくしろ ・よく使うコマンドやライブラリはチートシート作れ — 今別府すてぃお (@suthio_) March 3, 2025 このプラクティスはCursor Agentに限ったものではなく、ClineやDevinを利用する際に活きてくることが非常に多いです。 Claude Sonnet 3.7を使えClaude Sonnet 3.7で解
これから始める Cursor エディター!
社内でCursor Businessを導入したので、利用方法や機能をまとめておきます。 なお、Cursorは発展途上で、UI周りの機能変更が多いため、あくまでも参考程度にしてください。 Cursorエディターとは Cursorエディターは、AIを活用してソフトウェア開発をスピードアップしてくれる次世代エディターです。チャット感覚でコードの修正や提案を行ったり、複数行にわたるコード補完などをガッツリやってくれます。さらに、Cursor独自のエージェント機能で自動的にコードベースを解析してくれるので、ちょっとしたバグ修正からプロジェクト全体のビルドまでグイッとサポートしてくれます。 Cursorのプラン Cursorには、大きく3つのプランがあります。いずれも「プライバシーモード」を有効にすれば、コードは自分のマシンにしか保存されず、外部への共有や学習には使用されません。ここではざっくりと紹介
Roo CodeとClineはどう違うのか
前提 Roo CodeがClineのフォークという程度には知られている。Roo Codeを好んで使っているユーザーがいるがどんな違いがあるのかというのが気になっていたので調べた。 結論としては「Rooは個人が趣味で実験的な機能モリモリ入れた改造版で、Clineが事業としてやっていこうとしているオリジナルな製品」 機能面は両方インストールしてもらえばすぐ分かるので背景的な情報とか内部設計とかをピックアップした。 画面 Roo Code Cline ユーザー数：Cline>Roo Code これはマーケットプレイスとGitHub、Discordを見るとわかる。 ざっくりと４：１ 開発者数：Cline>Roo Code Clineは会社化して採用してる GitHub上でいろんな人が活動してる エンタープライズでマネタイズするらしい MetaからClineに転職した人とかいる Rooはメインの二人
OS、プログラミング言語、ソフトを選ばない、マイクロソフトのコードエディター「Visual Studio Code」
Microsoftによると、VS Codeを使用しているユーザーの数は現時点で1400万人に達しており（Statistaによると世界中には約2400万人の開発者がいるという）、2020年にはプロフェッショナルの開発者という枠を超えてユーザー層が多様化したとともに、新型コロナウイルス感染症（COVID-19）のパンデミックに起因するリモート開発のニーズを受け、そのユーザー数は500万人増加したという。同社は2020年6月に、VS Codeのユーザー数が1100万人だと述べていた。この成功は、「GitHub」や「Electron」「Chromium」「JavaScript」「TypeScript」（同社が生み出したスーパーセット版JavaScript）の上に築かれたと言ってもよいだろう。 Microsoftで開発者部門のコーポレートバイスプレジデントを務めるJulia Liuson氏によると、
コーディングをAIが支援してくれる「Visual Studio IntelliCode」がアップデート。既存コードからコーディング規約を推測し、適切な設定ファイルを生成
コーディングをAIが支援してくれる「Visual Studio IntelliCode」がアップデート。既存コードからコーディング規約を推測し、適切な設定ファイルを生成 マイクロソフトが今年5月に発表したVisual Studioの拡張機能「Visual Studio IntelliCode」は、機械学習によってコーディングを支援してくれるというものです。 GitHubなどの公開されているコードによる機械学習を基に、コードの入力や補完における適切なレコメンデーションや、コードレビュー時のアドバイス、問題がありそうな部分の指摘などをしてくれます。 ［速報］AIがコードのレコメンドやバグの指摘など開発を支援してくれる「Visual Studio IntelliCode」発表。Build 2018 － Publickey そのVisual Studio IntelliCodeがアップデートし、既
［速報］無償のコードエディタ「Visual Studio Code」が、Go言語/Pascal/Reactなどに対応。ベータ版にも到達。Microsoft Connect(); 2015
［速報］無償のコードエディタ「Visual Studio Code」が、Go言語/Pascal/Reactなどに対応。ベータ版にも到達。Microsoft Connect(); 2015 マイクロソフトは11月18日（日本時間18日深夜）に開催したオンラインイベント「Microsoft Connect (); 2015」において、無償のコードエディタ「Visual Studio Code」のベータ版到達と、エクステンションによるGo言語やPascal言語、TypeScriptやReactなどを発表しました。 エクステンションでGo言語やPascalに対応 マイクロソフト EVP、Cloud＆Enterprise Groupスコット・ガスリー氏。 4月に発表したVisual Studio Codeは、コードを書くことに最適化したエディタだ。IntelliSenseやデバッガ、Gitによるソー
Visual Studio Code のテーマを変更する + プロ生ちゃんを表示 – プログラミング生放送
Microsoft の開発者イベント Build 2015 で、Windows/Mac/Linux で使える軽量なエディター「Visual Studio Code」が、公開されています。 本日より提供が開始されています。 ［速報］マイクロソフト、コードを書くのに最適化したツール「Visual Studio Code」発表。Windows、MacOS、Linuxに対応、無料提供。Build 2015 － Publickey マイクロソフト、Macでも動くVisual Studio Code 無料提供。クラウドアプリ向けコードエディタ – Engadget Japanese ちなみに、中身は Electron (Atom Shell) とのこと（Visual Studio Code の中身は Electron + Monaco だった – しばやん雑記）。 下記の内容は、現時点のプレビュー版の
Visual Studio Code の中身は Electron + Monaco だった - しばやん雑記
Build 2015 のキーノートで公開された Visual Studio Code ですが、見た目がどう考えても Visual Studio Online "Monaco" だろと思っていたら、思った通り Monaco だったようです。 Visual Studio Code - Code Editing. Redefined 実行環境としては Atom Shell と言うか Electron を使っているみたいです。当然ながら中身は Monaco なので Node.js で書かれています。 インストールされたディレクトリを見ると、Chromium な DLL とか出てきます。 最近はアプリケーションも nupkg 形式で配布するようになったんですね。 基本的には Chrome のように起動時にアップデートしていくスタイルのようです。 Windows だけだと思いますが、インストールすると
Visual Studio Code
Any model for any team Use AI models like Claude Sonnet out of the box, or bring your own key to access models from Azure, Anthropic, Google, Ollama, OpenAI, and OpenRouter. An expert on your codebase Your codebase is indexed locally and remotely (on GitHub) to understand what's relevant, enabling fast, context-aware interactions. AI that works the way your team does Personalize interactions using
Sublime、Vim、Emacs、AtomなどにIntelliSense機能を追加する「OmniSharp」、マイクロソフトがデモ
Sublime、Vim、Emacs、AtomなどにIntelliSense機能を追加する「OmniSharp」、マイクロソフトがデモ Sublime TextやVim、Emacsなど既存のテキストエディタに対して、マイクロソフトのVisual Studioが備えているIntelliSense機能を追加できるオープンソースソフトウェア「OmniSharp」のデモが、日本マイクロソフトが1月16日に開催したイベント「GoAzure」の基調講演で披露されました。 OmniSharpのデモを行ったのは、米マイクロソフト Principal Program ManagerのScott Hanselman氏。.NET CoreがオープンソースとなってMacOS XやLinuxに移植され、C#も使えるようになることを紹介した上で、「MacやLinuxでのソースコード修正は手間だ、IntelliSense
気軽にプログラミングを始められるWebエディタ『runstant』作りました - Qiita
7月19日. 久しぶりの３連休. 予定はぎっしりだった. だが神からのお告げがあった. なんか作れと. 気づいたらオレの指は Macbook Air の薄いキーボードの上だった. ってことで連休中にちょっとしたツール作りました. 気軽にプログラミングを始められるWebエディタです. 名前は runstant. run + instant の略で, インスタントラーメンのように一瞬で気軽に実行できるよって意味です. ログイン不要, サーバー通信なしで一瞬で プログラミングを始めることができます!! 一応, tmlib.js 公式エディタ的な 位置づけなのでデフォルトで tmlib.js のサンプルが入ってます. とりあえず触ってみてください -> こちら 特徴 ログインの必要ないよ 状態を hash で保存するのでサーバー通信しないよ html/css/javascript が書けるよ ちょ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
［速報］マイクロソフト、コードを書くのに最適化したツール「Visual Studio Code」発表。Windows、MacOS、Linuxに対応、無料提供。Build 2015