UI breaks after expanding a validator quickly after reload

[lukaw3d]

• open https://wallet.oasisprotocol.org/account/oasis1qq3xrq0urs8qcffhvmhfhz4p0mu7ewc8rscnlwxe/stake
• open console and simulate slower network Network Throttling: Fast 3G
• reload page
• quickly click Staking Fund (before GetEpoch request?)
• UI disappears

[lukaw3d]

@matevz Seems to be caused because props are readonly, and sort mutates original array

oasis-wallet-web/src/app/pages/StakingPage/Features/CommissionBounds/index.tsx

Lines 54 to 59 in e994b39

	export const CommissionBounds = memo((props: Props) => {
	const { t } = useTranslation()
	if (props.bounds && props.bounds.length > 0) {
	const items = props.bounds
	.sort((a, b) => a.epochStart - b.epochStart)

[lukaw3d]

if I add .slice() to clone array before, there's no error but:

click quickly after reload	click slowly after reload

[matevz]

I can't seem to reproduce this. Are there issues with oasis monitor again? I do get random 400 and 500 errors in Chromium's incognito mode only.

[kinqsta]

I just have same problem

Http response at 400 or 500 level
The above error occurred in task ft
    created by takeEvery(network/selectNetwork, ft)
    created by ht
Tasks cancelled due to error:
takeEvery(network/selectNetwork, ft)
D@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1047878
Ft@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1070696
Ut/<@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1069926
Ue@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1056709
Be@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1056515
xt@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1064004
Tt@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1064785
r.W@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1065728
r.R@https://wallet.oasisprotocol.org/static/js/2.48cea8b1.chunk.js:2:1065705

[lukaw3d]

@kinqsta That looks like a different problem

[lukaw3d]

@matevz I can't seem to reproduce this

Hm, I can't reproduce now either

[lukaw3d]

Reproduced again by enabling Network Throttling: Fast 3G. Adding to description.

[matevz]

Reproduced again by enabling Network Throttling: Fast 3G. Adding to description.

Does it depend on the browser and incognito mode?

[lukaw3d]

Nope, reproduced in normal Chrome and Firefox

[Boi4155]

I am able to reproduce this bug in any browser with or without extensions. I dont believe enabling Network Throttling: Fast 3G or running normally makes a difference on this bug.

I am an end user so It is difficult for me to debug when every variable and function is called Fi,Di,Li,Si. But it looks like the same bug error as posted before.
In my case specifically I cannot open info on the 'WePiggy Staking' validator. It is impossible for me to debond from them now. until this is fixed.
Another detail I dont know if matters or not is that the 'WePiggy Staking' is in between two other validators. I.e. it shows up in the middle for the UI.
Waiting an 'x' amount for time for 'y' to load makes no difference either it seems.
Please look into this, or offer an alternative to debonding as for now it is impossible. Thanks

[matevz]

@Boi4155 Can you check the Network tab if there are any failed requests? Maybe the oasismonitor was down for a moment and wallet couldn't connect to it?

[Boi4155]

I found nothing to do with failed requests there
Here's a video, although it is pretty much the same as the top one

walletBug.mp4