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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elementor/editor-audits",
-  "version": "4.4.0-1106",
+  "version": "4.4.0-1107",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -39,21 +39,21 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor": "4.4.0-1106",
-    "@elementor/editor-mcp": "4.4.0-1106",
-    "@elementor/editor-app-bar": "4.4.0-1106",
-    "@elementor/editor-elements": "4.4.0-1106",
-    "@elementor/editor-floating-panels": "4.4.0-1106",
-    "@elementor/editor-notifications": "4.4.0-1106",
-    "@elementor/editor-props": "4.4.0-1106",
-    "@elementor/editor-styles": "4.4.0-1106",
-    "@elementor/editor-v1-adapters": "4.4.0-1106",
-    "@elementor/events": "4.4.0-1106",
-    "@elementor/http-client": "4.4.0-1106",
+    "@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-1106",
-    "@elementor/session": "4.4.0-1106",
-    "@elementor/store": "4.4.0-1106",
+    "@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/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/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,6 +12,7 @@ import {
 	type PageAuditReport,
 } from './types';
 import { computeReport } from './utils/compute-report';
+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';
@@ -22,9 +23,12 @@ export async function runPageAudit( documentId: number ): Promise< PageAuditRepo
 	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,6 +40,8 @@ export type AuditViolation = {
 	angieFix?: boolean;
 	angiePrompt?: string;
 	ctaLabel?: string;
+	secondaryCtaLabel?: string;
+	secondaryCtaUrl?: string;
 };
 
 export type PageContextResponse = {
@@ -66,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;
@@ -109,6 +114,7 @@ export type AuditContext = {
 	elements: ElementsModelSnapshot;
 	pageContext: PageContextResponse;
 	kit: KitSnapshot;
+	renderedHtml: string | null;
 };
 
 export type PageAuditReport = {

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 ) );
+}