Chromeの疑似クラス「:has()」がjQueryの「:has()」に悪影響を及ぼす問題が解決へ。Chromeは回避策実装、jQueryは新バージョンで対応

今回は「Chromeの疑似クラス「:has()」がjQueryの「:has()」に悪影響を及ぼす問題が解決へ。Chromeは回避策実装、jQueryは新バージョンで対応」についてご紹介します。

関連ワード (仕様、利用、解消等) についても参考にしながら、ぜひ本記事について議論していってくださいね。

本記事は、Publickey様で掲載されている内容を参考にしておりますので、より詳しく内容を知りたい方は、ページ下の元記事リンクより参照ください。


8月にリリースされたChrome 105で実装されたCSSの疑似クラス「:has()」が、jQueryに以前から備わっている「:has()」に悪影響を及ぼし、一定の条件下ではjQueryを使ったWebサイトが壊れるなどの問題を引き起こすことがあることを、9月の下記の記事で紹介しました。

参考:Chromeに実装された疑似クラス「:has()」がjQueryの「:has()」に悪影響、一定の条件下でWebサイトが壊れる可能性

その後、Chrome側ではこの問題に対応する回避策が実装され、一方のjQuery側でも先日リリースされたjQuery 3.6.2で対応が行われたことが明らかになりました。

Chrome、jQueryそしてCSS WGがそれぞれ対応

Chrome側での回避策は、「Issue 1358953: :has pseudo-class breaks jQuery custom selectors」で提起され、M107ビルドで修正されたと報告されています。

回避策についての議論を追っていくと、「:has() 」の引数がないときには無効(invalid)とする、という修正が行われたようです。これで完全ではないものの大半のケースで問題が解消される見通しとされています(Chrome 107が10月にリリース済みなので、すでにこの修正が入っているはず)。

またCSSワーキンググループのこの点について議論し、以下の解決を見たと報告されています(下記の結論は、Chromeの回避策である「:has()」を無効にするのとほぼ同様のこと(hasをunforgivingにする)を仕様にする、という意味だと理解しましたが、ちょっと自信がありません……)。

RESOLVED: Make has unforgiving RESOLVED: Limit forgiving behavior to :is and :where and remove it everywhere else

そして12月13日にリリースされたjQuery 3.6.2でも、この:hasの悪影響に対応した修正が行われました。

fig

jQuery 3.6.2 :has arrived! https://t.co/zcLcTUfW8H

— jquery (@jquery) December 13, 2022

jQuery 3.6.2の対応によって、以前のChromeであっても問題が発生しないようになったため、既存のjQueryを利用しているWebサイトがあれば、最新のjQueryへ入れ替えることを検討されてはいかがでしょうか。

COMMENTS


Recommended

TITLE
CATEGORY
DATE
業界特化のデータ保護を提供、セキュリティ対策の強化を支援–ヴィーム・古館社長
IT関連
2023-01-06 07:33
「チェンソーマン」作者の新作読み切り「ルックバック」、一晩で閲覧120万超え 「ジャンプ+」で無料公開中
くらテク
2021-07-20 20:14
マイクロソフト「Teams」の「ダイナミックビュー」がパブリックプレビューに
IT関連
2021-04-26 09:12
増える仮想通貨への投資–慎重な姿勢の金融機関と規制当局
IT関連
2022-02-25 15:58
Zoom、開発者向けに「Video SDK」やポータルサイトなど充実
IT関連
2021-03-23 06:34
モンテール、基幹システムを超高速開発手法で刷新–業務部門の要望反映で操作性を向上
IT関連
2023-01-26 02:31
富士通とNTTドコモ、ローカル/パブリック5G環境を相互接続するハイブリッドネットワークを構築
IT関連
2021-07-19 17:35
MySQL HeatWaveの性能をトヨタ自動車ら3社が他社DBと実際に比較検証。ファンコミュニケーションズは「とにかく速くなった」と評価。Oracle Cloud Days 2021[PR]
HeatWave
2022-01-20 03:21
社内リソースにこだわらない──開発2週間で公開したヤフー「混雑予想」誕生秘話 (1/2 ページ)
くわしく
2021-02-01 11:19
Apple、WWDC21のDigital Lounge登録受付を開始
IT関連
2021-06-03 16:02
お寺のデジタル化サービスが提供–本堂と別館をつなぐシステムなど
IT関連
2022-04-16 20:34
SAPジャパンとグロービス、グローバルな営業力を強化する研修プログラム開発
IT関連
2021-03-12 05:22
F5、NGINXの開発チームをロシア国外へ移転させたことを報告。開発を立て直しリリースサイクルも元通りに
Nginx
2022-05-16 02:23
部屋の模様替えのデザイン検討や家具の購入もできるプラットフォーム「The Landing」
ネットサービス
2021-02-27 12:52