From b9e047f0fff5458f90318c7b32338603f23704a7 Mon Sep 17 00:00:00 2001
From: Richard van der Hoff <richard@matrix.org>
Date: Wed, 30 Aug 2017 09:59:02 +0100
Subject: [PATCH] Avoid breaking /sync with uncaught exceptions

For reasons I don't fully understand, it appears that sometimes the
ReadReceiptMarker has no offsetParent. Rather than dying with an uncaught
exception when that happens (and taking out half of React as well as the /sync
handler), log a warning and suppress the animation.
---
 .../views/rooms/ReadReceiptMarker.js          | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/views/rooms/ReadReceiptMarker.js b/src/components/views/rooms/ReadReceiptMarker.js
index 64b54fe1e1..44d1e651d7 100644
--- a/src/components/views/rooms/ReadReceiptMarker.js
+++ b/src/components/views/rooms/ReadReceiptMarker.js
@@ -123,7 +123,19 @@ module.exports = React.createClass({
         }
 
         var newElement = ReactDOM.findDOMNode(this);
-        var startTopOffset = oldTop - newElement.offsetParent.getBoundingClientRect().top;
+        let startTopOffset;
+        if (!newElement.offsetParent) {
+            // this seems to happen sometimes for reasons I don't understand
+            // the docs for `offsetParent` say it may be null if `display` is
+            // `none`, but I can't see why that would happen.
+            console.warn(
+                `ReadReceiptMarker for ${this.props.member.userId} in ` +
+                `${this.props.member.roomId} has no offsetParent`,
+            );
+            startTopOffset = 0;
+        } else {
+            startTopOffset = oldTop - newElement.offsetParent.getBoundingClientRect().top;
+        }
 
         var startStyles = [];
         var enterTransitionOpts = [];
@@ -131,13 +143,12 @@ module.exports = React.createClass({
         if (oldInfo && oldInfo.left) {
             // start at the old height and in the old h pos
 
-            var leftOffset = oldInfo.left;
             startStyles.push({ top: startTopOffset+"px",
                                left: oldInfo.left+"px" });
 
             var reorderTransitionOpts = {
                 duration: 100,
-                easing: 'easeOut'
+                easing: 'easeOut',
             };
 
             enterTransitionOpts.push(reorderTransitionOpts);
@@ -175,7 +186,7 @@ module.exports = React.createClass({
         if (this.props.timestamp) {
             title = _t(
                 "Seen by %(userName)s at %(dateTime)s",
-                {userName: this.props.member.userId, dateTime: DateUtils.formatDate(new Date(this.props.timestamp), this.props.showTwelveHour)}
+                {userName: this.props.member.userId, dateTime: DateUtils.formatDate(new Date(this.props.timestamp), this.props.showTwelveHour)},
             );
         }