import {
  describe,
  expect,
  it
} from 'vitest';

import { applyMobileSafeAreaDefaults, getSafeAreaInsetCSSValue } from './mobile-safe-area.rules';

describe('mobile-safe-area.rules', () => {
  it('builds CSS values with Capacitor and env fallbacks', () => {
    expect(getSafeAreaInsetCSSValue('top')).toBe('var(--safe-area-inset-top, env(safe-area-inset-top, 0px))');
    expect(getSafeAreaInsetCSSValue('bottom')).toBe('var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px))');
  });

  it('sets default safe-area variables on the document root', () => {
    const properties = new Map<string, string>();
    const root = {
      style: {
        getPropertyValue: (property: string) => properties.get(property) ?? '',
        setProperty: (property: string, value: string) => {
          properties.set(property, value);
        }
      }
    } as unknown as HTMLElement;

    applyMobileSafeAreaDefaults(root);

    expect(properties.get('--safe-area-inset-top')).toBe('0px');
    expect(properties.get('--safe-area-inset-right')).toBe('0px');
    expect(properties.get('--safe-area-inset-bottom')).toBe('0px');
    expect(properties.get('--safe-area-inset-left')).toBe('0px');
  });

  it('ignores null roots instead of throwing', () => {
    expect(() => applyMobileSafeAreaDefaults(null)).not.toThrow();
  });
});
