feat(cli): flag text occluded by opaque elements in inspect (#1435)

mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-10 22:20:14 +00:00

The layout audit only reported boxes that overflow their container; text
that fits perfectly but is painted over by a later sibling or overlay was
never caught. Add a text_occluded check that sweeps a grid across each text
box (three rows x nine columns) and, via elementFromPoint, flags text whose
topmost element is an unrelated opaque element (raster content, background
image, or a solid background at near-full opacity). Low-opacity overlays
such as scrims and grain are exempt. Opt out of intentional layering with
data-layout-allow-occlusion.

The two *.browser.js audit scripts are added to the fallow entry list: they
are injected by path via page.addScriptTag, so they have no import-graph
referrer.

Co-authored-by: Miguel Ángel <miguel07alm@protonmail.com>

This commit is contained in:

Leopold T

2026-06-15 11:05:12 -04:00

committed by

GitHub

co-authored by

Miguel Ángel

parent 3f3293da86

commit 1e54827957

5 changed files with 218 additions and 3 deletions

									
										packages/cli/src/utils/layoutAudit.ts
									
		+2
		-1
	
												View File
												
				@@ -14,7 +14,8 @@ export type LayoutIssueCode =

				  | "clipped_text"

				  | "canvas_overflow"

				  | "container_overflow"

				  | "content_overlap";

				  | "content_overlap"

				  | "text_occluded";

				export type LayoutIssueSeverity = "error" | "warning" | "info";