// Navigation+ (src/areas/navigation): the reference area. Its hide and layout rules, Focus Mode
// and Keyboard Plus as feature modules, compared with the plugins they replace. The table-level
// checks (every module starts and stops clean, one observer, the budget) are in areas.test.ts.
import assert from 'node:assert/strict';
import { readFileSync } from 'node:fs';
import test from 'node:test';
import { NAVIGATION_CSS, navigationCss } from '../src/areas/navigation/css.ts';
import { FEATURES } from '../src/areas/navigation/features.ts';
import { FOCUS_SCHEMA, focusCss, type FocusSettings } from '../src/areas/navigation/focusMode.ts';
import { MODULES } from '../src/areas/navigation/index.ts';
import { keyboardActions } from '../src/areas/navigation/keyboardPlus.ts';
import type { PluginApi } from '../src/inject/pluginApi.ts';
import { normalizeSettings } from '../../../waybetter/packages/runtime/src/settingsForm.ts';
import { areaPage, flagsOnly, messages } from './helpers/areaPage.ts';

const BUNDLED = new URL('../src-tauri/bundled-plugins/', import.meta.url);

/** The old plugin, loaded the way native code loads it, to compare the port against. */
function oldPlugin(file: string): Record<string, unknown> {
  const module = { exports: {} as unknown };
  new Function('module', 'exports', readFileSync(new URL(file, BUNDLED), 'utf8'))(module, module.exports);
  return module.exports as Record<string, unknown>;
}

