Windsurf の Previews を使うと、アプリのローカル環境を IDE 内またはブラウザ（Google Chrome、Arc、Chromium 系ブラウザ向けに最適化）でリスナー付きで表示でき、要素やエラーを簡単に Cascade にコンテキストとして送り返して素早く反復できます。 Previews はツール呼び出しで開けます。まずは Cascade に「アプリをプレビューして」と依頼してください。あるいは、Cascade のツールバーで Web アイコンをクリックすると、自然言語のプロンプトが自動で伝播され、プロキシに入れます。

​
要素をCascadeに送る

Previewで、要素/コンポーネントやエラーを直接Cascadeに送信できます。右下の「Send element」ボタンをクリックし、送信したい要素を選択してください。 選択した要素は、現在のCascadeのプロンプトに @ mention として挿入されます。プロンプトには必要なだけ要素を追加できます。

​
IDE 内プレビュー

Windsurf はエディタ内の新しいタブとしてプレビューを開けます。これは、Cascade パネルの横で Web アプリを表示できるシンプルな Web ビューです。 これらのプレビューはローカルでホストされるため、システムのブラウザでも開けます。各種リスナーに加え、要素やコンソールエラーを選択して Cascade に送信する機能もそのまま利用できます。
リスナーや要素・エラー送信の機能は、Google Chrome、Arc、Chromium ベースのブラウザ向けに最適化されています。

​
無効にする方法

Web アイコンをクリックすると、「Disable previews」を選択するオプションが表示されます。これは Windsurf の設定からも行えます。これにより、Cascade がこのツール呼び出しを行わなくなります。