すべて使用されているJavascript関数を報告してください

Question

私はWYSIWIGアニメーションエディタを使って多くの依存関係を含むスライダ/広告バナーを設計しています。私は、重要な事柄を特定するのに役立つコードのレポートを実行したいと考えています。そして、サイズによってそれをソートしますいくつかのPHP https://regex101.com/r/sXrHLI/1

： Sort preg_match_all by named group size

考えは大きな識別することにより、ということである私は、すべての機能にはJavaScriptを検索し、部品の各機能を返しますカップルクール開始を持っています使用されていない関数を削除することができます。私の次のステップは、ドキュメントの読み込みでどの関数が呼び出されたのか、そしてクリック/マウスオーバーなどのアクションで読み込まれ呼び出される関数ツリーを特定することです。私は私のDOMにロードされているすべての機能を伝え、この便利な機能を持っているが

は、それが十分ではありません：私は、私はPHP /シェルでスクリプトに使用できるソリューションを探しています

var functionArray; 
$(document).ready(function(){ 
    var objs = []; 
    for (var obj in window){ 
     if(window.hasOwnProperty(obj) && typeof window[obj] === 'function') objs.push(obj); 
    }; 
    console.log(obj)); 
}); 

ページロードをエミュレートする - ここで私の専門用語が私にはうまくいかず、コールスタックを探していますか？タイムライン、インタプリタ、フレームワーク、エンジン、パーサが必要ですか？

私は、次のすべての要素、またはこの正規表現のようなものに一致するすべての要素のクリック/ホバーイベントをエミュレートする必要があります。

(?|\$\(['"](\.\w*)["']|getElementsByClassName\('(\w*)'\)) 
(?|\$\(['"](\#\w*)["']|getElementsById\('(\w*)'\)) 

私はのマスターリストを作ることができるような機能をトリガーするイベントを見つけるために、最終的なコードにある必要がある関数。

Answer 1

私は、このツールを見てみるために、あなたをお勧めしたい： Istanbul

それを使用すると、以下の操作を行うことができます

1. それを展開してコード
2. のインストルメントバージョンを作成（カバレッジ情報はブラウザ内のグローバル変数の1つに集められます）
3. ファイルへのコピーカバレッジ情報（私が覚えている限りlcovデータ）
4. あなたはさらに行くように感じる場合は、あなたが実際にUIテストを自動化するためにセレンとJVM-キュウリのようなものを使用することができます

それでコードカバレッジレポートを生成します。ただし、ページをリロードするたびにカバレッジデータをダンプする必要があります。次に、異なる実行からのカバレッジを結合し、この統合lcovデータを使用して全体的なレポートを生成する必要があります。

プロセス全体が少し重いですが、それを再考するのが良い方法です。

このデータをユニットテストカバレッジ情報と組み合わせて、共同レポートを作成することもできます。

また、sonarサーバーを設定して、複数のバージョンのカバレッジレポートを保存し、テストの違いを比較することもできます。

Answer 2

私はGoogle Developerからの講演を見ていましたが、私はあなたの投稿を考えました。次のリンクはmore intel on Dev Tools Coverage Profilerですが、以下はハイレベルです。

Googleの開発ツールでは、使用したJSとCSSコードに関するレポートを生成するためのきれいな機能が搭載されています。これは検索対象の本質に沿っています（若干異なる媒体です）。自動化するのが少し難しいですが、そうでなければ、あなたが探していたものを正確に含んでいます）。

デベロッパーツールを開き、左下にある楕円を開いて（画像参照）、レコードボタン[画像1を参照]をクリックします。キャプチャしたいステップを実行します。あなたはすべてのコードを経由して使用した（緑）、何を（赤）を使用していなかったものを見ることができるにインタラクティブな画面が得られます

画像1 [画像2を参照してください] - 楕円をこの記事を編集しているときに、このStackOverflowのページのためのインタラクティブ・レポートの全スクリーンショット - カバレッジ・ツールに

画像2を取得するためにドロップダウン。