life-echo/app-expo/tests/hooks/scene-colors.test.ts

import {
  getChatColors,
  getReadingColors,
} from '@/hooks/use-scene-colors';
import { getThemeColors } from '@/constants/theme-bridge';

const CHAT_KEYS = [
  'background',
  'surface',
  'surfaceContainer',
  'primary',
  'primaryBorder',
  'onPrimary',
  'onSurface',
  'onSurfaceVariant',
  'outline',
  'secondaryContainer',
  'primaryFixed',
  'errorRed',
  'success',
  'sendButtonBackground',
  'sendButtonForeground',
] as const;

const READING_KEYS = [
  'background',
  'backgroundSepia',
  'primary',
  'onSurface',
  'onSurfaceVariant',
  'divider',
  'horizontalRule',
  'surfaceContainerHigh',
  'outlineVariant',
] as const;

describe('scene colors', () => {
  test('getChatColors returns all fields for light and dark', () => {
    for (const scheme of ['light', 'dark'] as const) {
      const chat = getChatColors(getThemeColors(scheme), scheme);
      for (const key of CHAT_KEYS) {
        expect(chat[key]).toBeTruthy();
        expect(typeof chat[key]).toBe('string');
      }
    }
  });

  test('getChatColors light and dark differ', () => {
    const light = getChatColors(getThemeColors('light'), 'light');
    const dark = getChatColors(getThemeColors('dark'), 'dark');
    expect(light.background).not.toEqual(dark.background);
    expect(light.onSurface).not.toEqual(dark.onSurface);
  });

  test('getChatColors dark send button uses accent fill with light label', () => {
    const dark = getChatColors(getThemeColors('dark'), 'dark');
    const theme = getThemeColors('dark');
    expect(dark.sendButtonBackground).toEqual(theme.accent);
    expect(dark.sendButtonForeground).toEqual(theme.accentForeground);
    expect(dark.sendButtonBackground).not.toEqual(dark.sendButtonForeground);
  });

  test('getChatColors light send button uses primary fill with dark label', () => {
    const light = getChatColors(getThemeColors('light'), 'light');
    const theme = getThemeColors('light');
    expect(light.sendButtonBackground).toEqual(theme.primary);
    expect(light.sendButtonForeground).toEqual(theme.text);
    expect(light.sendButtonForeground).not.toEqual(light.sendButtonBackground);
  });

  test('getReadingColors returns all fields for light and dark', () => {
    for (const scheme of ['light', 'dark'] as const) {
      const reading = getReadingColors(getThemeColors(scheme));
      for (const key of READING_KEYS) {
        expect(reading[key]).toBeTruthy();
        expect(typeof reading[key]).toBe('string');
      }
    }
  });

  test('getReadingColors keeps sepia constant across schemes', () => {
    const light = getReadingColors(getThemeColors('light'));
    const dark = getReadingColors(getThemeColors('dark'));
    expect(light.backgroundSepia).toBe('#F2E8CF');
    expect(dark.backgroundSepia).toBe('#F2E8CF');
    expect(light.background).not.toEqual(dark.background);
  });

  test('getReadingColors alpha helpers produce hsla strings', () => {
    const reading = getReadingColors(getThemeColors('light'));
    expect(reading.divider).toMatch(/^hsla\(/);
    expect(reading.horizontalRule).toMatch(/^hsla\(/);
    expect(reading.outlineVariant).toMatch(/^hsla\(/);
  });

  test('getReadingColors sepia uses light foreground on dark scheme', () => {
    const sepiaOnDark = getReadingColors(getThemeColors('dark'), 'sepia');
    const light = getReadingColors(getThemeColors('light'), 'white');
    expect(sepiaOnDark.onSurface).toEqual(light.onSurface);
    expect(sepiaOnDark.onSurfaceVariant).toEqual(light.onSurfaceVariant);
    expect(sepiaOnDark.primary).toEqual(light.primary);
    expect(sepiaOnDark.background).not.toEqual(light.background);
  });
});