Fixed broken Web UI after registering the product from CLI

[lslezak]

Problem

• When registering the product from CLI (or using autoinstallation) the Web UI gets broken and displays an empty screen
• It happens only in the Firefox browser (does not not matter whether locally or remotely), Chromium/Chrome work fine
• After registering the bases system from CLI the web UI shows a blank screen #2274

agama-auto-registration-broken.webm

Firefox console log

Too many calls to Location or History APIs within a short timeframe. router.js:377:20
Too many calls to Location or History APIs within a short timeframe. router.js:388:22
Uncaught (in promise) DOMException: The operation is insecure.
    push router.js:388
    ve router.js:1739
    <anonymous> router.js:2215
    Ee router.js:2015
    n router.js:1862
    o index.js:917
    Ct index.js:1152
    React 3
    O scheduler.production.min.js:13
    D scheduler.production.min.js:14
index.js:2
Too many calls to Location or History APIs within a short timeframe. router.js:377:20
Too many calls to Location or History APIs within a short timeframe. router.js:388:22
Uncaught (in promise) DOMException: The operation is insecure.
    push router.js:388
    ve router.js:1739
    <anonymous> router.js:2215
    Ee router.js:2015
    n router.js:1862
    o index.js:917
    Ct index.js:1152
    React 11
    ql notifyManager.js:55
    n notifyManager.js:7
    batch notifyManager.js:29
    batch notifyManager.js:28
    r notifyManager.js:10
    batch notifyManager.js:27
    setTimeout handler*Gl notifyManager.js:2
    batch notifyManager.js:26
    batch notifyManager.js:44
    #s query.js:345
    setData query.js:52
    onSuccess query.js:247
    s retryer.js:45
    promise callback*f retryer.js:84
    start retryer.js:121
    fetch query.js:275
    #A queryObserver.js:179
    onSubscribe queryObserver.js:56
    subscribe subscribable.js:9
    Qs useBaseQuery.js:59
    React 12
    ql notifyManager.js:55
    n notifyManager.js:7
    batch notifyManager.js:29
    batch notifyManager.js:28
    r notifyManager.js:10
    batch notifyManager.js:27
    setTimeout handler*Gl notifyManager.js:2
    batch notifyManager.js:26
    batch notifyManager.js:44
    #s query.js:345
    setData query.js:52
    setQueryData queryClient.js:103
    ch status.ts:69
    dispatchEvent ws.ts:166
    dispatchEvent ws.ts:166
    onmessage ws.ts:82
index.js:2

Solution

• It seems that the CLI tool is sending the changes too quickly so the Web UI uses History API a lot and Firefox browser denies the access. Add a short delay between selecting the product and registering it. In the web UI you cannot register until the UI processes all events and updates the screen, that takes some time. The CLI can send the requests much faster.
• Handle the changed product event in Web UI, that helps to process it before registering the product so less events happen later. (It would be processed when registering the product but there would be too many events in a short time frame.)

Testing

• Tested manually, works fine:

agama-auto-registration-fixed.webm