diff --git a/ts/test-mock/bootstrap.ts b/ts/test-mock/bootstrap.ts index d8734a632cf..f06ae0ec175 100644 --- a/ts/test-mock/bootstrap.ts +++ b/ts/test-mock/bootstrap.ts @@ -260,6 +260,15 @@ export class Bootstrap { return path.join(this.storagePath, 'logs'); } + public get ephemeralConfigPath(): string { + assert( + this.storagePath !== undefined, + 'Bootstrap has to be initialized first, see: bootstrap.init()' + ); + + return path.join(this.storagePath, 'ephemeral.json'); + } + public getBackupPath(fileName: string): string { assert( this.backupPath !== undefined, diff --git a/ts/test-mock/settings/language_test.ts b/ts/test-mock/settings/language_test.ts new file mode 100644 index 00000000000..81d33ead866 --- /dev/null +++ b/ts/test-mock/settings/language_test.ts @@ -0,0 +1,70 @@ +// Copyright 2023 Signal Messenger, LLC +// SPDX-License-Identifier: AGPL-3.0-only + +import createDebug from 'debug'; + +import type { Locator } from 'playwright/test'; +import { expect } from 'playwright/test'; +import { writeFile } from 'fs/promises'; +import * as durations from '../../util/durations'; +import type { App } from '../playwright'; +import { Bootstrap } from '../bootstrap'; + +export const debug = createDebug('mock:test:language'); + +describe('language', function (this: Mocha.Suite) { + this.timeout(durations.MINUTE); + + let bootstrap: Bootstrap; + let app: App; + + beforeEach(async () => { + bootstrap = new Bootstrap(); + await bootstrap.init(); + + // Note: We need to use the `localeOverride` config directly because you + // cannot restart an electron app in a puppeteer test + await writeFile( + bootstrap.ephemeralConfigPath, + JSON.stringify({ + localeOverride: 'ar', + }) + ); + + app = await bootstrap.link(); + }); + + afterEach(async function (this: Mocha.Context) { + if (!bootstrap) { + return; + } + + await bootstrap.maybeSaveLogs(this.currentTest, app); + await app.close(); + await bootstrap.teardown(); + }); + + it('renders correctly with a locale override', async () => { + const window = await app.getWindow(); + + debug('must have correct html attributes'); + await expect(window.locator(':root')).toHaveAttribute('lang', 'ar'); + await expect(window.locator(':root')).toHaveAttribute('dir', 'rtl'); + + function getLeftBound(locator: Locator): Promise { + return locator.evaluate(element => { + return element.getBoundingClientRect().left; + }); + } + + debug('must be rendered in correct order'); + const navTabsLeft = await getLeftBound(window.locator('.NavTabs')); + const leftPaneLeft = await getLeftBound(window.locator('#LeftPane')); + const emptyInboxLeft = await getLeftBound( + window.locator('.Inbox__conversation-stack') + ); + + expect(navTabsLeft).toBeGreaterThan(leftPaneLeft); + expect(leftPaneLeft).toBeGreaterThan(emptyInboxLeft); + }); +});