Firefox 10 の後方互換性に関わる修正

Firefox 10 は 01/31 のリリースに向けて開発が進められています。可能な限り互換性を維持するよう開発されていますが、他のブラウザとの相互運用性や最新 Web 標準仕様への準拠のため、後方互換性に関わる修正も含まれます。そのような修正点をまとめましたので、動作検証時などにご参照ください。

ここでは後方互換性に影響し得る修正のみ解説します。その他の新機能や変更点については次のページをご覧ください:

UserAgent 文字列のバージョン番号が 2 桁になります

Firefox 10 は初めてメジャーバージョン番号が 2 桁になる Firefox です。UserAgent 文字列でブラウザ判別を行っており、そのスクリプトのバージョン判別コードが不適切である場合、ブラウザ判別に失敗する可能性があります。UserAgent 文字列を利用するスクリプトを確認するか、Firefox 10 Beta 版で動作をご確認ください。

Firefox の UserAgent 文字列は正式版またはベータ版では次のようになります:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:10.0) Gecko/20100101 Firefox/10.0
Mozilla/5.0 (Windows NT 6.2; rv:10.0.1) Gecko/20100101 Firefox/10.0.1

メジャーバージョンが 2 桁以上になるほか、セキュリティアップデートなどがあればバージョン番号が 10.0 のような 2 つ区切りだけでなく 10.0.1 のように 3 つ区切りになることに注意してください。

Firefox の Beta 版は製品版と同じ UA 文字列ですが、Nightly 版または Aurora 版では次のようになります:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:12.0a1) Gecko/20120122 Firefox/12.0a1
Mozilla/5.0 (Windows NT 6.2; rv:12.0a2) Gecko/20120122 Firefox/12.0a2

Gecko/yyyymmdd の部分が 20100101 固定ではないこと、バージョン番号末尾に a1 や a2 が付くことに注意してください。その他、Firefox の UserAgent 文字列について詳細は MDN のドキュメントをご参照ください。

なお、Internet Explorer についてもバージョン番号が 2 桁になる日が近いため、合わせて確認されることをオススメします。

<table> 要素のマージンが正しく相殺されるようになりました

CSS の仕様では垂直方向のマージンは前後の要素間で「折り畳み」が行われます。つまり、垂直方向の要素間のマージンは相殺され、前後の要素のマージンのうち大きい方の分だけ要素間に余白が確保されます。

しかし Firefox 9 までは <table> 要素については前後の要素とマージンの相殺が行われておらず、<table> 要素上下のマージンは上下それぞれの要素のマージンとの和になっていました。Firefox 10 からは他の要素同様に適切にマージンの折り畳みが行われるよう修正されました。<table> と前後の要素の両方にマージンが指定されている場合はマージンが小さくなります。縦方向のサイズに依存するページレイアウトで <table> にもマージンを指定している場合には注意してください。

例えば次のようなコードでは Firefox 9 までは <table> 上下のマージンはそれぞれ 1+2=3em, 2+3=5em となっていましたが、Firefox 10 からは Max(1,2) = 2em, Max(2,3) = 3em となります:

<p style="margin: 1em;">margin-bottom のある要素</p>
<table style="margin: 2em;"><tr><td>table 要素</td></tr></table>
<p style="margin: 3em;">margin-top のある要素</p>

通常配置でない <table> 内で絶対配置する基準位置が修正されました

CSS 仕様では絶対配置 (position: absolute) される要素は、祖先の要素のうち直近の通常配置 (position: static) でない要素 (position: relative or absolute or fixed) を基準としてオフセット (top, bottom, left, right) で指定された位置に配置されます。

しかし Firefox 9 までは祖先の要素のうち <table> 要素については通常配置でない場合でも、子孫を絶対配置する基準として扱われず、<table> より祖先の通常配置でない要素を基準として配置されていました。絶対配置、相対配置または固定配置された <table> 内で要素を絶対位置指定を使っている場合にレイアウトが変更されます。

