Files
rust_browser/investigations/freebsd/report.md
Zachary D. Rowitsch 72f4713923
All checks were successful
ci / fast (linux) (push) Successful in 7m14s
Implement CSS attr() function for content property (CSS 2.1 §12.2)
Add support for the attr() function in CSS content property values,
enabling patterns like `content: " (" attr(href) ")"` on ::before/::after
pseudo-elements. The implementation parses attr() at CSS parse time into
ContentValue::Items, then resolves attribute references against the DOM
during pseudo-element style computation, converting to ContentValue::String
before layout sees it.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-10 00:39:48 -04:00

7.7 KiB

Investigation: FreeBSD.org Homepage

URL: https://www.freebsd.org Last investigated: 2026-03-10

Summary

The FreeBSD homepage renders with excellent fidelity. All previously reported issues have been resolved. The page shows proper multi-column float layout, horizontal navigation bar, themed colors (#990000 dark red headings, #666666 nav text), styled buttons with rounded corners and colored backgrounds, the beastie mascot background image, the grey news container with four columns (Latest News, Upcoming Events, Press, Security Advisories), and a correctly positioned footer. The CSS attr() function (F-012) is now supported after implementation in this session.

Findings

F-001: CSS @import rules not supported

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: CSS Support
  • Severity: High
  • Description: The main stylesheet fixed.css consists entirely of @import statements that pull in 6 sub-stylesheets. The engine now fetches and applies all imported stylesheets correctly.
  • Evidence: Render log shows fetching of global.css, layout.css, text.css, navigation.css, table.css, and iefixes.css. All CSS rules are applied (colors, layout, backgrounds).

F-002: Flex item sizing causes header overflow

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Layout
  • Severity: High
  • Description: Flex content sizing for replaced elements (images) now respects specified dimensions from HTML width/height attributes, falling back to intrinsic size only when no specified size exists. The header donate/search section is now visible within the viewport.
  • Evidence: "Donate" text now renders at x=674 (within 800px viewport). The logo wrapper div correctly sizes based on the img width="457" attribute rather than the 914px intrinsic width.

F-003: @font-face rule parsing failure

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: CSS Support
  • Severity: Medium
  • Description: FreeBSD's font-awesome-min.css had font-weight and font-style descriptors outside the @font-face block (after the closing }). The parser now handles stray } tokens at the top level and during selector parsing, recovering gracefully instead of consuming subsequent rules as malformed selector text. The @font-face rule itself was already parsed correctly.
  • Evidence: No selector parse warnings in render log. The .fa and subsequent FontAwesome rules are now parsed correctly.

F-004: Navigation renders as vertical bulleted list instead of horizontal bar

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Layout
  • Severity: High
  • Description: The <nav> element now renders as a compact horizontal navigation bar with proper float-based layout. All top-level items (Home, About, Get FreeBSD, Documentation, Community, Developers, Support, Foundation) display horizontally with correct styling.
  • Evidence: Nav element (node #93) has content height 28.8px with items arranged horizontally. Text rendered in #666666 bold verdana at 14.4px, matching navigation.css rules.

F-005: Multi-column float layout not applied to content sections

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Layout
  • Severity: High
  • Description: Float-based multi-column layouts now work correctly. The feature area shows three columns (left content, middle with beastie, right with shortcuts/releases), and the news container has four columns. Clear properties work to separate sections.
  • Evidence: #frontfeatureleft (node #324) has width 216 (~30% of 720). Beastie background image renders at x=256. News columns appear at y=493 with proper column widths.

F-006: Body background image not rendered

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Display
  • Severity: Medium
  • Description: The body background image (hdr_fill.png) now renders correctly with repeat-x across the top of the page.
  • Evidence: Display list shows BackgroundImage rect=(0, 0, 800, 600) image_id=img#19 pos=(Zero,Zero) repeat=RepeatX.

F-007: Container width and centering not applied

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Layout
  • Severity: Medium
  • Description: The #container div now has proper width (90%) and centering via auto margins.
  • Evidence: Container div (node #61) has content width 720 with margin 0 40 0 40, correctly centered in the 800px viewport.
  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Display
  • Severity: Low
  • Description: Headings and links now render with the correct themed colors.
  • Evidence: H1 "The FreeBSD Project" renders in #990000 at 19.2px bold. Nav links render in #666666 bold. Body links render in #990000 with underlines.

F-009: "New to FreeBSD?" and "Download FreeBSD" buttons unstyled

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Display
  • Severity: Low
  • Description: The .frontgetroundbox buttons now display with correct styling: rounded corners (15px radius), colored backgrounds (#eeeeee for "New to FreeBSD?", #facc2e yellow for "Download FreeBSD"), and bold dark red text.
  • Evidence: Display list shows SolidRect rect=(466, 175.96, 325, 44.96) color=#eeeeee radii=(15,15,15,15) and SolidRect rect=(466, 230.92, 325, 44.96) color=#facc2e radii=(15,15,15,15).

F-010: News/Events/Press/Security columns missing grey background

  • Status: Fixed (2026-03-09)
  • Found: 2026-03-09
  • Category: Display
  • Severity: Low
  • Description: The news/events container now has the correct grey background.
  • Evidence: Display list shows SolidRect rect=(40, 493.54, 720, 512.47) color=#eeeeee.

F-011: overflow:hidden not creating BFC to contain floats

  • Status: Not a Bug
  • Found: 2026-03-09
  • Resolved: 2026-03-09
  • Category: Layout
  • Severity: N/A
  • Description: Originally reported as #content having overflow: hidden but height=0. Investigation revealed the actual FreeBSD CSS (layout.css) sets #content { clear: both; display: block; } — there is no overflow: hidden. Since #content does not establish a BFC, its height=0 is correct per CSS 2.1 spec (all meaningful children are floated and thus out-of-flow). The #frontnemscontainer has display: inline; float: left; width: 100% which is correctly blockified to display: block by CSS 2.1 §9.7 and positioned as a float. The page renders correctly: clear: both on the footer pushes it below all floats.
  • Evidence: FreeBSD layout.css contains #content { clear: both; display: block; } — no overflow property. BFC float containment was verified working correctly via 7 regression tests in crates/layout/src/tests/bfc_float_containment_tests.rs.

F-012: CSS content: attr() function not supported

  • Status: Fixed (2026-03-10)
  • Found: 2026-03-09
  • Category: CSS Support
  • Severity: Low
  • Description: The CSS content: attr(title) declaration in global.css previously failed to parse. This has been resolved by implementing full attr() function support in the CSS parser and style computation pipeline, including content lists like content: "prefix" attr(name) "suffix".
  • Evidence: The parse_content_value function now handles attr() tokens, producing ContentValue::Items which is resolved against DOM attributes during pseudo-element style computation. No parse warnings for content: attr(title) in the current render.

Stats

Status High Medium Low Total
Open 0 0 0 0
Fixed 4 3 4 11