Fix: Escape output in Settings API - use wp_kses, replace script template with HTML template element

- Replace unescaped echo with wp_kses_post() in Settings_API::show_navigation()
- Switch repeater template from <script type="text/template"> to <template> element
- Update JS to use .get(0).innerHTML for <template> content retrieval
- Use wp_kses() with get_allowed_html() for repeater output
- Use wp_kses_post() for WYSIWYG field description
- Inline aria-current attribute in wizard step navigation
- Add <template> to allowed HTML tags in get_allowed_html()

Author: ajaydsouza

includes/admin/settings/class-settings-api.php

@@ -5,7 +5,7 @@
  * Functions to register, read, write and update settings.
  * Portions of this code have been inspired by Easy Digital Downloads, WordPress Settings Sandbox, WordPress Settings API class, etc.
  *
- * @package WebberZone\Contextual_Related_Posts
+ * @package    WebberZone\Contextual_Related_Posts
  */
 
 namespace WebberZone\Contextual_Related_Posts\Admin\Settings;
@@ -997,7 +997,7 @@ public function show_navigation() {
 
 		$html .= '</ul>';
 
-		echo $html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
+		echo wp_kses_post( $html );
 	}
 
 	/**

includes/admin/settings/class-settings-form.php

@@ -4,7 +4,7 @@
  *
  * @link  https://webberzone.com
  *
- * @package WebberZone\Contextual_Related_Posts
+ * @package    WebberZone\Contextual_Related_Posts
  */
 
 namespace WebberZone\Contextual_Related_Posts\Admin\Settings;
@@ -219,9 +219,9 @@ protected function get_allowed_html(): array {
 				'style'    => true,
 				'disabled' => true,
 			),
-			'em'       => array(
-				'style' => true,
-				'class' => true,
+			'template' => array(
+				'class'   => true,
+				'data-id' => true,
 			),
 		);
 
@@ -867,7 +867,7 @@ public function callback_wysiwyg( $args ) {
 
 		printf( '</div>' );
 
-		echo $this->get_field_description( $args ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
+		echo wp_kses_post( $this->get_field_description( $args ) );
 	}
 
 	/**
@@ -961,16 +961,16 @@ public function callback_repeater( $args ) {
 				<?php echo esc_html( ! empty( $args['add_button_text'] ) ? $args['add_button_text'] : 'Add Item' ); ?>
 			</button>
 
-			<script type="text/template" class="repeater-template" data-id="<?php echo esc_attr( $args['id'] ); ?>">
+			<template class="repeater-template" data-id="<?php echo esc_attr( $args['id'] ); ?>">
 				<?php $this->render_repeater_item( $args, '{{INDEX}}' ); ?>
-			</script>
+			</template>
 		</div>
 		<?php
 		$html  = ob_get_clean();
 		$html .= $this->get_field_description( $args );
 
 		/** This filter has been defined in class-settings-api.php */
-		echo apply_filters( $this->prefix . '_after_setting_output', $html, $args ); // phpcs:ignore WordPress.NamingConventions.PrefixAllGlobals.DynamicHooknameFound,WordPress.Security.EscapeOutput.OutputNotEscaped -- Contains <script type="text/template"> which wp_kses would strip.
+		echo wp_kses( apply_filters( $this->prefix . '_after_setting_output', $html, $args ), $this->get_allowed_html() ); // phpcs:ignore WordPress.NamingConventions.PrefixAllGlobals.DynamicHooknameFound
 	}
 
 	/**

includes/admin/settings/class-settings-wizard-api.php

@@ -5,7 +5,7 @@
  * A reusable API class for creating multi-step settings wizards.
  * This class provides the framework for creating guided setup experiences.
  *
- * @package WebberZone\Contextual_Related_Posts
+ * @package    WebberZone\Contextual_Related_Posts
  */
 
 namespace WebberZone\Contextual_Related_Posts\Admin\Settings;
@@ -837,7 +837,6 @@ protected function render_wizard_steps_navigation() {
 				$step_config  = $this->steps[ $step_key ];
 				$is_current   = $step_number === $this->current_step;
 				$is_completed = $step_number < $this->current_step;
-				$aria_current = $is_current ? ' aria-current="step"' : '';
 				$class_parts  = array();
 
 				if ( $is_current ) {
@@ -848,7 +847,7 @@ protected function render_wizard_steps_navigation() {
 
 				$class = implode( ' ', $class_parts );
 				?>
-				<li class="<?php echo esc_attr( $class ); ?>"<?php echo $aria_current; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>>
+				<li class="<?php echo esc_attr( $class ); ?>"<?php echo $is_current ? ' aria-current="step"' : ''; ?>>
 					<?php if ( $is_completed ) : ?>
 						<a href="<?php echo esc_url( $this->get_step_url( $step_number ) ); ?>" class="step-link">
 							<span class="step-number"><?php echo esc_html( (string) $step_number ); ?></span>

includes/admin/settings/js/settings-admin-scripts.js

@@ -79,7 +79,11 @@ jQuery(document).ready(function ($) {
 
 		// Add Item.
 		wrapper.on('click', '.add-item', function () {
-			var template = wrapper.find('.repeater-template').html();
+			var templateEl = wrapper.find('.repeater-template').get(0);
+			if (!templateEl) {
+				return;
+			}
+			var template = templateEl.innerHTML;
 			var uniqueId = 'row_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9);
 			template = template.replace(/{{INDEX}}/g, index);
 			template = template.replace(/{{ROW_ID}}/g, uniqueId);