Merge pull request #1323 from drgrice1/bugfix/feedback-in-image-displaymode

Fix feedback previews when the display mode is "images".

Author: dlglin

lib/WeBWorK/PG.pm

@@ -160,19 +160,12 @@ sub new_helper ($invocant, %options) {
 		);
 	}
 
-	# HTML_dpng uses an ImageGenerator. We have to render the queued equations.  This must be done before the post
-	# processing, since the image tags output by the image generator initially include markers which are invalid html.
-	# Mojo::DOM will change these markers into attributes with values and this will fail.
-	if ($image_generator) {
-		$image_generator->render(
-			refresh   => $options{refreshMath2img} // 0,
-			body_text => $translator->r_text,
-		);
-	}
-
 	$translator->post_process_content if ref($translator->{rh_pgcore}) eq 'PGcore';
 	$translator->stringify_answers;
 
+	$image_generator->render(body_text => $translator->r_text, refresh => $options{refreshMath2img} // 0)
+		if $image_generator;
+
 	# Add the result summary set in post processing into the result.
 	$result->{summary} = $translator->{rh_pgcore}{result_summary}
 		if ref($translator->{rh_pgcore}) eq 'PGcore'

lib/WeBWorK/PG/ImageGenerator.pm

@@ -250,8 +250,8 @@ sub add ($self, $string, $mode = 'inline') {
 	# Determine what the image's "number" is.
 	if ($useCache) {
 		$imageNum            = $self->{equationCache}->lookup($realString);
-		$aligntag            = 'MaRkEr' . $imageNum if $self->{useMarkers};
-		$depths->{$imageNum} = 'none'               if $self->{store_depths};
+		$aligntag            = qq{data-imagegen-alignment-marker="$imageNum"} if $self->{useMarkers};
+		$depths->{$imageNum} = 'none'                                         if $self->{store_depths};
 		# Insert a slash after 2 characters.  This effectively divides the images into 16^2 = 256 subdirectories.
 		substr($imageNum, 2, 0) = '/';
 	} else {
@@ -461,11 +461,16 @@ sub fix_markers ($self) {
 
 	my %depths = %{ $self->{depths} };
 	for my $depthkey (keys %depths) {
+		# The data-imagegen-alignment-marker value may be quoted with double quotes or with " if the image is
+		# inside another HTML element attribute (such as for images in the feedback button).  So both quote types need
+		# to be checked, and the replaced style attribute needs to use the same quoting that it comes in with.
 		if ($depths{$depthkey} eq 'none') {
-			${ $self->{body_text} } =~ s/MaRkEr$depthkey/style="vertical-align:$self->{dvipng_align}"/g;
+			${ $self->{body_text} } =~
+				s/data-imagegen-alignment-marker=("|")$depthkey\1/style=$1vertical-align:$self->{dvipng_align}$1/g;
 		} else {
 			my $ndepth = 0 - $depths{$depthkey};
-			${ $self->{body_text} } =~ s/MaRkEr$depthkey/style="vertical-align:${ndepth}px"/g;
+			${ $self->{body_text} } =~
+				s/data-imagegen-alignment-marker=("|")$depthkey\1/style=$1vertical-align:${ndepth}px$1/g;
 		}
 	}
 	return;