Recent searches
No recent searches
Uncaught TypeError: Cannot read properties of null (reading 'scrollHeight')
Answered
Posted Aug 03, 2023
Hi All,
I've created a Support app using REACT and everything works perfectly except the scroll bar that appears when the app is loaded.
I get an error message that displays:
Uncaught TypeError: Cannot read properties of null (reading 'scrollHeight')
When the app is loaded.
Info from my manifest file below:
"defaultLocale": "en",
"private": true,
"location": {
"support": {
"ticket_sidebar": {
"url": "assets/iframe.html",
"flexible": true,
"size": {
"height": "500px"
}
},
"new_ticket_sidebar": {
"url": "assets/iframe.html",
"flexible": true,
"size": {
"height": "500px"
}
}
}
},
"version": "1.0",
"frameworkVersion": "2.0"


0
3
3 comments
Gary Kester
Can anyone help please ;)
0
Gary Kester
Thanks - that doesnt work. funny that the app.js file in the dist folder includes css for an "overflow-y" property and I can modify that to "hidden" to hide it but dont know whats creating it
Following the error message, there's a function "getScrollTopAtBottom" that is using this property causing this error - see below
I note this code stack is using an old version of REACT and could be that
I()(tt()(r), "getScrollTopAtBottom", (function() {
var e = r._logo
, t = e ? e.clientHeight : 0;
return {
scrollTopAtBottom: r._container.current.scrollHeight - r._container.current.clientHeight - t - 10,
container: r._container.current
}
}
)),
I()(tt()(r), "scrollToBottom", (function() {
var e = r.props
, t = e.dispatch
, n = e.shouldScrollToBottom
, o = e.typingIndicatorShown
, i = r.getScrollTopAtBottom()
, a = i.container
, s = i.scrollTopAtBottom;
(Object(Vi.c)(r.props.replyActionsParentMessage).length > 0 || o) && (s += 10),
a.scrollTop = s,
n && t(Object(ve.u)(!1))
}
)),
I()(tt()(r), "updateScrollPosition", (function(e, t) {
var n = r.getScrollTopAtBottom()
, o = n.container
, i = n.scrollTopAtBottom <= o.scrollTop + 1;
(r.props.widgetOpened || r.props.embedded) && t > 0 && i && r.props.dispatch(Object(he.B)(r.props.conversation._id)),
e !== i && r.props.dispatch(function(e) {
return {
type: ie.c,
isAtBottom: e
}
}(i))
}
)),
I()(tt()(r), "scrollToPreviousFirstMessage", (function() {
var e = r._lastTopMessageNode;
r.props.hasMoreMessages ? r._lastTopMessageNodePosition && !r._isScrolling && (r._isScrolling = !0,
r._container.current.scrollTop = Object(we.b)(e, r._container.current),
r._isScrolling = !1) : r._container.current.scrollTop = Object(we.b)(e, r._container.current) - 47,
r._lastTopMessageNode = void 0
}
)),
0
Gary Kester
Problem solved!!
You can hide it in the html template file under the <body> tag
0