firefoxを隔離する方法17レンダリングのバグ

Question

一部のHTMLには、Firefox 17（OSX 10.8.2、まだテストされていないOSはありません）のみに奇妙なバグがあります。私はいくつかのページ上の繰り返し要素であるテキストを囲む 'サイドバー' CSSクラスを持っています。あるページでは、このテキストはcss visiblilityプロパティが 'hidden'に設定されているかのようにレンダリングされます（表示されませんが、周囲には正しいスペースが残ります）。

^{は、Firefox 16.0.2を残しました。 右のFirefox 17.0.1ここで}

はCSSクラスです：

.sidebar { 
     position:fixed; 
     top: 2px; 
     left:4px; 
     display:table-cell; 
     vertical-align:bottom; 
     z-index: 2; 
     width: 700px; 
     height: 64px; 
     -webkit-transform: rotate(90deg) translateX(320px) translateY(340px) scale(1); 
     -moz-transform: rotate(90deg) translateX(320px) translateY(340px) scale(1); 
     -o-transform:  rotate(90deg) translateX(320px) translateY(340px) scale(1); 
     -ms-transform:  rotate(90deg) translateX(320px) translateY(340px) scale(1); 
     transform:   rotate(90deg) translateX(320px) translateY(340px) scale(1);  
} 

被災HTML：

<div class="sidebar" > 
    <span class="TMUP1"> 
     <a href="/">Section_Header</a> 
    </span> 
    <span class="sidebarcontents" style="vertical-align: 50%"> 
     Subsection_Header 
    </span> 
</div> 

サイト上のすべてのページは、Google Analyticsの非同期トラッキングの同じ作品が含まれていますjavascript。このコードを削除すると、バグが消えます。私はコードをチェックして、それは正しいです。これは、サイト内のすべてのページに使用され、そして同じHTML（それは繰り返しヘッダーだ）と他のすべてのページには、細かい

グーグルjsのコードをレンダリングされます。

<script type="text/javascript"> 
    var _gaq = _gaq || []; 
    _gaq.push(['_setAccount', 'UA-000000-0']); 
    _gaq.push(['_trackPageview']); 

    (function() { 
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 
    })(); 
</script> 

バグのいずれかの下で消えます以下の条件
- firefox 16（同じユーザー設定とプラグイン）、または他のブラウザで表示されます。
- Firefoxの17 /セーフモードで表示
- すなわち削除（

-moz-transform: translateX(320px) translateY(340px) scale(1); 

で 'サイドバー' Class CSSの

-moz-transform: rotate(90deg) translateX(320px) translateY(340px) scale(1); 

から次の行を交換する - Google Analyticsのコード
を削除回転）

これはプラグインとアドオンとは関係ありません。手動でこれらのすべてを手動で無効にするかのように、まだバグですビデント。

同じHTMLを持つ他のページ、同じCSSと同じGoogleアナリティクスコードがうまく表示されます。

問題ページは、サイト内で最大です（約10KBの、最適化された/ gzip形式のhtml、約160個の小さな画像/ 880KBの読み込み済み）。他のページはすべて小さくなります。

私は劇的これもバグを修正し、これらの要素の数を削減した場合、本体はほぼ完全にこの要素の160回の繰り返し

<div class= "outerDiv" style="background-color:transparent"> 
<div class="innerDiv"> 
    <a href='/artists/artist_name/'> 
    <img src="/artists/artist_name/_portrait/artist_portrait.jpg" alt="" width="150" /> 
    </a> 
<div class="short_caption"> 
    <a href='/artists/artist_name/' style="color:white">artist_name</a> 
<br />artist_location 
</div></div></div> 

で構成されています。

バグをさらに分離/修正する方法はありますか？現時点では、アナリティクスを犠牲にしたりサイトを再設計しなければならないように思えますが、両方とも少し過剰に見えます。

更新

私はより多くの調査がたくさん行われ、これにそれを持っています。

• GoogleのJavaScriptとは関係ありません。 ANYスクリプト、空の<script></script>でもこのバグが呼び出されます。
• リンクされたスタイルシートから@ font-faceを引っ込めたカスタムフォントを使用しています。
  • システムフォントのみを使用すると、バグが消えます。
  • Iは、ページヘッダに連結されたスタイルシートからする@ font-faceルールを移動した場合、バグがより弾性になる：それは
は、バグ消滅をハードウェアアクセラレーションをオフ
• かかわらず、スクリプトタグの存在の現れ。
• トランスフォームからローテーションを削除すると、バグが消えます。
• ページサイズを縮小し（160イメージから約10）、バグが消えます。
• Firefoxは毎晩（V20）ので、それが後にv17.0.1

ここ

