Unexpected end of JSON with html query parameter

[jremen]

Hi, I have some shortcode in the widget I would like to use, however I get „Unexpected end of JSON“ error when trying for HTML output. It seems like the HTML is not escaped and thus some of the parts of it (brackets, double quotes etc) are interpreted as an part of JSON.

My shortcode:

`<?php

function ms_languages( $atts ) {
$regions = array(
'europe' => __( 'Europe', 'ms' ),
'asia' => __( 'Asia', 'ms' ),
'mideast' => __( 'Middle East', 'ms' ),
'america' => __( 'America', 'ms' ),
);

$atts = shortcode_atts(
	array(
		'europe_from'  => '0',
		'europe_to'    => '8',
		'asia_from'    => '0',
		'asia_to'      => '0',
		'mideast_from' => '0',
		'mideast_to'   => '0',
		'america_from' => '8',
		'america_to'   => '10',
	),
	$atts,
	'languages'
);


$languages = icl_get_languages();
foreach ( $languages as $lang ) {
		$lang_codes[]      = $lang['language_code'];
		$lang_flags[]      =
		get_template_directory_uri() . '/assets/images/flags/' . strtolower(
			preg_replace( '/.+?_/', '', $lang['default_locale'] )
		) . '.svg';
			$lang_urls[]   = $lang['url'];
			$lang_names[]  = $lang['native_name'];
			$lang_active[] = $lang['active'];
}
function create_menu( $region, $atts, $lang_urls, $lang_flags, $lang_codes, $lang_names, $lang_active ) {
	?>
	<ul>
		<?php
		for ( $i = $atts[ $region . '_from' ]; $i < $atts[ $region . '_to' ]; $i++ ) {
			?>
		<li class="Header__flags--item Header__flags--item-<?= esc_html( $lang_codes[ $i ] ) ?>" data-region="<?= esc_attr( $region ) ?>" lang="<?= esc_attr( $lang_codes[ $i ] ) ?>">
			<?php
			if ( ! $lang_active[ $i ] ) {
				?>
			<a class="Header__flags--item-link" href="<?= esc_url( $lang_urls[ $i ] ); ?>">
				<img class="Header__flags--item-flag" src="<?= esc_url( $lang_flags[ $i ] ) ?>" alt="<?= esc_attr( $lang_codes[ $i ] ) ?>" />
				<?= esc_html( $lang_names[ $i ] ) ?>
			</a>
				<?php
			} else {
				?>
			<span class="Header__flags--item-link active">
				<img class="Header__flags--item-flag" src="<?= esc_url( $lang_flags[ $i ] ) ?>" alt="<?= esc_attr( $lang_codes[ $i ] ) ?>" />
				<?= esc_html( $lang_names[ $i ] ) ?>
			</span>
				<?php
			}
			?>
		</li>
			<?php
		}
		?>
	</ul>
	<?php
}
ob_start();
?>

'; } } ?>

	<div class="Header__flags--mainmenu">
	<?php
	foreach ( $regions as $region => $name ) {
		if ( ! empty( $atts[ $region . '_from' ] || $atts[ $region . '_to' ] ) ) {
			?>
				<input class="input--region hidden" name="regions" type="radio" id="<?= esc_attr( $region ) ?>" />
				<?php
		}
	}
	?>
		<div class="Header__flags--region-switchers">
			<?php
			foreach ( $regions as $region => $name ) {
				if ( ! empty( $atts[ $region . '_from' ] || $atts[ $region . '_to' ] ) ) {
					?>
			<label class="Header__flags--region-switcher" for="<?= esc_attr( $region ) ?>"><?= esc_html( $name ) ?></label>
					<?php
				}
			}
			?>
		</div>
		<div class="Header__flags--regions">
			<?php

			foreach ( $regions as $region => $name ) {
				if ( ! empty( $atts[ $region . '_from' ] || $atts[ $region . '_to' ] ) ) {
					?>
				<div class="Header__flags--region Header__flags--region-<?= esc_html( $region ) ?>">
					<h4 class="Header__flags--region-title"><?= esc_html( $name ) ?></h4>
						<?php
							create_menu( $region, $atts, $lang_urls, $lang_flags, $lang_codes, $lang_names, $lang_active );
						?>
				</div>
					<?php
				}
			}
			?>
		</div>
	</div>
	</li>
	<!-- END OF LANGUAGE MENU -->
</ul>

Error:

WPGraphQL version: 1.8.2