@elementor/editor-audits 4.4.0-1105 → 4.4.0-1107

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elementor/editor-audits",
-  "version": "4.4.0-1105",
+  "version": "4.4.0-1107",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -39,19 +39,21 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor": "4.4.0-1105",
-    "@elementor/editor-mcp": "4.4.0-1105",
-    "@elementor/editor-app-bar": "4.4.0-1105",
-    "@elementor/editor-elements": "4.4.0-1105",
-    "@elementor/editor-floating-panels": "4.4.0-1105",
-    "@elementor/editor-notifications": "4.4.0-1105",
-    "@elementor/editor-v1-adapters": "4.4.0-1105",
-    "@elementor/events": "4.4.0-1105",
-    "@elementor/http-client": "4.4.0-1105",
+    "@elementor/editor": "4.4.0-1107",
+    "@elementor/editor-mcp": "4.4.0-1107",
+    "@elementor/editor-app-bar": "4.4.0-1107",
+    "@elementor/editor-elements": "4.4.0-1107",
+    "@elementor/editor-floating-panels": "4.4.0-1107",
+    "@elementor/editor-notifications": "4.4.0-1107",
+    "@elementor/editor-props": "4.4.0-1107",
+    "@elementor/editor-styles": "4.4.0-1107",
+    "@elementor/editor-v1-adapters": "4.4.0-1107",
+    "@elementor/events": "4.4.0-1107",
+    "@elementor/http-client": "4.4.0-1107",
     "@elementor/icons": "~1.77.0",
