From fef26c159c7f426d7f6331b31e6d4119e47a9188 Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Tue, 26 Apr 2022 11:14:01 +0800
Subject: [PATCH] Fix two UI bugs: JS error in imagediff.js, 500 error in
 diff/compare.tmpl

Co-authored-by: 6543 <6543@obermui.de>
---
 templates/repo/diff/compare.tmpl |  2 +-
 web_src/js/features/imagediff.js | 15 +++++++++++----
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/templates/repo/diff/compare.tmpl b/templates/repo/diff/compare.tmpl
index 4517f0029c..743eaa2efa 100644
--- a/templates/repo/diff/compare.tmpl
+++ b/templates/repo/diff/compare.tmpl
@@ -191,7 +191,7 @@
 				<div class="twelve wide column issue-title">
 					{{.i18n.Tr "repo.pulls.has_pull_request" (Escape $.RepoLink) (Escape $.RepoRelPath) .PullRequest.Index | Safe}}
 					<h1>
-						<span id="issue-title">{{RenderIssueTitle .PullRequest.Issue.Title $.RepoLink $.Repository.ComposeMetas}}</span>
+						<span id="issue-title">{{RenderIssueTitle $.Context .PullRequest.Issue.Title $.RepoLink $.Repository.ComposeMetas}}</span>
 						<span class="index">#{{.PullRequest.Issue.Index}}</span>
 					</h1>
 				</div>
diff --git a/web_src/js/features/imagediff.js b/web_src/js/features/imagediff.js
index 6fd2ba6c36..1745331768 100644
--- a/web_src/js/features/imagediff.js
+++ b/web_src/js/features/imagediff.js
@@ -4,10 +4,12 @@ function getDefaultSvgBoundsIfUndefined(svgXml, src) {
   const DefaultSize = 300;
   const MaxSize = 99999;
 
-  const svg = svgXml.rootElement;
-
-  const width = svg.width.baseVal;
-  const height = svg.height.baseVal;
+  const svg = svgXml.documentElement;
+  const width = svg?.width?.baseVal;
+  const height = svg?.height?.baseVal;
+  if (width === undefined || height === undefined) {
+    return null; // in case some svg is invalid or doesn't have the width/height
+  }
   if (width.unitType === SVGLength.SVG_LENGTHTYPE_PERCENTAGE || height.unitType === SVGLength.SVG_LENGTHTYPE_PERCENTAGE) {
     const img = new Image();
     img.src = src;
@@ -29,6 +31,7 @@ function getDefaultSvgBoundsIfUndefined(svgXml, src) {
       height: DefaultSize
     };
   }
+  return null;
 }
 
 export default function initImageDiff() {
@@ -88,6 +91,10 @@ export default function initImageDiff() {
             info.$image.on('load', () => {
               info.loaded = true;
               setReadyIfLoaded();
+            }).on('error', () => {
+              info.loaded = true;
+              setReadyIfLoaded();
+              info.$boundsInfo.text('(image error)');
             });
             info.$image.attr('src', info.path);