例えば次のようなコードでは Firefox 9 までは <table> 内の <div> 要素は外の <div> 要素を基準としてしまうため、コンテンツ領域の上から 0+50 = 50px, 左から 100+50 = 150px の位置に描画されます。Firefox 10 からは <table> 要素を基準として、コンテンツ領域の上から 100+50 = 150px, 左から 100+50 = 150px の位置に描画されます。

<div style="position: absolute; left: 100px;">絶対配置されている祖先要素
<table style="position: absolute; top: 100px;"><tr><td>
  table 内の通常配置要素
  <div style="position: absolute; top: 50px; left: 50px;">table 内の絶対配置要素</div>
</td></tr></table>
</div>

絶対配置の問題とマージン相殺の問題はいずれも CSS 仕様に合わせた修正です。他のブラウザと同じレイアウトに修正されるため、これまで Firefox 専用のレイアウトではなくマルチブラウザ対応をしていたのであれば大きな問題にはならないと思われます。詳細はこちらの記事もご覧ください。

なお、ここでは簡単のため <table> 要素と書きましたが、display: table を設定された任意の要素に対する修正になります。

Strict モードでは E4X が使えなくなります

Firefox の JavaScript エンジンは E4X という XML を簡単に扱うための構文をサポートしていますが、ECMAScript 5th で導入された Strict モードを有効にしている場合には E4X 構文が使えなくなります。

E4X と Strict モードを同時に使っている場合があれば、Strict モードの利用を止めるか、E4X で書かれているコードを書き直してください。

DOM4 で非推奨になったプロパティが削除されます

DOM4 では次の属性やプロパティが非推奨となり、Firefox 10 からは削除されました。

document.xmlVersion は常に “1.0” を返すため document が XML であるか HTML であるかの判別程度にしか使えませんでした。その判別をするには次のような方法があります:

if (document.createElement("foo").tagName == "FOO") {
  /* HTML モードでは tagName 属性で要素名が大文字に変換される */
}

node.isSameNode() メソッドを使っていた場合は同値演算子 (===) で比較するコードに書き換えてください。

setAttribute() で整数値を設定する時に末尾の非数字文字を無視して解釈します

HTML の仕様では整数値の属性に値を設定するとき、指定された文字列末尾の数でない文字は無視するように定義されています。つまり “100fox” は “100” として解釈しなければなりません。

Firefox 9 までは数でない文字が含まれていた場合はエラーとして扱っていましたが、Firefox 10 からは仕様通り指定された文字列始めの整数値部分が設定されるように修正されます。

例えば、次のようなコードでは Firefox 9 までは <canvas> の幅は設定されず初期値 (300) に戻ってしまいますが、Firefox 10 からは 100 に設定されます。

document.getElementById("canvasid").setAttribute("width", "100em");

ESC キーでは oninput イベントが発生しなくなります

HTML の仕様では要素の値が変更される時にだけ oninput イベントが発生するとされていますが、Firefox 4 からFirefox 9 までは ESC キーの入力時にも oninput イベントが発生していました。

Firefox 10 からは仕様通り ESC キーではイベントが発生しないよう修正されます。

IndexedDB の実装が最新仕様に合わせて更新されます

Firefox 4 からは仕様策定中の IndexedDB の一部 API をサポートしていますが、その後も対応する API の追加や仕様変更に合わせた変更が続けられています。Firefox 10 では IndexedDB について比較的多くの変更が行われていますが、その中でもバージョンの指定方法の変更には注意してください。

これまではデータベースへの接続を開いてから setVersion() メソッドで指定していましたが、setVersion() メソッドは削除され、データベース接続時の引数でバージョン番号を指定することになりました。setVersion() メソッドを使用しているコードは全て変更が必要になります。

この IndexedDB の変更について日本語で解説された記事としては、mzsm さんが先月書かれた「IndexedDBに関する覚書 (2011年12月版)」が参考になります。

以前のバージョンについて

以前のバージョンについても同様に、後方互換性に関わる修正点をまとめています:

投稿者

dynamis

投稿日

投稿日時

更新日

更新日時