fix(tooling): repair test, i18n and docs verification gates (#3331)

fluxer_app/src/features/auth/commands/AccountSwitcherModalCommands.tsx

@@ -11,7 +11,12 @@ const logger = new Logger('AccountSwitcherModalCommands');
 export function openAccountSwitcherModal(props: AccountSwitcherModalProps, key: string | null): void {
 	void loadLazyModule(() => import('@app/features/auth/components/accounts/AccountSwitcherModal'))
 		.then(({default: AccountSwitcherModal}) => {
-			const render = modal(() => <AccountSwitcherModal {...props} />);
+			const render = modal(() => (
+				<AccountSwitcherModal
+					data-flx="auth.account-switcher-modal-commands.open-account-switcher-modal.account-switcher-modal"
+					{...props}
+				/>
+			));
 			if (key === null) {
 				ModalCommands.push(render);
 				return;

fluxer_app/src/features/auth/components/InstanceBrandMark.tsx

@@ -56,5 +56,13 @@ export function InstanceBrandMark({
 	if (iconUrl == null) {
 		return globe;
 	}
-	return <InstanceBrandImage key={iconUrl} url={iconUrl} size={size} fallback={globe} />;
+	return (
+		<InstanceBrandImage
+			key={iconUrl}
+			url={iconUrl}
+			size={size}
+			fallback={globe}
+			data-flx="auth.instance-brand-mark.instance-brand-image"
+		/>
+	);
 }

fluxer_app/src/features/auth/flow/HandoffApprovalFlow.tsx

@@ -239,14 +239,18 @@ export function HandoffApprovalFlow({handoff, onRetry}: HandoffApprovalFlowProps
 		return (
 			<div className={styles.container} data-flx="auth.flow.handoff-approval-flow.container--4">
 				<h1 className={styles.title} data-flx="auth.flow.handoff-approval-flow.title--3">
-					<ApprovalTitle handoff={handoff} />
+					<ApprovalTitle handoff={handoff} data-flx="auth.flow.handoff-approval-flow.approval-title" />
 				</h1>
 				<p className={styles.description} data-flx="auth.flow.handoff-approval-flow.description--2">
 					<Trans comment="Warning under the title of the browser approval page, so people do not approve a sign-in someone else started.">
 						Only continue if you started this sign-in on a device you control.
 					</Trans>
 				</p>
-				<AccountLine handoff={handoff} onUseAnotherAccount={retry} />
+				<AccountLine
+					handoff={handoff}
+					onUseAnotherAccount={retry}
+					data-flx="auth.flow.handoff-approval-flow.account-line"
+				/>
 				{matchCode != null ? (
 					<div className={styles.matchCheck} data-flx="auth.flow.handoff-approval-flow.match-check">
 						<span data-flx="auth.flow.handoff-approval-flow.match-check-label">
@@ -254,10 +258,10 @@ export function HandoffApprovalFlow({handoff, onRetry}: HandoffApprovalFlowProps
 								Make sure this code matches the one in the {PRODUCT_NAME} app.
 							</Trans>
 						</span>
-						<HandoffCode code={matchCode} />
+						<HandoffCode code={matchCode} data-flx="auth.flow.handoff-approval-flow.handoff-code" />
 					</div>
 				) : null}
-				<DeviceCard clientInfo={handoff.clientInfo} />
+				<DeviceCard clientInfo={handoff.clientInfo} data-flx="auth.flow.handoff-approval-flow.device-card" />
 				<div className={styles.buttonRow} data-flx="auth.flow.handoff-approval-flow.button-row">
 					<Button onClick={handoff.deny} variant="secondary" data-flx="auth.flow.handoff-approval-flow.button.deny">
 						{i18n._(CANCEL_DESCRIPTOR)}

fluxer_app/src/features/auth/flow/auth_login_core/AuthLoginBrowserStep.tsx

@@ -202,7 +202,12 @@ function WaitingContent({handoff, instanceName, onOtherDevice}: WaitingContentPr
 					</Trans>
 				)}
 			</flx-auth-login-browser-step-status-text>
-			{showCode && !handoff.hasStoppedWaiting ? <HandoffCode code={handoff.displayCode} /> : null}
+			{showCode && !handoff.hasStoppedWaiting ? (
+				<HandoffCode
+					code={handoff.displayCode}
+					data-flx="auth.flow.auth-login-core.auth-login-browser-step.waiting-content.handoff-code"
+				/>
+			) : null}
 			<FocusRing offset={-2} data-flx="auth.flow.auth-login-core.auth-login-browser-step.focus-ring.other-device">
 				<button
 					type="button"
@@ -245,7 +250,10 @@ function OtherDeviceContent({handoff, signInAddress}: {handoff: BrowserLoginHand
 				</Trans>
 			</flx-auth-login-browser-step-status-text>
 			{handoff.hasCode ? (
-				<HandoffCode code={handoff.displayCode} />
+				<HandoffCode
+					code={handoff.displayCode}
+					data-flx="auth.flow.auth-login-core.auth-login-browser-step.other-device-content.handoff-code"
+				/>
 			) : (
 				<Spinner size={SpinnerSize.MEDIUM} data-flx="auth.flow.auth-login-core.auth-login-browser-step.code-spinner" />
 			)}
@@ -440,7 +448,9 @@ export const AuthLoginBrowserStep = observer(function AuthLoginBrowserStep({
 				{showBackButton ? (
 					<Button
 						variant={ButtonVariant.SECONDARY}
-						leftIcon={<ButtonIcon icon="back" />}
+						leftIcon={
+							<ButtonIcon icon="back" data-flx="auth.flow.auth-login-core.auth-login-browser-step.button-icon" />
+						}
 						onClick={handleBackToWaiting}
 						data-flx="auth.flow.auth-login-core.auth-login-browser-step.button.back-to-waiting"
 					>
@@ -449,7 +459,9 @@ export const AuthLoginBrowserStep = observer(function AuthLoginBrowserStep({
 				) : null}
 				{handoff.hasStoppedWaiting ? (
 					<Button
-						leftIcon={<ButtonIcon icon="retry" />}
+						leftIcon={
+							<ButtonIcon icon="retry" data-flx="auth.flow.auth-login-core.auth-login-browser-step.button-icon--2" />
+						}
 						onClick={handoff.resumeWaiting}
 						data-flx="auth.flow.auth-login-core.auth-login-browser-step.button.resume-waiting"
 					>
@@ -457,7 +469,12 @@ export const AuthLoginBrowserStep = observer(function AuthLoginBrowserStep({
 					</Button>
 				) : (
 					<Button
-						leftIcon={<ButtonIcon icon={handoff.copied ? 'copied' : 'copy'} />}
+						leftIcon={
+							<ButtonIcon
+								icon={handoff.copied ? 'copied' : 'copy'}
+								data-flx="auth.flow.auth-login-core.auth-login-browser-step.button-icon--3"
+							/>
+						}
 						onClick={handoff.copyCode}
 						disabled={!handoff.hasCode}
 						submitting={isMakingCode}
@@ -480,7 +497,9 @@ export const AuthLoginBrowserStep = observer(function AuthLoginBrowserStep({
 				{showBackButton ? (
 					<Button
 						variant={ButtonVariant.SECONDARY}
-						leftIcon={<ButtonIcon icon="back" />}
+						leftIcon={
+							<ButtonIcon icon="back" data-flx="auth.flow.auth-login-core.auth-login-browser-step.button-icon--4" />
+						}
 						onClick={handleCancel}
 						data-flx="auth.flow.auth-login-core.auth-login-browser-step.button.back"
 					>
@@ -489,7 +508,9 @@ export const AuthLoginBrowserStep = observer(function AuthLoginBrowserStep({
 				) : null}
 				{canStart ? (
 					<Button
-						leftIcon={<ButtonIcon icon="retry" />}
+						leftIcon={
+							<ButtonIcon icon="retry" data-flx="auth.flow.auth-login-core.auth-login-browser-step.button-icon--5" />
+						}
 						onClick={handleRetry}
 						data-flx="auth.flow.auth-login-core.auth-login-browser-step.button.retry"
 					>
@@ -518,7 +539,9 @@ export const AuthLoginBrowserStep = observer(function AuthLoginBrowserStep({
 				</Button>
 				{handoff.hasStoppedWaiting ? (
 					<Button
-						leftIcon={<ButtonIcon icon="retry" />}
+						leftIcon={
+							<ButtonIcon icon="retry" data-flx="auth.flow.auth-login-core.auth-login-browser-step.button-icon--6" />
+						}
 						onClick={handoff.resumeWaiting}
 						data-flx="auth.flow.auth-login-core.auth-login-browser-step.button.resume-waiting"
 					>
@@ -526,7 +549,9 @@ export const AuthLoginBrowserStep = observer(function AuthLoginBrowserStep({
 					</Button>
 				) : (
 					<Button
-						leftIcon={<ButtonIcon icon="open" />}
+						leftIcon={
+							<ButtonIcon icon="open" data-flx="auth.flow.auth-login-core.auth-login-browser-step.button-icon--7" />
+						}
 						onClick={handleOpenBrowser}
 						submitting={isOpening}
 						disabled={!canStart}