Blank screen when Scrolling or Uncollapsing

[Hounddog]

Description: Blank Page when scrolling up or Uncollapsin. We receive alert messages from prometheus in an alert channel which are collapsed. When trying to collapse the page goes blank

Steps to reproduce: Navigate to alert Channel and try to Uncollapse alert message. Scroll up in history in any channel

Actual behavior: Screen goes blank

Server Setup Information: Version of Rocket.Chat Server: 4.1.2 Deployment Method: Kubernetes Number of Running Instances: 1 NodeJS Version: v12.22.1 MongoDB Version: 4.4.6 / unknown (oplog Enabled)

Relevant logs: There is nothing related in logs.

Developer Console Chrome: 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 TypeError: Cannot read properties of undefined (reading 'replace') at eval (/client/components/Message/Attachments/DefaultAttachment.tsx:1) at Array.map (<anonymous>) at k (/client/components/Message/Attachments/DefaultAttachment.tsx:1) at Sa (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at di (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at Fs (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at ef (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at Qs (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at Xs (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at $s (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) Ti @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Ri.t.callback @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Mc @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Li @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 nf @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 t.unstable_runWithPriority @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:622 pc @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 tf @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 $s @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 (anonymous) @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 t.unstable_runWithPriority @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:622 pc @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 _c @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 gc @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Me @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 it @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Uncaught TypeError: Cannot read properties of undefined (reading 'replace') at eval (/client/components/Message/Attachments/DefaultAttachment.tsx:1) at Array.map (<anonymous>) at k (/client/components/Message/Attachments/DefaultAttachment.tsx:1) at Sa (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at di (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at Fs (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at ef (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at Qs (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at Xs (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) at $s (4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604) eval @ /client/components/Message/Attachments/DefaultAttachment.tsx:1 k @ /client/components/Message/Attachments/DefaultAttachment.tsx:1 Sa @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 di @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Fs @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 ef @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Qs @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Xs @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 $s @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 (anonymous) @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 t.unstable_runWithPriority @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:622 pc @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 _c @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 gc @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 Me @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 it @ 4570baead5d2268f7b1b9130e7a3050a0f9cb32a.js?meteor_js_resource=true:604 [Violation] 'click' handler took 359ms

[Hounddog]

Please let me know if i can provide any other information.

[Hounddog]

I have solved the issue with our alerts. Apparently our Integration script needed an update. However we are still not able to scroll up wihout receiving a blank screen

[danielwegener]

Turns out this was caused by a message attachment field that did not have a title. Ealier versions could handle the absence of this field, 4.1.2 seem to require it.

[0ki]

Any plans to make a future version that fails safely without crashing the UI?

[einhirn]

As far as I can see this is the culprit:

https://github.com/RocketChat/Rocket.Chat/blob/develop/apps/meteor/client/components/message/Attachments/DefaultAttachment.tsx#L77

It assumes a title and a value. We have an app that only sets value but no title in it's fields...

[einhirn]

To query messages that might be problematic, you can log in to the rocketchat-DB as Admin and use a query of:

use rocketchat
db.rocketchat_message.find({"attachments.fields.value":{$exists:true},"attachments.fields.title":{$exists:false}},{ "attachments.text":1, "attachments.fields":1,ts:1})

We found that the problematic messages were still displayed in the mobile app, while the desktop and web clients both crashed. That may be helpful to locate the problematic messages.

Once the App is fixed to only send messages containing both "title" and "value" in their Fields, you need to also fix it in the Rocket.Chat DB: We needed to execute a query like this:

use rocketchat
db.rocketchat_message.updateMany({"alias":"Kanboard","u.name":"Claus.Bot"},{$set: {"attachments.$[].fields.$[e].title":"Weitere Infos:"}},{arrayFilters:[{"e.title":{$exists:false}}]})

This searches for entries that have an alias of kanboard and an u.name of Claus.Bot (adjust accordingly). It then updates the entry with a generic title (Weitere Infos: in our case) in case the title doesn't exist in that particular fields array element...

HTH.