Improve client accessibility and bump Harbor versions

test/web/client-controls.test.js

@@ -2,6 +2,7 @@ import assert from 'node:assert/strict';
 import test from 'node:test';
 
 import {
+  accessTabForKey,
   connectionAction,
   copyText,
   formatConnectionDuration,
@@ -93,6 +94,16 @@ test('copy uses the synchronous native path available on gateway HTTP', async ()
   assert.equal(textarea.removed, true);
 });
 
+test('Gateway access tabs wrap with arrows and support Home and End', () => {
+  const tabs = ['gateway', 'proxy'];
+
+  assert.equal(accessTabForKey(tabs, 'gateway', 'ArrowLeft'), 'proxy');
+  assert.equal(accessTabForKey(tabs, 'proxy', 'ArrowRight'), 'gateway');
+  assert.equal(accessTabForKey(tabs, 'proxy', 'Home'), 'gateway');
+  assert.equal(accessTabForKey(tabs, 'gateway', 'End'), 'proxy');
+  assert.equal(accessTabForKey(tabs, 'gateway', 'Enter'), 'gateway');
+});
+
 test('subscription usage combines traffic and caps progress', () => {
   assert.deepEqual(subscriptionUsage({ upload: 30, download: 80, total: 100, expire: 2 }), {
     upload: 30,

test/web/responsive-layout-contract.test.js

@@ -60,3 +60,17 @@ test('responsive motion has a reduced-motion fallback', () => {
   assert.match(reducedMotion, /transition:\s*none/);
   assert.match(reducedMotion, /animation:\s*none/);
 });
+
+test('tooltips stay opaque, above adjacent content, and do not stick after pointer clicks', () => {
+  const tooltip = rule('.client-tooltip');
+
+  assert.match(tooltip, /z-index:\s*1000/);
+  assert.match(tooltip, /background:\s*oklch\(0\.14 0\.012 145\)/);
+  assert.doesNotMatch(tooltip, /transparent|backdrop-filter/);
+  assert.match(styles, /\.client-power-section:has\(\.client-tooltip-anchor:hover\)[\s\S]*z-index:\s*90/);
+  assert.match(styles, /\.client-tooltip-anchor:focus-visible > \.client-tooltip/);
+  assert.match(styles, /\.client-tooltip-anchor:has\(> :focus-visible\) > \.client-tooltip/);
+  assert.doesNotMatch(styles, /\.client-tooltip-anchor:focus-within > \.client-tooltip/);
+  assert.match(rule('.harbor-version-tooltip'), /background:\s*oklch\(0\.14 0\.012 145\)/);
+  assert.match(rule('.harbor-mode-tooltip'), /background:\s*oklch\(0\.14 0\.012 145\)/);
+});

test/web/rule-editor-contract.test.js

@@ -46,3 +46,23 @@ test('critical confirmations share one accessible blocking popup', () => {
   assert.match(popup, /element\.inert = true/);
   assert.match(styles, /\.client-confirmation-popup\.is-open[\s\S]*backdrop-filter: blur\(18px\)/);
 });
+
+test('copy feedback, drawers and Gateway tabs expose complete keyboard semantics', () => {
+  assert.match(component, /className="client-live-region" role="status" aria-live="polite" aria-atomic="true"/);
+  assert.match(component, /Не удалось скопировать/);
+  assert.match(component, /Скопировано/);
+  assert.doesNotMatch(component, />Error<|>Copied</);
+  assert.match(component, /aria-label="Закрыть инструкции"/);
+  assert.match(component, /aria-label="Закрыть локальные правила"/);
+  assert.match(component, /instructionsCloseRef\.current\?\.focus\(\)/);
+  assert.match(component, /localRulesCloseRef\.current\?\.focus\(\)/);
+  assert.match(component, /client-access-tab-\$\{tab\}/);
+  assert.match(component, /aria-controls={`client-access-panel-\$\{tab\}`}/);
+  assert.match(component, /tabIndex={accessTab === tab \? 0 : -1}/);
+  assert.match(component, /onKeyDown={\(event\) => navigateAccessTabs\(event, tab\)}/);
+  assert.match(component, /aria-labelledby="client-access-tab-gateway"/);
+  assert.match(component, /aria-labelledby={isGateway \? 'client-access-tab-proxy' : undefined}/);
+  assert.match(styles, /\.client-drawer-close \{[\s\S]*width: 44px;[\s\S]*height: 44px/);
+  assert.match(styles, /@media \(max-width: 560px\)[\s\S]*\.client-copy-button \{[\s\S]*min-height: 44px/);
+  assert.match(styles, /@media \(max-width: 560px\)[\s\S]*\.client-local-rule-enabled,[\s\S]*\.client-local-rule-delete \{[\s\S]*width: 44px;[\s\S]*height: 44px/);
+});