Refine failover channel status and switch controls

test/web/failover-feature-contract.test.js

@@ -23,7 +23,8 @@ test('failover settings use Harbor switches, a two-column channel table and plai
   assert.match(feature, /\['primary', 'reserve'\][\s\S]*client-failover-\$\{channel\}-options[\s\S]*updateTarget\(channel, optionId\)/);
   assert.match(feature, /channelLabel[\s\S]*profile\.trim\(\) === server\.trim\(\)[\s\S]*`\$\{profile} · \$\{server}`/);
   assert.match(feature, /client-failover-channels[\s\S]*<article className="client-failover-channel"[\s\S]*<h3>\{channel === 'primary' \? 'Основной' : 'Резервный'}/);
-  assert.match(feature, /snapshot\.reason === 'checking-channels'[\s\S]*Проверяем \{checkingRole === 'primary' \? 'основной' : 'резервный'} канал/);
+  assert.match(feature, /client-failover-channel-checking[\s\S]*Проверяем \{channel === 'primary' \? 'основной' : 'резервный'} канал/);
+  assert.match(feature, /client-live-region[\s\S]*Проверяем основной и резервный каналы/);
   assert.match(feature, /ArrowDown[\s\S]*Home[\s\S]*End[\s\S]*Escape/);
   assert.match(feature, /role="listbox"[\s\S]*role="option"/);
   assert.match(feature, /Что проверять[\s\S]*Harbor проверяет эти сайты через оба канала, чтобы понять, какой канал работает/);
@@ -51,8 +52,9 @@ test('failover settings use Harbor switches, a two-column channel table and plai
   assert.match(feature, /checked=\{!snapshot\.paused\}[\s\S]*disabled=\{blocked \|\| !snapshot.enabled\}/);
   assert.match(feature, /client-failover-check-action[\s\S]*disabled=\{blocked \|\| checking \|\| !snapshot.enabled \|\| snapshot.activation !== 'active'\}/);
   assert.doesNotMatch(feature, /client-failover-actions|client-failover-global-actions|client-failover-discard/);
-  assert.match(feature, /channel === 'primary' && <div className="client-failover-channel-actions"[\s\S]*client-failover-check-action client-tooltip-anchor[\s\S]*aria-label="Проверить оба канала"[\s\S]*aria-busy=\{checking\}[\s\S]*client-failover-direction-action client-tooltip-anchor[\s\S]*aria-label=\{switchRole \? `Переключить на \$\{switchRole === 'primary' \? 'основной' : 'резервный'\} канал`/);
-  assert.match(feature, /<Tooltip>Проверить оба канала<\/Tooltip>[\s\S]*<Tooltip>\{switchRole \? `Переключить на/);
+  assert.match(feature, /channel === 'primary' && <div className="client-failover-channel-actions"[\s\S]*client-failover-check-action client-tooltip-anchor[\s\S]*aria-label="Проверить оба канала"[\s\S]*aria-busy=\{checking\}[\s\S]*client-failover-direction-action client-tooltip-anchor[\s\S]*aria-label=\{switchActionLabel\}/);
+  assert.match(feature, /switchActionLabel = role && switchRole[\s\S]*`Сейчас \$\{role === 'primary' \? 'основной' : 'резервный'\} канал\. Переключить на/);
+  assert.match(feature, /<Tooltip>Проверить оба канала<\/Tooltip>[\s\S]*<Tooltip>\{switchActionLabel\}<\/Tooltip>/);
   assert.match(feature, /M20 11a8 8 0 1 0-2\.3 6\.7M20 5v6h-6/);
   assert.match(feature, /M4 12h15M14 7l5 5-5 5/);
   assert.match(feature, /normalizeFailoverDraft = \(policy: FailoverPolicy\)[\s\S]*minimumReserveMs: Math\.round\(normalized\.minimumReserveMs \/ 60_000\) \* 60_000/);
@@ -64,6 +66,8 @@ test('failover settings use Harbor switches, a two-column channel table and plai
   assert.match(styles, /\.client-failover-check-action\.is-running svg \{ animation: client-spin 900ms linear infinite; \}/);
   assert.match(styles, /\.client-failover-direction-action svg \{[^}]*transition: transform 260ms cubic-bezier\(0\.16, 1, 0\.3, 1\)/);
   assert.match(styles, /\.client-failover-direction-action svg\.is-primary \{ transform: rotate\(180deg\); \}/);
+  assert.match(styles, /\.client-failover-direction-action\.is-primary \{ color: var\(--harbor-connect\); \}/);
+  assert.match(styles, /\.client-failover-direction-action\.is-reserve \{ color: var\(--harbor-gateway\); \}/);
   assert.match(styles, /@media \(prefers-reduced-motion: reduce\)[\s\S]*client-failover-direction-action svg[\s\S]*transition: none[\s\S]*client-failover-check-action\.is-running svg[\s\S]*animation: none/);
   assert.match(styles, /\.client-failover-switch\[aria-checked='true'\][\s\S]*translateX\(22px\)/);
   assert.match(styles, /\.client-failover-header \{[^}]*position:\s*sticky[^}]*top:\s*0[^}]*background:/);
@@ -87,17 +91,14 @@ test('failover settings use Harbor switches, a two-column channel table and plai
   assert.doesNotMatch(styles, /client-failover-advanced|failover-advanced-in|failover-advanced-out/);
 });
 
-test('runtime status sits beside the channel controls and explains active traffic without motion dependence', () => {
-  assert.match(feature, /Ждём паузу в передаче данных/);
-  assert.match(feature, /Сейчас передаётся [\s\S]*Активных подключений:[\s\S]*transmittingConnections/);
-  assert.match(feature, /activity\?\.blockers\.slice\(0, 2\)\.map/);
-  assert.match(feature, /Ещё \{activity\.blockers\.length - 2\}/);
-  assert.match(feature, /Проверяем основной канал ·[\s\S]*Проверим каналы снова через/);
+test('active channel and checks stay attached to their channel columns without a duplicate runtime block', () => {
+  assert.match(feature, /Проверяем основной канал ·/);
   assert.match(feature, /client-failover-direction-action[\s\S]*disabled=\{blocked \|\| !snapshot.enabled \|\| snapshot.activation !== 'active' \|\| !switchRole\}/);
-  assert.match(feature, /client-failover-channels[\s\S]*client-failover-runtime[\s\S]*Что проверять/);
-  assert.match(feature, /Сейчас используется[\s\S]*Основной канал[\s\S]*Резервный канал[\s\S]*Новые подключения:/);
-  assert.match(styles, /\.client-failover-runtime\.is-primary strong \{[^}]*var\(--harbor-connect\)/);
-  assert.match(styles, /\.client-failover-runtime\.is-reserve strong \{[^}]*var\(--harbor-gateway\)/);
-  assert.doesNotMatch(styles, /\.client-failover-runtime \{[^}]*min-height:\s*132px/);
+  assert.match(feature, /className=\{`client-failover-direction-action client-tooltip-anchor\$\{role === 'primary'[\s\S]*role === 'reserve'/);
+  assert.match(feature, /<svg className=\{role === 'primary' \? 'is-primary' : role === 'reserve' \? 'is-reserve' : undefined\}/);
+  assert.doesNotMatch(feature, /client-failover-runtime|Сейчас используется|Новые подключения:/);
+  assert.doesNotMatch(styles, /\.client-failover-runtime/);
+  assert.match(styles, /\.client-failover-channel-checking \{[^}]*min-height:\s*16px[^}]*opacity:\s*0[^}]*visibility:\s*hidden/);
+  assert.match(styles, /\.client-failover-channel-checking\.is-visible \{[^}]*opacity:\s*1[^}]*visibility:\s*visible/);
   assert.match(styles, /@media \(prefers-reduced-motion: reduce\)[^{]*\{[^}]*\.client-failover-number-control:hover \.client-failover-number-steps[^}]*transition:\s*none/);
 });