Merge branch 'develop' into release/v4.1.3

Author: DinetsV

.gitignore

@@ -19,3 +19,4 @@ coverage/
 .env
 *.zip
 .qodo
+.playwright-mcp/

modules/remediation/actions/attribute.php

@@ -17,9 +17,10 @@ class Attribute extends Remediation_Base {
 	public static string $type = 'attribute';
 
 	public function run() : ?DOMDocument {
-		$element_node = $this->data['global']
-			? $this->get_element_by_xpath_with_snippet_fallback( $this->data['xpath'], $this->data['find'] )
-			: $this->get_element_by_xpath( $this->data['xpath'] );
+		$element_node = $this->get_element_by_xpath_with_snippet_fallback(
+			$this->data['xpath'] ?? null,
+			$this->data['find'] ?? null
+		);
 
 		if ( ! $element_node ) {
 			$this->use_frontend = true;

modules/remediation/actions/replace.php

@@ -17,9 +17,10 @@ class Replace extends Remediation_Base {
 	public static string $type = 'replace';
 
 	public function run() : ?DOMDocument {
-		$element_node = $this->data['global']
-			? $this->get_element_by_xpath_with_snippet_fallback( $this->data['xpath'], $this->data['find'] )
-			: $this->get_element_by_xpath( $this->data['xpath'] );
+		$element_node = $this->get_element_by_xpath_with_snippet_fallback(
+			$this->data['xpath'] ?? null,
+			$this->data['find'] ?? null
+		);
 
 		if ( ! $element_node instanceof \DOMElement ) {
 			$this->use_frontend = true;

modules/remediation/assets/js/actions/attribute.js

@@ -8,14 +8,11 @@ export class AttributeRemediation extends RemediationBase {
 			action,
 			attribute_name: attributeName,
 			attribute_value: attributeValue,
-			global: isGlobal,
+			find,
 		} = this.data;
 
 		const xpath = originXpath.replace('svg', "*[name()='svg']");
-		const el =
-			isGlobal === '1'
-				? this.getElementByXPathFallbackSnippet(find, xpath)
-				: this.getElementByXPath(xpath);
+		const el = this.getElementByXPathFallbackSnippet(find, xpath);
 		if (!el) {
 			return false;
 		}

modules/remediation/assets/js/actions/base.js

@@ -37,35 +37,36 @@ export class RemediationBase {
 	}
 
 	getElementByXPathFallbackSnippet(snippet, xpath = null) {
-		// Try XPath first
-		if (xpath) {
-			const element = this.getElementByXPath(xpath);
-			if (element) {
-				// Pick the one whose outerHTML best matches the snippet
-				const normalizedSnippet = snippet
-					.replace(/\s+/g, ' ')
-					.trim()
-					.toLowerCase();
-				const html = element.outerHTML
-					.replace(/\s+/g, ' ')
-					.trim()
-					.toLowerCase();
-				if (html.includes(normalizedSnippet)) {
-					return element;
-				}
+		const xpathElement = xpath ? this.getElementByXPath(xpath) : null;
+		const hasSnippet = typeof snippet === 'string' && snippet.trim() !== '';
+
+		if (xpathElement && hasSnippet) {
+			const normalizedSnippet = snippet
+				.replace(/\s+/g, ' ')
+				.trim()
+				.toLowerCase();
+			const html = xpathElement.outerHTML
+				.replace(/\s+/g, ' ')
+				.trim()
+				.toLowerCase();
+			if (html.includes(normalizedSnippet)) {
+				return xpathElement;
 			}
 		}
 
+		if (!hasSnippet) {
+			return xpathElement || null;
+		}
+
 		const parser = new DOMParser();
 		const doc = parser.parseFromString(snippet.trim(), 'text/html');
 		const parsed = doc.body.firstElementChild;
 		if (!parsed) {
-			return null;
+			return xpathElement || null;
 		}
 
 		const selectorParts = [parsed.tagName.toLowerCase()];
 
-		// Add id and class if present
 		if (parsed.id) {
 			selectorParts.push(`#${parsed.id}`);
 		}
@@ -75,8 +76,7 @@ export class RemediationBase {
 
 		const selector = selectorParts.join('');
 
-		// Try to find it in the document
-		return document.querySelector(selector);
+		return document.querySelector(selector) || xpathElement || null;
 	}
 
 	createElement(tag, attributes = [], content = '') {

modules/remediation/assets/js/actions/replace.js

@@ -14,11 +14,8 @@ export class ReplaceRemediation extends RemediationBase {
 	}
 
 	run() {
-		const { xpath, find, replace, global: isGlobal } = this.data;
-		const el =
-			isGlobal === '1'
-				? this.getElementByXPathFallbackSnippet(find, xpath)
-				: this.getElementByXPath(xpath);
+		const { xpath, find, replace } = this.data;
+		const el = this.getElementByXPathFallbackSnippet(find, xpath);
 
 		if (!el) {
 			return false;

modules/remediation/classes/remediation-base.php

@@ -34,6 +34,18 @@ public function exists(): bool {
 		return $this->get_element_by_xpath( $this->data['xpath'] ) instanceof DOMElement;
 	}
 
+	/**
+	 * Check if the element exists using XPath with a snippet-based fallback.
+	 *
+	 * @return boolean
+	 */
+	public function exists_with_fallback(): bool {
+		return $this->get_element_by_xpath_with_snippet_fallback(
+			$this->data['xpath'] ?? null,
+			$this->data['find'] ?? null
+		) instanceof DOMElement;
+	}
+
 	/**
 	 * get_element_by_xpath
 	 * @param $xpath
@@ -60,18 +72,20 @@ public function get_element_by_xpath( $query ) {
 	 * @return DOMElement|null
 	 */
 	public function get_element_by_xpath_with_snippet_fallback( ?string $xpath, ?string $snippet ): ?DOMElement {
-		if ( ! $xpath ) {
-			return null;
+		$element = $xpath ? $this->get_element_by_xpath( $xpath ) : null;
+
+		// Without a snippet we can't validate or fall back, so return whatever XPath found.
+		if ( null === $snippet || '' === $snippet ) {
+			return $element instanceof DOMElement ? $element : null;
 		}
 
-		$element  = $this->get_element_by_xpath( $xpath );
-		if ( $element && ! $this->element_contains_snippet( $element, $snippet ) ) {
-			// XPath result doesn't contain the snippet
+		// If XPath found an element but its outer HTML doesn't contain the snippet, discard it.
+		if ( $element instanceof DOMElement && ! $this->element_contains_snippet( $element, $snippet ) ) {
 			$element = null;
 		}
 
-		// Fallback to snippet-based search
-		if ( ! $element ) {
+		// Fallback to snippet-based search.
+		if ( ! $element instanceof DOMElement ) {
 			$element = $this->get_element_by_snippet( $snippet );
 		}
 
@@ -161,8 +175,9 @@ public function create_element( $data ) : DomElement {
 	public function __construct( DOMDocument $dom, $data ) {
 		$this->dom = $dom;
 		$this->data = $data;
-		// if it's not global and not styles and element does not exist, move the remediation to the Frontend
-		if ( 'STYLES' !== $this->data['type'] && ! $this->data['global'] && ! $this->exists() ) {
+		// If it's not styles and the element can't be found by XPath or the snippet fallback,
+		// move the remediation to the Frontend so a later DOM state can pick it up.
+		if ( 'STYLES' !== $this->data['type'] && ! $this->exists_with_fallback() ) {
 			$this->use_frontend = true;
 			return;
 		}

package-lock.json

@@ -68,7 +68,7 @@
 		"focus-trap-react": "^11.0.4",
 		"get-xpath": "^3.3.0",
 		"html-react-parser": "^5.2.2",
-		"mixpanel-browser": "^2.58.0",
+		"mixpanel-browser": "^2.80.0",
 		"postcss": "^8.5.6",
 		"prop-types": "^15.8.1",
 		"react-colorful": "^5.6.1",