Bug 311750 – A quirksmode.org page fails to render correctly in Safari

• Component: CSS
• Status: RESOLVED DUPLICATE

[Simon Fraser (smfr)]

The main content is missing on https://quirksmode.org/spelverkoop/ in Safari only.

Tested on macOS 26.4.

[Simon Fraser (smfr)]

See https://front-end.social/@ppk/116368493572121708

[Radar WebKit Bug Importer]

<rdar://problem/174344902>

[Simon Fraser (smfr)]

This looks like a :has() invalidation bug.

[Alexey Proskuryakov]

This reproduces in Safari 18.6, too.

[Karl Dubost]

Created attachment 478972 [details]
rendering in safari, firefox, chrome

Safari Technology Preview  26.0          21625.1.12
Firefox Nightly            151.0a1       15126.4.7
Google Chrome Canary       149.0.7780.0  7780.0

[Karl Dubost]

The CSS contains inside the html file:

  main:has(tbody:empty) {
    display: none;
  }

The tbody is populated by JavaScript when the page is loading

window.onload = function() {


	let wr = document.querySelector('tbody');

…
		let doel = wr;

…
			wr.appendChild(tr)


}

So I guess the main:has(tbody:empty) is not checked again when the content is changed dynamically.

That should be verifiable with a div.

[Karl Dubost]

Created attachment 478973 [details]
testcase

The rendering should be green when this is working.

[Karl Dubost]

Created attachment 478974 [details]
testcase rendering in safari, firefox, chrome

Yup very simple testcase with divs.

[Peter-Paul Koch]

I left a comment in bug 286403. See also https://quirksmode.org/browserbugs/safari-has-empty.html

[Simon Fraser (smfr)]

*** This bug has been marked as a duplicate of bug 286403 ***