ユーザーのシステムからブラウザのウィンドウにファイルをドラッグ アンド ドロップする Web アプリケーションを構築しています。
仮想DOMがファイルドロップイベントを取得するように、（テスト駆動開発の目的で）利用可能なヘッドレスブラウザーの1つを使用して、UIとのユーザーの対話を自動化したいと考えています。
すぐに使えるソリューションを探すのに 2 時間費やしましたが、成功しませんでした。自動化できる唯一のことは、input[type=file] を使用して単一のファイルをアップロードすることです。それは私が望むものではありません。
Mac OS X または Linux ですぐに使用できるソリューションはありますか?
良い解決策はわかりませんが、いくつかの回避策があります。
Linux 上の VM または Xnest または VNC サーバーでブラウザーを実行できます。これにより、UI が提供されます。VNC などのプロトコルを使用すると、マウスをエミュレートすることもできるため、ファイル ブラウザーを開いて実際にファイルをドラッグすることができます。
プロ: 本当のことをします。
短所：脆い。設定する作業がたくさんあります。
正確には何をテストしていますか？ブラウザのファイルアップロードコンポーネント? またはサーバー上のファイルを処理しますか?
複数ファイルのアップロードに既存の/ボックス化されたコンポーネントを使用している場合、なぜそれをテストするのですか? あなたのためにそれを書いた人はテストしませんか？なぜこの努力を繰り返すのですか？
サーバーがファイルを正しく処理するかどうかのみに関心がある場合は、HTTP クライアント ライブラリを使用して手動でアップロードします。必要に応じて、 Charlesなどの HTTP プロキシを使用して、実際のクライアントとサーバーの間で何が起こるかを確認してください。
アプリとウィジェットの相互作用をテストしたい場合は、注意が必要です。これをテストするには、ブラウザでロギング/デバッグを有効にして、ドロップ中にどのイベントがトリガーされているかを確認する必要があります。JavaScript を使用すると、任意のイベントを作成できます。Phantomjsの場合、試してください--webdriver-loglevel=DEBUG
「ドロップ」イベントがどのように見えるかがわかったら、人工的なイベントを作成してウィジェットに送信します。
[編集]独自のファイル アップロード ウィジェットを作成する場合は、「ドロップ」イベントをコンソールに記録することをお勧めします。多くの最新のブラウザーでは、コンソールにアクティブな要素が表示され、それを調べることができます。これを使用して、使用されているオブジェクトと各スロットの値を確認します。
これにより、テスト ケースからそのようなイベントを作成するのに十分な情報が得られます。jQuery にはイベントをゼロから構築するための優れたフレームワークがあるため、テスト中に jQuery を使用することをお勧めします。