diff --git a/src/pages/LoginPage.test.jsx b/src/pages/LoginPage.test.jsx
new file mode 100644
index 0000000..144b87e
--- /dev/null
+++ b/src/pages/LoginPage.test.jsx
@@ -0,0 +1,82 @@
+// @vitest-environment jsdom
+import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest';
+import {cleanup, fireEvent, render, screen, waitFor} from '@testing-library/react';
+import {MemoryRouter, Route, Routes, useLocation} from 'react-router-dom';
+import LoginPage from './LoginPage.jsx';
+
+vi.mock('react-i18next', () => import('../test/i18n-mock.js'));
+
+const b64 = (o) => btoa(JSON.stringify(o)).replace(/=+$/, '');
+const TOKEN = `${b64({alg: 'EdDSA'})}.${b64({exp: Math.floor(Date.now() / 1000) + 3600})}.sig`;
+
+function CurrentPath() {
+ const location = useLocation();
+ return
{location.pathname + location.search}
;
+}
+
+function renderLogin(state) {
+ render(
+
+
+ }/>
+ }/>
+
+ ,
+ );
+}
+
+function submit() {
+ fireEvent.change(screen.getByLabelText('LOGIN.EMAIL'), {target: {value: 'a@b.de'}});
+ fireEvent.change(screen.getByLabelText('LOGIN.PASSWORD'), {target: {value: 'secret'}});
+ fireEvent.click(screen.getByRole('button', {name: 'LOGIN.SUBMIT'}));
+}
+
+describe('LoginPage', () => {
+ beforeEach(() => {
+ globalThis.fetch = vi.fn(async () => ({ok: true, status: 200, json: async () => ({token: TOKEN})}));
+ });
+
+ afterEach(() => {
+ cleanup();
+ localStorage.clear();
+ });
+
+ it('says that the session expired', () => {
+ renderLogin({sessionExpired: true, from: '/library'});
+
+ expect(screen.getByText('LOGIN.SESSION_EXPIRED')).toBeTruthy();
+ });
+
+ it('shows no message on a normal visit', () => {
+ renderLogin(undefined);
+
+ expect(screen.queryByText('LOGIN.SESSION_EXPIRED')).toBeNull();
+ });
+
+ it('goes back to the page of the expired session after login', async () => {
+ renderLogin({sessionExpired: true, from: '/library?status=PLAYING'});
+
+ submit();
+
+ await waitFor(() => expect(screen.getByTestId('path').textContent).toBe('/library?status=PLAYING'));
+ expect(localStorage.getItem('tbp_jwt')).toBe(TOKEN);
+ });
+
+ it('ignores a return path outside the app', async () => {
+ renderLogin({sessionExpired: true, from: '//evil.example'});
+
+ submit();
+
+ await waitFor(() => expect(screen.getByTestId('path').textContent).toBe('/dashboard'));
+ });
+
+ it('hides the expired message once a login attempt fails', async () => {
+ fetch.mockResolvedValueOnce({ok: false, status: 401, headers: new Headers(), json: async () => ({code: 'INVALID_CREDENTIALS'})});
+ renderLogin({sessionExpired: true, from: '/library'});
+
+ submit();
+
+ await waitFor(() => expect(screen.getByText('LOGIN.ERROR_INVALID_CREDENTIALS')).toBeTruthy());
+ expect(screen.queryByText('LOGIN.SESSION_EXPIRED')).toBeNull();
+ });
+});
diff --git a/src/pages/SettingsPage.jsx b/src/pages/SettingsPage.jsx
index d4d7730..45bee6c 100644
--- a/src/pages/SettingsPage.jsx
+++ b/src/pages/SettingsPage.jsx
@@ -17,6 +17,7 @@ import {Switch} from '@/components/ui/switch';
import FormField from '../components/FormField.jsx';
import {settingsSchema} from '../utils/validation.js';
import {usePreferences} from '../context/PreferencesContext.jsx';
+import useSessionExpired from '../hooks/useSessionExpired.js';
const BACKEND_ERROR_KEY = {
STEAM_ID_ALREADY_IN_USE: 'REGISTRATION.ERROR_STEAM_ID_IN_USE',
@@ -37,6 +38,7 @@ const formatDate = (value, locale) => {
export default function SettingsPage() {
const {t, i18n} = useTranslation();
const navigate = useNavigate();
+ const expireSession = useSessionExpired();
const {isDarkMode, setDarkMode, setLanguage} = usePreferences();
const [profile, setProfile] = useState(null);
@@ -71,8 +73,7 @@ export default function SettingsPage() {
});
if (response.status === 401) {
- localStorage.removeItem('tbp_jwt');
- navigate('/login');
+ expireSession();
return;
}
@@ -98,7 +99,7 @@ export default function SettingsPage() {
};
load();
- }, [navigate, reset, t]);
+ }, [navigate, expireSession, reset, t]);
const persistSettings = async (payload) => {
const token = localStorage.getItem('tbp_jwt');
@@ -118,8 +119,7 @@ export default function SettingsPage() {
});
if (response.status === 401) {
- localStorage.removeItem('tbp_jwt');
- navigate('/login');
+ expireSession();
return {ok: false};
}
diff --git a/src/utils/auth.js b/src/utils/auth.js
index 48a42ad..80b3fc0 100644
--- a/src/utils/auth.js
+++ b/src/utils/auth.js
@@ -24,3 +24,16 @@ export function getValidToken() {
}
return token;
}
+
+/**
+ * Returns the path when it is a path inside this app, else null. The login page uses it to go back after a
+ * session expired; "//host", "/\host" and tabs or line breaks (browsers drop them, so "/\t/host" is "//host")
+ * would leave the app, "/login" would loop.
+ */
+export function safeReturnPath(path) {
+ if (typeof path !== 'string' || !path.startsWith('/') || path.startsWith('//') || path.startsWith('/\\')
+ || /[\t\n\r]/.test(path)) {
+ return null;
+ }
+ return path === '/login' || path.startsWith('/login?') ? null : path;
+}
diff --git a/src/utils/auth.test.js b/src/utils/auth.test.js
index 15631a9..97b6f26 100644
--- a/src/utils/auth.test.js
+++ b/src/utils/auth.test.js
@@ -1,5 +1,5 @@
import {describe, expect, it} from 'vitest';
-import {isTokenValid} from './auth.js';
+import {isTokenValid, safeReturnPath} from './auth.js';
const tokenWithPayload = (payload) => {
const encode = (obj) => btoa(JSON.stringify(obj)).replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
@@ -25,3 +25,14 @@ describe('isTokenValid', () => {
expect(isTokenValid(token, now)).toBe(false);
});
});
+
+describe('safeReturnPath', () => {
+ it.each(['/library?status=PLAYING', '/library/220', '/settings'])('keeps the internal path %s', (path) => {
+ expect(safeReturnPath(path)).toBe(path);
+ });
+
+ it.each([undefined, null, '', 'library', '//evil.example', '/\\evil.example', '/\t/evil.example', '/\n/evil.example', 'https://evil.example', '/login', '/login?x=1'])(
+ 'rejects %j', (path) => {
+ expect(safeReturnPath(path)).toBeNull();
+ });
+});