問題を示すいくつかのサンプルページですいくつかの将来のバージョンで修正される原因になっているものは何でもバグを示していない（私はそれらを避けるのです私はリンクがここでは少し眉をひそめていると思います）。ブラウザのキャッシュには、バグの効果を測定するために、各ページビューの間に空にする必要があります正確に

• original page存在バグ存在
• test pageバグ
  • 単純化されたHTMLと最小化CSSのバグ
  • なしJavaScriptを単離するために、 1つは空です<script></script>タグ

これらのサンプルは、すべてのテストページから誘導される：

• <script></script> tag removedバグ不在
• rotation removed from transformバグ不在
• page size reduced from 160 to 18 imagesバグ不在
• no custom fonts不在バグ
• internal stylesheet for custom fonts本バグ
  • thi奇妙なものです。 @font_faceスタイルシートが外部の場合、バグは<script></script>タグが存在する場合のみ表示されます。 @font_faceルールを内部スタイルシートに移動すると、<script></script>タグがない場合でもバグが明らかです。

私は、私は1つのブラウザのいずれかのバージョンのために少しOTTだサイトを再設計する必要があるだろう程度にページのデザインを変更せずにバグをなくすように見えることはできません。より現実的な回避策を望んでいます。私はjQueryブラウザの盗聴を使用してみましたが、javascriptは非スターターであるバグを紹介しているようです。 2

更新は今、私は別のマシンでテストし、バグが非常にまれマニフェストではありません発見する機会がありました。元のマシンで新しいユーザーとしてテストを行っても、バグは表示されません。だから明らかにユーザーの設定と関係しています - うまくいけば、かなりまれです。 @Borisの提案に続き

更新3

、私がどこでどのようにページが解体されて見にインクリメンタルな回転を試してみました。回転（0度）から約80度までは問題ありません。私は...、問題の切り分けを容易にするためにすべての要素に（彼らはオートリフレッシュに1から次へとバウンス必要があります）0-90degを示す

• sample pagesを1pxの境界線を追加しました。
  これは-moz-transformを使用していますので、Firefoxで検討する価値があります。
• animation：これは私が@arttronicsからいくつかの提案に答える更新4

  は、Firefox 17.0.1

に取得していた結果である - ここではそれは積み重ねなければならないかを示す3d firefox view（ときです私が3Dビューに切り替えると、Firefoxが正しいことをやるのが少し難しくなっているかのように、バグが消えてしまいます。

• 3Dビューに表示される内容はテキストの整列のため、バグには影響しません。see this cut-down version;
• ズームはリセットされ、変更されません。
• 新しいユーザープロファイルは同じ動作を示します。

更新5 - おそらく少し弾力いえバグは、まだここにいる（@arttronics'と答えたあたりとして）Firefoxのリセットを実行した後のFirefox

をリセットします。 、ページ

後リセットをリフレッシュキャッシュをクリアし、さわやかなバグの時間の約50％を占めています - キャッシュ
をクリアする - これはバグ
を呼び出します。リセットする

前。キャッシュをクリアしたら、Firefoxを再起動してページに戻ってください。それは毎回あります。

---

私は自分の質問に答えるつもりです...私は解決策を見つけていないが、スタックオーバーフローのコミュニティの関心と驚くほどの努力のおかげで、それは私のことをかなり明確なようだ...

• が、これは特殊性を超えて複製することは非常に難しい問題がある可能性があります利益のために、そのため、サイトの再設計

を伴わない回避策はありません私のユーザー設定

のそれは、Firefox 17.0.1で唯一のマニフェストあいまいなバグだと明らかにFirefoxの18

に固定します他の問題と一緒に移動すると、私はこの質問をすることをお勧めします安心して！コメントや提案をした皆さんのおかげで、それは非常に教育的なプロセスでした。

Answer 1

はあなたの詳細な質問と結果のコメントに基づいてFirefoxの

をリセットし、この特定のバグがあなたにだけ一意であり、新しいFirefoxのユーザープロファイルが問題を持っていながら、一定の条件の下で（新しいOSのユーザープロファイルには問題がありません）。

その後のFirefoxをリセットする時間です。ちょうどfollow these simple stepsとv17.0.1が正常に戻っているはずです。 Firefoxのインストール用に複数のプロファイルがある場合は、代わりにfollow these other stepsを使用してください。

注：リセット機能を使用すると、ブックマーク、閲覧履歴、パスワード、Cookie、Webフォームの自動記入情報が保存されます。ただし、拡張機能やテーマは削除されます。開いているタブ、ウィンドウ、タブグループは保存されません。あなたの設定がリセットされます。

---

EDIT：先日書かれた私のコメントパー：まだのよう

私は誰もが、彼らはあまりにもこのロゴ シンクホールの問題を参照してくださいすることを答える見ますが、リースのFirefoxでありませんでした18 ETAはこの コメントから3週間後です。

ソリューションはFirefoxの18がリリースされるまで待つだけすることであってもよい、と述べました。