test('Navigation+: its fourteen features are modules, and each hide rule only names its own part of X', () => {
  assert.equal(FEATURES.length, 14);
  assert.deepEqual(MODULES.map(module => module.id).sort(), FEATURES.map(feature => feature.id).sort());
  assert.equal(Object.keys(NAVIGATION_CSS).length, 12);
  const markers: Record<keyof typeof NAVIGATION_CSS, string> = {
    hidePremiumNav: '/i/verified', hideChatNav: '/i/chat', hideCommunitiesNav: '/communities', hideGrokNav: 'a[href="/i/grok"]',
    hideSidebarTrends: '[data-testid="trend"]', hideWhoToFollow: 'UserCell', hideLiveOnX: 'Live on X', hideTodaysNews: 'news_sidebar',
    hidePremiumUpsells: 'premium_sign_up', hideRelevantPeople: 'data-bt-route="status"', hideSidebar: '[data-testid="sidebarColumn"] {', fullWidthTimeline: 'flex-grow: 1',
  };
  for (const [flag, marker] of Object.entries(markers)) {
    const css = navigationCss({ [flag]: true });
    assert.ok(css.includes(marker), flag);
    // No :has() inside :has() (invalid CSS: the whole rule would be dropped).
    assert.doesNotMatch(css, /:has\([^)]*:has\(/, flag);
  }
  assert.equal(navigationCss({}), '');
  // The rail rules never reach into posts, and the right-column ones stay in the right column.
  for (const flag of ['hidePremiumNav', 'hideChatNav', 'hideCommunitiesNav', 'hideGrokNav'] as const) assert.doesNotMatch(NAVIGATION_CSS[flag](), /article|tweet|sidebarColumn/, flag);
  assert.doesNotMatch(NAVIGATION_CSS.hideSidebarTrends(), /(^|,\n)section\[role="region"\]/, 'Explore\'s own trends are Search+\'s');
});

test('Navigation+: "Relevant people" only runs on post pages, and nothing of it on chat', () => {
  const env = areaPage('/home');
  env.registry.setFlags(flagsOnly({ hideRelevantPeople: true, hideSidebarTrends: true }));
  assert.deepEqual(env.registry.active(), ['hideSidebarTrends']);
  env.go('/someone/status/1');
  assert.deepEqual(env.registry.active().sort(), ['hideRelevantPeople', 'hideSidebarTrends']);
  assert.deepEqual(env.live(), ['wbf-hideRelevantPeople', 'wbf-hideSidebarTrends']);
  env.go('/i/chat');
  assert.deepEqual(env.registry.active(), []);
  env.registry.dispose();
});

test('Focus Mode: the same settings and the same rules as the plugin it replaces', () => {
  const Old = oldPlugin('focus-mode.plugin.js') as unknown as { DEFAULTS: FocusSettings; normalize(saved: unknown): FocusSettings; css(settings: FocusSettings): string };
  assert.deepEqual(normalizeSettings(FOCUS_SCHEMA, null), Old.DEFAULTS, 'someone who enabled the plugin and never opened its settings sees no change');
  for (const saved of [{ metrics: false, trends: 'yes', extra: true }, { enabled: false }, { sidebar: true, followCounts: true }]) {
    assert.deepEqual(normalizeSettings(FOCUS_SCHEMA, saved), Old.normalize(saved), JSON.stringify(saved));
  }
  const keys = Object.keys(Old.DEFAULTS) as (keyof FocusSettings)[];
  // Every combination of the six switches gives byte-identical CSS.
  for (let bits = 0; bits < 2 ** keys.length; bits += 1) {
    const settings = Object.fromEntries(keys.map((key, index) => [key, !!(bits & (1 << index))])) as FocusSettings;
    assert.equal(focusCss(settings), Old.css(settings), JSON.stringify(settings));
  }
  assert.equal(focusCss({ ...Old.DEFAULTS, enabled: false }), '', 'off: nothing hidden');
  // Its words are the plugin's own keys (`words: 'focus-mode'`): every label and hint of the form exists.
  for (const field of FOCUS_SCHEMA) if (field.type !== 'divider') {
    assert.ok(messages[`plugin.focus-mode.${field.label}`], field.label);
    if (field.hint) assert.ok(messages[`plugin.focus-mode.${field.hint}`], field.hint);
  }
});

test('Focus Mode: reads the plugin\'s stored settings, toggles with its command and Alt+Shift+F, saves where the plugin saved', () => {
  const env = areaPage();
  env.store.set('bt-plugin:focus-mode:settings', JSON.stringify({ enabled: true, metrics: false, trends: true, whoToFollow: false, followCounts: false, sidebar: false }));
  env.registry.setFlags(flagsOnly({ 'navigation.focusMode': true }));
  assert.deepEqual(env.live(), ['wbf-navigation.focusMode']);
  assert.deepEqual(env.api.commands.list().map(command => command.id).sort(), ['bt-navigation-plus.plugin.js:focusMode.toggle', 'bt-navigation-plus.plugin.js:settings']);
  assert.equal(env.api.commands.list().find(command => command.id.endsWith('focusMode.toggle'))!.title, 'Toggle Focus Mode');
  assert.equal(env.api.commands.list().find(command => command.id.endsWith(':settings'))!.title, 'Navigation+ settings');
  // (The confirming toast needs a real DOM; here the kit reports that it cannot draw, which is fine.)
  const original = console.error;
  console.error = () => {};
  try {
    // Alt+Shift+F is the command's shortcut now, so the palette lists it; it still works from the page.
    let prevented = false;
    env.doc.emit('keydown', { key: 'F', code: 'KeyF', altKey: true, shiftKey: true, ctrlKey: false, metaKey: false, target: null, preventDefault() { prevented = true; }, stopPropagation() {} });
    assert.ok(prevented);
    assert.equal(JSON.parse(env.store.get('bt-plugin:focus-mode:settings')!).enabled, false);
    assert.deepEqual(env.live(), [], 'off: no rule');
    env.api.commands.run('bt-navigation-plus.plugin.js:focusMode.toggle');
    assert.deepEqual(JSON.parse(env.store.get('bt-plugin:focus-mode:settings')!), { enabled: true, metrics: false, trends: true, whoToFollow: false, followCounts: false, sidebar: false });
    assert.deepEqual(env.live(), ['wbf-navigation.focusMode']);
  } finally { console.error = original; }
  env.registry.dispose();
});

test('Keyboard Plus: keys act on the focused post, copy or navigate, and never click an action', async () => {
  const clicked: string[] = [];
  const copied: string[] = [];
  const said: string[] = [];
  const node = (name: string) => ({ click() { clicked.push(name); }, closest: () => null });
  const article = {
    contains: () => false,
    querySelector: (selector: string) => (selector.includes('User-Name') ? node('author') : null),
    querySelectorAll: (selector: string) => (selector.includes('/photo/') ? [node('photo')] : []),
  } as unknown as Element;
  const tweet = { id: '1', url: 'https://x.com/someone/status/1', handle: 'someone', name: 'Someone', text: 'hello', time: null, media: [], element: article };
  const api = { tweet: () => tweet, copyText: async (text: string) => { copied.push(text); return true; }, toast: (message: string) => { said.push(message); } } as unknown as PluginApi;
  const actions = keyboardActions({ api, text: key => messages[`plugin.keyboard-plus.${key}`] ?? key, win: { location: { assign() {} } } as unknown as Window & typeof globalThis });
  assert.deepEqual(Object.keys(actions), ['c', 'C', 'v', 'a', 'q']);
  await actions.c!(article);
  await actions.C!(article);
  actions.v!(article);
  actions.a!(article);
  actions.q!(article);
  assert.deepEqual(copied, ['https://x.com/someone/status/1', 'hello']);
  assert.deepEqual(clicked, ['photo', 'author']);
  assert.deepEqual(said, ['Link copied', 'Text copied', 'No quoted post']);
  // In the page: a key without a focused post does nothing.
  const env = areaPage();
  env.registry.setFlags(flagsOnly({ 'navigation.keyboardPlus': true }));
  let prevented = 0;
  env.doc.emit('keydown', { key: 'c', target: null, preventDefault() { prevented += 1; }, stopPropagation() {} });
  assert.equal(prevented, 0, 'no post is focused');
  env.registry.dispose();
});

/** Selector specificity [ids, classes/attributes/pseudo-classes, types] of one complex selector
 *  (enough for the rules here: :is/:not/:has count their most specific argument, :where nothing). */
function specificity(selector: string): [number, number, number] {
  const total: [number, number, number] = [0, 0, 0];
  const add = (s: [number, number, number]) => { total[0] += s[0]; total[1] += s[1]; total[2] += s[2]; };
  let rest = selector;
  for (;;) {
    const match = /:(is|not|has|where)\(/.exec(rest);
    if (!match) break;
    let depth = 1; let i = match.index + match[0].length;
    for (; i < rest.length && depth; i++) { if (rest[i] === '(') depth++; else if (rest[i] === ')') depth--; }
    const inner = rest.slice(match.index + match[0].length, i - 1);
    if (match[1] !== 'where') {
      const args = inner.split(/,(?![^(]*\))/).map(arg => specificity(arg.trim()));
      add(args.reduce((best, s) => (s[0] - best[0] || s[1] - best[1] || s[2] - best[2]) > 0 ? s : best));
    }
    rest = rest.slice(0, match.index) + ' ' + rest.slice(i);
  }
  rest = rest.replace(/\[[^\]]*\]/g, () => { total[1]++; return ' '; });
  total[0] += (rest.match(/#[\w-]+/g) ?? []).length;
  total[1] += (rest.match(/\.[\w-]+|:[\w-]+/g) ?? []).length;
  total[2] += (rest.replace(/[#.:][\w-]+/g, ' ').match(/(^|[\s>+~])[a-z][\w-]*/gi) ?? []).length;
  return total;
}
const beats = (a: [number, number, number], b: [number, number, number]) => (a[0] - b[0] || a[1] - b[1] || a[2] - b[2]) > 0;

test('Navigation+: full-width timeline wins over a theme with a layout of its own', () => {
  // The Classic Twitter theme's layout rules as the theme engine served them on live x.com
  // (2026-10-01): both !important, so only specificity decides against ours.
  const theme = [
    '[data-testid="primaryColumn"]:is(.r-1ye8kvj)',
    'main[role="main"] > div:is(.r-113js5t):has([data-testid="primaryColumn"]:is(.r-1ye8kvj)):has([data-testid="sidebarColumn"]:is(.r-1hycxz))',
    'main[role="main"] > div:is(.r-33ulu8):has([data-testid="primaryColumn"]:is(.r-1ye8kvj)):not(:has([data-testid="sidebarColumn"]:is(.r-1hycxz)))',
  ].map(specificity);
  assert.deepEqual(specificity('[data-testid="primaryColumn"]:is(.r-1ye8kvj)'), [0, 2, 0]);
  const css = NAVIGATION_CSS.fullWidthTimeline();
  const selectors = [...css.matchAll(/^([^{}\n]+)\{/gm)].flatMap(match => match[1]!.split(/,(?![^(]*\))/).map(item => item.trim()));
  assert.equal(selectors.length, 3);
  for (const selector of selectors) for (const rule of theme) assert.ok(beats(specificity(selector), rule), `${selector} outranks ${rule.join(',')}`);
  // The id only lifts the rules: no element carries it, and the chat row stays excluded.
  assert.match(css, /#bt-navigation-full-width/);
  assert.equal((css.match(/dm-container/g) ?? []).length, 2);
  assert.doesNotMatch(css, /:has\([^)]*:has\(/);
});

test('Navigation+: Today\'s News goes with its card (live 2026-10-01: the testid is only the card\'s empty tracker)', () => {
  // Live shape of the right column's news card: <div card><div data-testid="news_sidebar"> (an empty
  // impression tracker)</div><div>heading "Today's News", the stories</div></div>, next to an NFL card.
  // Hiding only the testid left the heading and the stories on screen.
  const css = NAVIGATION_CSS.hideTodaysNews();
  const selectors = css.replace(/\{[^}]*\}/, '').split(/,\n/).map(item => item.trim());
  assert.ok(selectors.includes('[data-testid="sidebarColumn"] div:has(> [data-testid="news_sidebar"])'), 'the card holding the tracker as a direct child');
  // Only the card: every selector names the tracker, and the card one only as a direct child in the right column.
  for (const selector of selectors) assert.match(selector, /news_sidebar/, selector);
  assert.doesNotMatch(css, /div:has\([^>]*\[data-testid="news_sidebar"\]\)/, 'never "any div that contains it somewhere" (that would take the whole column)');
  assert.doesNotMatch(css, /:has\([^)]*:has\(/);
});