UI: fix the lobby slide on Telegram cold launch (correct the cause)
CI / changes (pull_request) Successful in 2s
CI / unit (pull_request) Has been skipped
CI / integration (pull_request) Has been skipped
CI / ui (pull_request) Successful in 45s
CI / gate (pull_request) Successful in 0s
CI / deploy (pull_request) Successful in 57s

The first attempt (the App.svelte `started` gate) targeted the first pane mount,
but the slide is a second render. On a Telegram cold launch the URL fragment is
Telegram's #tgWebAppData=... launch params, which the router parsed as notfound;
bootstrap's navigate('/') then corrected it to the lobby asynchronously, re-keying
the route pane (notfound -> lobby) and sliding the lobby in as if returning from a
screen. A reload was static because the hash was already #/.

Treat a Telegram launch fragment as the lobby root in the router, so the route is
correct from the first pane (no re-key, no slide). Extract the pure hash->Route
parsing into routeparse.ts so it unit-tests without a DOM, and revert the gate
(the first pane never slid — local transitions skip the initial mount, as clean
browser launches showed).

Tests: routeparse unit tests (incl. the tgWebApp fragment); an e2e that launches
with the fragment in the URL and asserts the lobby plus the normalised #/ hash.
This commit is contained in:
Ilia Denisov
2026-06-11 23:40:40 +02:00
parent 9277a70565
commit c32a15730a
5 changed files with 119 additions and 59 deletions
+17
View File
@@ -35,6 +35,23 @@ test('Telegram launch auto-authenticates into the lobby and applies the theme',
.toBe('#101418');
});
test('a Telegram launch fragment in the URL still lands on the lobby and normalises the hash', async ({
page,
}) => {
await page.addInitScript((stub) => {
Object.assign(window, stub);
}, webAppStub());
// Telegram appends its launch params to the URL fragment on a cold launch; the router must
// not treat that as a route (it parsed as notfound, which re-keyed the pane and slid the
// lobby in as if returning from another screen).
await page.goto(
'/#tgWebAppData=query_id%3Dtest%26user%3D%257B%2522id%2522%253A1%257D&tgWebAppVersion=7.0&tgWebAppPlatform=ios',
);
await expect(page.getByText('Your turn')).toBeVisible();
// The lobby is the root: bootstrap normalised the launch-param fragment to '#/'.
await expect.poll(() => new URL(page.url()).hash).toBe('#/');
});
test('tg-fullscreen header keeps a constant native-nav gap as the font scales', async ({ page }) => {
await page.goto('/');
await page.getByRole('button', { name: /guest/i }).click();