2021.06でdivタグがどのように変更され、その理由は何か？
BuildVu-HTMLの2021.06リリースでは、テキスト要素がdivタグからspanタグに変更されました。また、関連するCSSを持つ親コンテナ要素も追加されました。
<style class="shared-css" type="text/css" >
.t {
transform-origin: bottom left;
z-index: 2;
position: absolute;
white-space: pre;
overflow: visible;
line-height: 1.5;
}
</style>
<div id="t1_1" class="t s1_1">Some things never change</div>
<div id="t2_1" class="t s2_1">Never trust a dog to watch your food.</div>
<div id="t3_1" class="t s3_1">—</div>
<div id="t4_1" class="t s4_1">Patrick, age 10</div>
<style class="shared-css" type="text/css" >
.t {
transform-origin: bottom left;
z-index: 2;
position: absolute;
white-space: pre;
overflow: visible;
line-height: 1.5;
}
.text-container {
white-space: pre;
}
@supports (-webkit-touch-callout: none) {
.text-container {
white-space: normal;
}
}
</style>
<div class="text-container"><span id="t1_1" class="t s1_1">Some things never change </span>
<span id="t2_1" class="t s2_1">Never trust a dog to watch your food. </span>
<span id="t3_1" class="t s3_1">—</span><span id="t4_1" class="t s4_1">Patrick, age 10 </span></div>
この変更により、テキストをコピー＆ペーストする際に誤って改行が挿入される問題の修正を含む、さまざまなメリットが得られます。これは、ブラウザがdiv要素をコピーする際に、要素の末尾に自動的に改行文字を挿入するためです。
さらに、テキスト要素間の改行を適切に検出して挿入する処理や、テキストブロックの末尾に必要なスペース文字を追加して正しくテキストを抽出できるようにする処理も追加されました。
この変更により、search.jsonファイル内で単語の途中を含む不必要な場所にスペース文字が挿入される問題も修正されました。
iOSとiPadOSのテキスト選択エンジンはやや最適化されておらず、絶対配置されたテキスト（PDFでのテキストの配置方法）の処理に苦労することがあります。
テキスト選択エンジンは、絶対配置されたテキスト内の改行を扱う際に特に苦労します。
このため、iOSとiPadOSでは改行を無視するCSSを追加しました。
改行のサポートに関わらず、spanタグへの切り替えはiOSとiPadOSでのテキスト抽出に影響しません。これは、他のブラウザとは異なり、iOS/iPadOSのSafariは絶対配置されたspanタグをコピーする際に、タグの末尾に改行文字を挿入するためです。
iOSの動作が理想的ではないことは認識しており、今後もこれを改善するためのアイデアを探求し続けます。