Show dialog warning users their session is about to expire

[avernet]

+1 from customer

[avernet]

Ideally, we should log users out when we tell them that the session has expired. We can easily create a service to invalidate the session, but we wouldn't want to call it too early. The issue is that right now we keep track of newestEventTime on a per page basis, and update that value when we send an Ajax request (see AjaxEventQueue.scala). If users have multiple tabs open, that value might be too pessimistic: if a user is still active on tab 1, we wouldn't want tab 2 to think the session should expire and log the user out.

So we need this newestEventTime to be shared across tabs, which can be done with localStorage. However, how can we know that users on 2 tabs are logged in the same server session? These days, cookies like JSESSIONID are marked HttpOnly, so relying on that value is most likely not an option. On page load, the server-side code could send the browser a session id, and then our client-side code could keep track in localStorage of a sessionId → newestEventTime. We'll need to think this over before going ahead with the implementation.

[avernet]

We now have #5896 for the point discussed in my previous comment. And for this issue proper, we're just missing the:

• Doc

[ebruchez]

• Form Builder JavaScript crashes upon load because fr-session-expiration-dialog is not present in that case
  • Should Form Builder have this? If so, included it, else JavaScript should not assume presence of dialog.

[ebruchez]

RESOLUTION: Dialog should also be present in Form Builder.

[ebruchez]

• cherry-pick on master

[obruchez]

• remaining bug: dialog doesn't show on pages using Bootstrap 5

[avernet]

• Investigate possible problem where dialog shown in hidden tab does not disappear when renewing in other tab
  • May be useful: Page Visibility API @ebruchez was referring to, I think: can register listener on visibilitychange, and do something when ocument.visibilityState === "visible" (what to do would be easy if we were to also store newestEventTime in localStorage).
  • Probably unrelated (but something I didn't know!): chrome://discards/ can be used to manually discard pages and more, but not, as far as I can see, to suspend/freeze tabs.

[obruchez]

Fixed (removed fade class on modal, with comment). The problem was that the "expiring" dialog could not be hidden (hide function from Bootstrap) when the tab is not visible, i.e. when the session is renewed from another tab. The fade effect apparently slightly changes the behavior of the modal, in the sense that the effect will apparently not be triggered before the tab is visible (?). So the hide function is indeed called when the tab is invisible, but when the tab is shown, the effect will actually be triggered and the modal will be shown again. To avoid the extra complexity to support this case, the fade effect has been removed and a comment has been added next to the modal definition.

[ebruchez]

Doc