-    "@elementor/locations": "4.4.0-1105",
-    "@elementor/session": "4.4.0-1105",
-    "@elementor/store": "4.4.0-1105",
+    "@elementor/locations": "4.4.0-1107",
+    "@elementor/session": "4.4.0-1107",
+    "@elementor/store": "4.4.0-1107",
     "@elementor/ui": "1.37.5"
   },
   "peerDependencies": {

package/src/api/page-context-client.ts

@@ -4,13 +4,16 @@ import { type PageContextResponse } from '../types';
 import { isNonceInvalidError, refreshAuditsNonce } from '../utils/session-expiration';
 import { getWindowConfig } from '../utils/window-config';
 
-export async function fetchPageContext( documentId: number, attachmentIds: number[] ): Promise< PageContextResponse > {
-	return requestPageContext( documentId, attachmentIds, true );
+export async function fetchPageContext(
+	documentId: number,
+	imageSizeRequests: string[]
+): Promise< PageContextResponse > {
+	return requestPageContext( documentId, imageSizeRequests, true );
 }
 
 async function requestPageContext(
 	documentId: number,
-	attachmentIds: number[],
+	imageSizeRequests: string[],
 	allowNonceRetry: boolean
 ): Promise< PageContextResponse > {
 	const { restNamespace, nonce } = getWindowConfig();
@@ -20,7 +23,7 @@ async function requestPageContext(
 		const response = await httpService().get< PageContextResponse >( url, {
 			params: {
 				document_id: documentId,
-				attachment_ids: attachmentIds,
+				image_size_requests: imageSizeRequests,
 			},
 			headers: { 'X-WP-Nonce': nonce },
 		} );
@@ -33,6 +36,6 @@ async function requestPageContext(
 
 		await refreshAuditsNonce();
 
-		return requestPageContext( documentId, attachmentIds, false );
+		return requestPageContext( documentId, imageSizeRequests, false );
 	}
 }

package/src/audits/accessibility-statement.ts

@@ -0,0 +1,39 @@
+import { __ } from '@wordpress/i18n';
+
+import { type Audit } from '../types';
+
+export const audit: Audit = {
+	id: 'audits/accessibility-statement',
+	title: __( 'Create an accessibility statement', 'elementor' ),
+	description: __(
+		'An accessibility statement showcases your efforts to create an inclusive online space, highlighting helpful features and a commitment to accessibility.',
+		'elementor'
+	),
+	fixHint: __( 'Use Ally to create and publish an accessibility statement for your site.', 'elementor' ),
+	categories: [ 'accessibility' ],
+	severity: 'info',
+	weight: 1,
+	evaluate: ( ctx ) => {
+		const isReady = ctx.pageContext.ally_plugin_active;
+
+		if ( isReady && ctx.pageContext.ally_accessibility_statement_created ) {
+			return { status: 'pass' };
+		}
+
+		return {
+			status: 'fail',
+			violations: [
+				{
+					auditId: audit.id,
+					label: __( 'No accessibility statement has been created for this site.', 'elementor' ),
+					externalUrl: isReady
+						? ctx.pageContext.ally_accessibility_statement_url
+						: ctx.pageContext.ally_plugin_url,
+					ctaLabel: isReady ? __( 'Create', 'elementor' ) : undefined,
+					secondaryCtaLabel: __( 'Learn more', 'elementor' ),
+					secondaryCtaUrl: 'https://go.elementor.com/acc-plg-learn-more',
+				},
+			],
+		};
+	},
+};

package/src/audits/accessibility-widget.ts

@@ -0,0 +1,41 @@
+import { __ } from '@wordpress/i18n';
+
+import { type Audit } from '../types';
+import { hasAccessibilityWidgetScript } from '../utils/scan-accessibility-widgets';
+
+export const audit: Audit = {
+	id: 'audits/accessibility-widget',
+	title: __( 'Add an accessibility widget', 'elementor' ),
+	description: __( 'Make your site more inclusive by adding an accessibility widget.', 'elementor' ),
+	fixHint: __( 'Activate Ally’s accessibility widget to give visitors on-page accessibility tools.', 'elementor' ),
+	categories: [ 'accessibility' ],
+	severity: 'info',
+	weight: 1,
+	evaluate: ( ctx ) => {
+		if ( ! ctx.pageContext.frontend_url ) {
+			return { status: 'skipped', reason: __( 'Page is not published.', 'elementor' ) };
+		}
+
+		if ( ! ctx.renderedHtml ) {
+			return { status: 'skipped', reason: __( 'Could not fetch the published page.', 'elementor' ) };
+		}
+
+		if ( hasAccessibilityWidgetScript( ctx.renderedHtml ) ) {
+			return { status: 'pass' };
+		}
+
+		const isReady = ctx.pageContext.ally_plugin_active;
+
+		return {
+			status: 'fail',
+			violations: [
+				{
+					auditId: audit.id,
+					label: __( 'No accessibility widget is active on this site.', 'elementor' ),
+					externalUrl: isReady ? ctx.pageContext.ally_widget_settings_url : ctx.pageContext.ally_plugin_url,
+					ctaLabel: __( 'Activate', 'elementor' ),
+				},
+			],
+		};
+	},
+};

package/src/audits/google-consent-mode.ts

@@ -1,7 +1,6 @@
 import { __ } from '@wordpress/i18n';
 
 import { type Audit } from '../types';
-import { fetchRenderedHtml } from '../utils/fetch-rendered-html';
 import { hasConsentDefaultCall, hasGoogleTracking } from '../utils/scan-consent-signals';
 
 export const audit: Audit = {
@@ -18,22 +17,20 @@ export const audit: Audit = {
 	categories: [ 'compliance' ],
 	severity: 'warning',
 	weight: 1,
-	evaluate: async ( ctx ) => {
+	evaluate: ( ctx ) => {
 		if ( ! ctx.pageContext.frontend_url ) {
 			return { status: 'skipped', reason: __( 'Page is not published.', 'elementor' ) };
 		}
 
-		const html = await fetchRenderedHtml( ctx.pageContext.frontend_url );
-
-		if ( ! html ) {
+		if ( ! ctx.renderedHtml ) {
 			return { status: 'skipped', reason: __( 'Could not fetch the published page.', 'elementor' ) };
 		}
 
-		if ( ! hasGoogleTracking( html ) ) {
+		if ( ! hasGoogleTracking( ctx.renderedHtml ) ) {
 			return { status: 'skipped', reason: __( 'No Google tracking product detected.', 'elementor' ) };
 		}
 
-		if ( hasConsentDefaultCall( html ) ) {
+		if ( hasConsentDefaultCall( ctx.renderedHtml ) ) {
 			return { status: 'pass' };
 		}
 

package/src/audits/images-too-large.ts

@@ -1,7 +1,11 @@
 import { __, sprintf } from '@wordpress/i18n';
 
-import { type Audit, type AuditViolation } from '../types';
-import { hasPageImages, walkImageLikeSources } from '../utils/image-like-sources';
+import { type Audit, type AuditViolation, type ElementSnapshotNode } from '../types';
+import { walkAtomicBackgroundImageSources } from '../utils/atomic-background-image-sources';
+import { walkAtomicImageSources } from '../utils/atomic-image-sources';
+import { walkBackgroundImageSources } from '../utils/background-image-sources';
+import { type ImageLikeMedia, walkImageLikeSources } from '../utils/image-like-sources';
+import { buildImageSizeKey } from '../utils/image-size-key';
 
 const SIZE_THRESHOLD_BYTES = 500 * 1024;
 const BYTES_PER_KB = 1024;
@@ -15,21 +19,22 @@ export const audit: Audit = {
 	severity: 'warning',
 	weight: 7,
 	evaluate: ( ctx ) => {
-		if ( ! hasPageImages( ctx.elements.tree ) ) {
-			return { status: 'skipped', reason: __( 'No images', 'elementor' ) };
-		}
-
 		const widgetMaxKb = new Map< string, number >();
 		let oversizedImageCount = 0;
+		let hasAnyImage = false;
+
+		const evaluateSource = ( node: ElementSnapshotNode, media: ImageLikeMedia ) => {
+			if ( media.id || media.url ) {
+				hasAnyImage = true;
+			}
 
-		walkImageLikeSources( ctx.elements.tree, ( { node, media } ) => {
 			const id = media.id;
 
 			if ( ! id ) {
 				return;
 			}
 
-			const size = ctx.pageContext.image_sizes[ id ];
+			const size = ctx.pageContext.image_sizes[ buildImageSizeKey( { id, size: media.size } ) ];
 
 			if ( ! size || size.filesize_bytes <= SIZE_THRESHOLD_BYTES ) {
 				return;
@@ -40,7 +45,16 @@ export const audit: Audit = {
 			const kb = Math.round( size.filesize_bytes / BYTES_PER_KB );
 			const currentMax = widgetMaxKb.get( node.id ) ?? 0;
 			widgetMaxKb.set( node.id, Math.max( currentMax, kb ) );
-		} );
+		};
+
+		walkImageLikeSources( ctx.elements.tree, ( { node, media } ) => evaluateSource( node, media ) );
+		walkBackgroundImageSources( ctx.elements.tree, ( { node, media } ) => evaluateSource( node, media ) );
+		walkAtomicImageSources( ctx.elements.tree, ( { node, media } ) => evaluateSource( node, media ) );
+		walkAtomicBackgroundImageSources( ctx.elements.tree, ( { node, media } ) => evaluateSource( node, media ) );
+
+		if ( ! hasAnyImage ) {
+			return { status: 'skipped', reason: __( 'No images', 'elementor' ) };
+		}
 
 		const violations: AuditViolation[] = Array.from( widgetMaxKb.entries() ).map( ( [ elementId, kb ] ) => ( {
 			auditId: audit.id,

package/src/components/violation-cta-button.tsx

@@ -4,9 +4,10 @@ import { Button } from '@elementor/ui';
 type Props = {
 	ctaLabel: string;
 	externalUrl: string;
+	variant?: 'outlined' | 'text';
 };
 
-export default function ViolationCtaButton( { ctaLabel, externalUrl }: Props ) {
+export default function ViolationCtaButton( { ctaLabel, externalUrl, variant = 'outlined' }: Props ) {
 	const handleClick = ( event: React.MouseEvent< HTMLButtonElement > ) => {
 		event.stopPropagation();
 		event.preventDefault();
@@ -15,7 +16,7 @@ export default function ViolationCtaButton( { ctaLabel, externalUrl }: Props ) {
 	};
 
 	return (
-		<Button variant="outlined" color="secondary" size="small" onClick={ handleClick }>
+		<Button variant={ variant } color="secondary" size="small" onClick={ handleClick }>
 			{ ctaLabel }
 		</Button>
 	);

package/src/components/violation-row.tsx

@@ -164,10 +164,19 @@ export default function ViolationRow( { audit, skipReason, violations }: Props )
 										/>
 									) }
 									{ violation.ctaLabel && violation.externalUrl ? (
-										<ViolationCtaButton
-											ctaLabel={ violation.ctaLabel }
-											externalUrl={ violation.externalUrl }
-										/>
+										<Box sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>
+											<ViolationCtaButton
+												ctaLabel={ violation.ctaLabel }
+												externalUrl={ violation.externalUrl }
+											/>
+											{ violation.secondaryCtaLabel && violation.secondaryCtaUrl && (
+												<ViolationCtaButton
+													ctaLabel={ violation.secondaryCtaLabel }
+													externalUrl={ violation.secondaryCtaUrl }
+													variant="text"
+												/>
+											) }
+										</Box>
 									) : (
 										<EyeIcon
 											className="violation-hover-icon"

package/src/register-audits.ts

@@ -1,4 +1,6 @@
 import * as accessibilityPolicy from './audits/accessibility-policy';
+import * as accessibilityStatement from './audits/accessibility-statement';
+import * as accessibilityWidget from './audits/accessibility-widget';
 import * as cookiePolicy from './audits/cookie-policy';
 import * as deepNesting from './audits/deep-nesting';
 import * as defaultDesignSystem from './audits/default-design-system';
@@ -48,6 +50,8 @@ const AUDITS: Audit[] = [
 
 	privacyPolicy.audit,
 	accessibilityPolicy.audit,
+	accessibilityStatement.audit,
+	accessibilityWidget.audit,
 	cookiePolicy.audit,
 	scanForCookies.audit,
 	googleConsentMode.audit,

package/src/runner.ts

@@ -12,19 +12,23 @@ import {
 	type PageAuditReport,
 } from './types';
 import { computeReport } from './utils/compute-report';
-import { extractAttachmentIds } from './utils/page-attachments';
+import { fetchRenderedHtml } from './utils/fetch-rendered-html';
+import { extractImageSizeRequests } from './utils/page-attachments';
 import { readKitSnapshot } from './utils/read-kit-snapshot';
 import { buildSnapshotTree } from './utils/v1-snapshot';
 
 export async function runPageAudit( documentId: number ): Promise< PageAuditReport > {
 	const tree = buildSnapshotTree( getElements() );
-	const attachmentIds = extractAttachmentIds( tree );
-	const pageContext = await fetchPageContext( documentId, attachmentIds );
+	const imageSizeRequests = extractImageSizeRequests( tree );
+	const pageContext = await fetchPageContext( documentId, imageSizeRequests );
 
 	const elements: ElementsModelSnapshot = { documentId, tree };
-	const kit: KitSnapshot = await readKitSnapshot( pageContext.kit_id );
+	const [ kit, renderedHtml ]: [ KitSnapshot, string | null ] = await Promise.all( [
+		readKitSnapshot( pageContext.kit_id ),
+		fetchRenderedHtml( pageContext.frontend_url ),
+	] );
 
-	const ctx: AuditContext = { documentId, elements, pageContext, kit };
+	const ctx: AuditContext = { documentId, elements, pageContext, kit, renderedHtml };
 	const registered = getRegisteredAudits();
 
 	const auditResults: AuditRun[] = await Promise.all(

package/src/types.ts

@@ -40,14 +40,17 @@ export type AuditViolation = {
 	angieFix?: boolean;
 	angiePrompt?: string;
 	ctaLabel?: string;
+	secondaryCtaLabel?: string;
+	secondaryCtaUrl?: string;
 };
 
 export type PageContextResponse = {
 	post_title: string | null;
 	post_excerpt: string | null;
 	featured_image_id: number | null;
+	/** Keyed by the composite `buildImageSizeKey` result (`"{attachmentId}:{size}"`), since one attachment can resolve to different files at different sizes. */
 	image_sizes: Record<
-		number,
+		string,
 		{
 			width: number;
 			height: number;
@@ -65,6 +68,9 @@ export type PageContextResponse = {
 	privacy_settings_url: string;
 	ally_plugin_active: boolean;
 	ally_plugin_url: string;
+	ally_accessibility_statement_created: boolean;
+	ally_accessibility_statement_url: string;
+	ally_widget_settings_url: string;
 	cookiez_plugin_active: boolean;
 	cookiez_plugin_url: string;
 	cookiez_plugin_installed: boolean;
@@ -108,6 +114,7 @@ export type AuditContext = {
 	elements: ElementsModelSnapshot;
 	pageContext: PageContextResponse;
 	kit: KitSnapshot;
+	renderedHtml: string | null;
 };
 
 export type PageAuditReport = {

package/src/utils/atomic-background-image-sources.ts

@@ -0,0 +1,56 @@
+import { getElementStyles } from '@elementor/editor-elements';
+import {
+	backgroundImageOverlayPropTypeUtil,
+	backgroundOverlayPropTypeUtil,
+	backgroundPropTypeUtil,
+} from '@elementor/editor-props';
+import { type StyleDefinition } from '@elementor/editor-styles';
+
+import { type ElementSnapshotNode } from '../types';
+import { extractAtomicImageMedia } from './atomic-image-sources';
+import { type ImageLikeMedia } from './image-like-sources';
+import { walkElements } from './walk';
+
+export type AtomicBackgroundImageSourceVisit = {
+	node: ElementSnapshotNode;
+	media: ImageLikeMedia;
+};
+
+export function walkAtomicBackgroundImageSources(
+	tree: ElementSnapshotNode[],
+	visit: ( source: AtomicBackgroundImageSourceVisit ) => void
+): void {
+	walkElements( tree, ( node ) => {
+		const styles = getElementStyles( node.id );
+
+		if ( ! styles ) {
+			return;
+		}
+
+		for ( const media of extractBackgroundImageMedia( styles ) ) {
+			visit( { node, media } );
+		}
+	} );
+}
+
+function extractBackgroundImageMedia( styles: Record< string, StyleDefinition > ): ImageLikeMedia[] {
+	const sources: ImageLikeMedia[] = [];
+
+	for ( const style of Object.values( styles ) ) {
+		for ( const variant of style.variants ) {
+			const background = backgroundPropTypeUtil.extract( variant.props.background );
+			const overlays = backgroundOverlayPropTypeUtil.extract( background?.[ 'background-overlay' ] ) ?? [];
+
+			for ( const overlay of overlays ) {
+				const imageOverlay = backgroundImageOverlayPropTypeUtil.extract( overlay );
+				const media = extractAtomicImageMedia( imageOverlay?.image );
+
+				if ( media ) {
+					sources.push( media );
+				}
+			}
+		}
+	}
+
+	return sources;
+}

package/src/utils/atomic-image-sources.ts

@@ -0,0 +1,62 @@
+import {
+	imageAttachmentIdPropType,
+	imagePropTypeUtil,
+	imageSrcPropTypeUtil,
+	stringPropTypeUtil,
+	urlPropTypeUtil,
+} from '@elementor/editor-props';
+
+import { type ElementSnapshotNode } from '../types';
+import { type ImageLikeMedia } from './image-like-sources';
+import { walkElements } from './walk';
+
+const ATOMIC_IMAGE_PROP_KEYS = [ 'image', 'poster' ] as const;
+
+export type AtomicImageSourceVisit = {
+	node: ElementSnapshotNode;
+	media: ImageLikeMedia;
+};
+
+export function walkAtomicImageSources(
+	tree: ElementSnapshotNode[],
+	visit: ( source: AtomicImageSourceVisit ) => void
+): void {
+	walkElements( tree, ( node ) => {
+		if ( node.elType !== 'widget' ) {
+			return;
+		}
+
+		for ( const key of ATOMIC_IMAGE_PROP_KEYS ) {
+			const media = extractAtomicImageMedia( node.settings[ key ] );
+
+			if ( media ) {
+				visit( { node, media } );
+			}
+		}
+	} );
+}
+
+export function extractAtomicImageMedia( imageProp: unknown ): ImageLikeMedia | null {
+	const image = imagePropTypeUtil.extract( imageProp );
+
+	if ( ! image ) {
+		return null;
+	}
+
+	const src = imageSrcPropTypeUtil.extract( image.src );
+
+	if ( ! src ) {
+		return null;
+	}
+
+	const id = imageAttachmentIdPropType.extract( src.id ) ?? undefined;
+	const url = urlPropTypeUtil.extract( src.url ) ?? undefined;
+
+	if ( ! id && ! url ) {
+		return null;
+	}
+
+	const size = stringPropTypeUtil.extract( image.size ) ?? undefined;
+
+	return { id, url, size };
+}

package/src/utils/background-image-sources.ts

@@ -0,0 +1,32 @@
+import { type ElementSnapshotNode } from '../types';
+import { type ImageLikeMedia } from './image-like-sources';
+import { walkElements } from './walk';
+
+const BACKGROUND_IMAGE_SETTING_KEYS = [
+	'background_image',
+	'background_hover_image',
+	'background_overlay_image',
+	'background_overlay_hover_image',
+	'_background_image',
+	'_background_hover_image',
+] as const;
+
+export type BackgroundImageSourceVisit = {
+	node: ElementSnapshotNode;
+	media: ImageLikeMedia;
+};
+
+export function walkBackgroundImageSources(
+	tree: ElementSnapshotNode[],
+	visit: ( source: BackgroundImageSourceVisit ) => void
+): void {
+	walkElements( tree, ( node ) => {
+		for ( const key of BACKGROUND_IMAGE_SETTING_KEYS ) {
+			const media = node.settings[ key ] as ImageLikeMedia | undefined;
+
+			if ( media?.id || media?.url ) {
+				visit( { node, media } );
+			}
+		}
+	} );
+}

package/src/utils/image-alt.ts

@@ -1,5 +1,6 @@
 import { type PageContextResponse } from '../types';
 import { type ImageLikeMedia } from './image-like-sources';
+import { buildImageSizeKey } from './image-size-key';
 
 export function hasMeaningfulAlt( media: ImageLikeMedia, pageContext: PageContextResponse ): boolean {
 	if ( ! media.id && ! media.url ) {
@@ -7,7 +8,8 @@ export function hasMeaningfulAlt( media: ImageLikeMedia, pageContext: PageContex
 	}
 
 	if ( media.id ) {
-		const alt = pageContext.image_sizes[ media.id ]?.alt ?? '';
+		const key = buildImageSizeKey( { id: media.id, size: media.size } );
+		const alt = pageContext.image_sizes[ key ]?.alt ?? '';
 		return alt.trim().length > 0;
 	}
 

package/src/utils/image-like-sources.ts

@@ -7,6 +7,7 @@ export type ImageLikeMedia = {
 	id?: number;
 	url?: string;
 	alt?: string;
+	size?: string;
 };
 
 export type ImageLikeSourceVisit = {
@@ -51,7 +52,7 @@ function collectMediaFromNode( node: ElementSnapshotNode ): ImageLikeMedia[] {
 	const image = node.settings.image as ImageLikeMedia | undefined;
 
 	if ( image?.id || image?.url ) {
-		sources.push( image );
+		sources.push( { ...image, size: node.settings.image_size as string | undefined } );
 	}
 
 	const gallery = ( node.settings.carousel ?? node.settings.gallery ?? node.settings.wp_gallery ) as
@@ -59,9 +60,11 @@ function collectMediaFromNode( node: ElementSnapshotNode ): ImageLikeMedia[] {
 		| undefined;
 
 	if ( Array.isArray( gallery ) ) {
+		const gallerySize = node.settings.thumbnail_size as string | undefined;
+
 		for ( const item of gallery ) {
 			if ( item?.id || item?.url ) {
-				sources.push( item );
+				sources.push( { ...item, size: gallerySize } );
 			}
 		}
 	}

package/src/utils/image-size-key.ts

@@ -0,0 +1,8 @@
+export type ImageSizeRequest = {
+	id: number;
+	size?: string;
+};
+
+export function buildImageSizeKey( { id, size }: ImageSizeRequest ): string {
+	return `${ id }:${ size || 'full' }`;
+}

package/src/utils/page-attachments.ts

@@ -1,14 +1,23 @@
 import { type ElementSnapshotNode } from '../types';
-import { walkImageLikeSources } from './image-like-sources';
+import { walkAtomicBackgroundImageSources } from './atomic-background-image-sources';
+import { walkAtomicImageSources } from './atomic-image-sources';
+import { walkBackgroundImageSources } from './background-image-sources';
+import { type ImageLikeMedia, walkImageLikeSources } from './image-like-sources';
+import { buildImageSizeKey } from './image-size-key';
 
-export function extractAttachmentIds( tree: ElementSnapshotNode[] ): number[] {
-	const ids = new Set< number >();
+export function extractImageSizeRequests( tree: ElementSnapshotNode[] ): string[] {
+	const keys = new Set< string >();
 
-	walkImageLikeSources( tree, ( { media } ) => {
+	const collect = ( media: ImageLikeMedia ) => {
 		if ( media.id ) {
-			ids.add( media.id );
+			keys.add( buildImageSizeKey( { id: media.id, size: media.size } ) );
 		}
-	} );
+	};
 
-	return Array.from( ids ).sort( ( a, b ) => a - b );
+	walkImageLikeSources( tree, ( { media } ) => collect( media ) );
+	walkBackgroundImageSources( tree, ( { media } ) => collect( media ) );
+	walkAtomicImageSources( tree, ( { media } ) => collect( media ) );
+	walkAtomicBackgroundImageSources( tree, ( { media } ) => collect( media ) );
+
+	return Array.from( keys ).sort();
 }

package/src/utils/scan-accessibility-widgets.ts

@@ -0,0 +1,7 @@
+// Script sources of known accessibility widgets. Ally is listed first; append third-party
+// widget script sources here (UserWay, AccessiBe, EqualWeb, etc.) once confirmed.
+const ACCESSIBILITY_WIDGET_SCRIPT_SOURCES = [ 'cdn.elementor.com/a11y/widget.js' ];
+
+export function hasAccessibilityWidgetScript( html: string ): boolean {
+	return ACCESSIBILITY_WIDGET_SCRIPT_SOURCES.some( ( src ) => html.includes( src ) );
+}