App becomes unusable in Firefox Private Browsing

[ghost]

Steps to reproduce

1. Open staging.element.io in Firefox Private Browsing
2. Log in using SSO and verify the session
3. Click a room that is already open in the sidebar

The "Welcome to Element" screen stays open and the room is not displayed and I get these errors in the Browser Console:

Error handling m.room_key_event: QuotaExceededError: The quota has been exceeded. vendors~init.js:2:2569493
    r https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    methodFactory https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    onRoomKeyEvent https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    
Error uploading one-time keys v@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:1675384
storeAccount@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:1674918
storeAccount@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:865916
storeAccount@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:2743536
generateOneTimeKeys/</<@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:2745037
getAccount/<@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:2743475
getAccount@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:1674881
getAccount@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:865869
getAccount@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:2743398
generateOneTimeKeys/<@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:2744986
doTxn@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:1675209
doTxn@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:868289
generateOneTimeKeys@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:2744938
r@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:539083
maybeUploadOneTimeKeys/<@https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2:539925

Uncaught (in promise) DOMException: The quota has been exceeded.         vendors~element-web-app.js:2

6. Keep trying to switch between rooms and the same thing keeps happening
7. Reload the tab and the same behaviour happens
8. Shift+Reload the tab and I am presented with the Unsupported Browser page and the Browser Console shows these errors about localstorage:

/sync error ConnectionError: fetch failed: NetworkError when attempting to fetch resource. vendors~init.js:2:2569493
    r https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    methodFactory https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    onSyncError https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    doSync https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    sync https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    startClient https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    start https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    ue https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    ie https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    ee https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    K https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    loadSession https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    (Async: promise callback)
    loadSession https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    Ke https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    (Async: promise callback)
    Ke https://staging.element.io/bundles/51733431847a348f8b7e/vendors~element-web-app.js:2
    yo https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    Va https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    Ws https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    Ol https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    Dl https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    Fl https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    vl https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    ml https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    ec https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    ac https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    El https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    ac https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    render https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    ne https://staging.element.io/bundles/51733431847a348f8b7e/init.js:1
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    s https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2

Browser missing feature: 'localstorage' bundle.js:2:6903
    methodFactory https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    s https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    s https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2

Failed to open log database: InvalidStateError vendors~init.js:2:2569493
    r https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    methodFactory https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    onerror https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    (Async: EventHandlerNonNull)
    connect https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    connect https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    h https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    X https://staging.element.io/bundles/51733431847a348f8b7e/init.js:1
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    s https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2

Uncaught (in promise) Error: Failed to open log database: InvalidStateError
    onerror https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    connect https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    connect https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    h https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    X https://staging.element.io/bundles/51733431847a348f8b7e/init.js:1
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    async* https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    s https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    
Browser is missing required features. vendors~init.js:2:2569493
    r https://staging.element.io/bundles/51733431847a348f8b7e/vendors~init.js:2
    methodFactory https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    s https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2
    <anonymous> https://staging.element.io/bundles/51733431847a348f8b7e/bundle.js:2

Closing the Private Browsing window and trying again eventually fixes it, although I can keep reloading the page and eventually get the Unsupported Browser page. It works intermittently, maybe about half the time in my initial testing.

Outcome

What did you expect?

Room content should load in Private Browsing mode

What happened instead?

Room content fails to load, all I see is the Welcome screen:

If I reload the page I eventually get an Unsupported Browser prompt.

Operating system

OpenSUSE Tumbleweed 20230111 (Linux)

Browser information

Firefox 108.0.2

URL for webapp

staging.element.io

Application version

Element version: 1.11.18-rc.3, Olm version: 3.2.12

Homeserver

element.io

Will you send logs?

No

[richvdh]

I wasn't able to reproduce this exactly via the repro steps, but generally what seems to be going on is that we are filling up the localstorage quota with e2e keys. I am surprised that this causes a failure to change room (note that the console errors seem to be unrelated to the room switch), but to be honest the whole app falls apart somewhat once localstorage fills up mid-session.

Regarding the Unsupported Browser screen: this is intermittent because, in order to trigger it, you have to be within 18 bytes of the quota (that being the amount of data modernizr tries to store as a test). 18 bytes is somewhat less than the granularity we tend to store data in, so it's possible that your localstorage is essentially "full" yet never to see this screen. By manually filling the localstorage to within 18 bytes of the quota, I was able to reproduce the "Unsupported Browser" screen on app.element.io.

I don't see any obvious evidence that this is new on staging.

[t3chguy]

Related #10891

[richvdh]

Removing X-Regression, because I heavily suspect this has been present in some form ever since E2E backup landed.

[t3chguy]

Closing in favour of #10891