1

grunt-phantomcssプラグイン (基本的には PhantomJS と CasperJS のラッパー)を使用してページをテストしているところです。

私たちのサイトには動的に入ってくるものがいくつかあります (ユーザーのランダムなプロファイル画像とランダムな広告) 技術的には、ページを読み込むたびに見た目が異なります。つまり、ビルドが失敗します。Casper/Phantom がそれらを認識せずにビルドに合格するように、古き良き DOM API 手法に飛び込んで使用し、これらの画像を「グレー表示」/不透明にすることができるようにしたいと考えています。


すでに見てきましたpageSettings.loadImages = falseが、技術的には機能しますが、すべての画像も削除されます。つまり、非広告、非プロファイルの画像でさえ除外されます.


これは非常に基本的なサンプル テスト スクリプトです (動作しません)。

casper.start( 'http://our.url.here.com' )
  .then(function(){
    this.evaluate(function(){
      var profs = document.querySelectorAll('.profile');
      profs.forEach(function( val, i ){
        val.style.opacity = 0;
      });
    return;
    });
    phantomcss.screenshot( '.profiles-box', 'profiles' );
  });

他の人がこれをどのように解決したか知りたいです。なぜなら、これは奇妙な使用例ではないと確信しているからです (非常に多くの人が自分のサイトに動的広告を持っているため)。

4

1 に答える 1