framit/app/composables/useMeta.test.ts

import { describe, it, expect } from 'vitest';
import type { MetaImageOptions, MetaOptions } from './useMeta';

describe('useMeta', () => {
  describe('MetaOptions interface', () => {
    it('should accept required title and description', () => {
      const options: MetaOptions = {
        title: 'Test Page',
        description: 'Test description',
      };

      expect(options.title).toBe('Test Page');
      expect(options.description).toBe('Test description');
      expect(options.image).toBeUndefined();
    });

    it('should accept optional image property', () => {
      const options: MetaOptions = {
        title: 'Test Page',
        description: 'Test description',
        image: {
          url: 'https://example.com/image.jpg',
          alt: 'Alt text',
        },
      };

      expect(options.image).toBeDefined();
      expect(options.image?.url).toBe('https://example.com/image.jpg');
      expect(options.image?.alt).toBe('Alt text');
    });
  });

  describe('MetaImageOptions interface', () => {
    it('should require url and alt properties', () => {
      const imageOptions: MetaImageOptions = {
        url: 'https://example.com/image.png',
        alt: 'Image description',
      };

      expect(imageOptions.url).toBe('https://example.com/image.png');
      expect(imageOptions.alt).toBe('Image description');
    });
  });

  describe('title suffix logic', () => {
    const titleSuffix = ' – Lucien Cartier-Tilet';

    it('should append suffix to title', () => {
      const title = 'My Page';
      const fullTitle = title + titleSuffix;

      expect(fullTitle).toBe('My Page – Lucien Cartier-Tilet');
    });

    it('should handle empty title', () => {
      const title = '';
      const fullTitle = title + titleSuffix;

      expect(fullTitle).toBe(' – Lucien Cartier-Tilet');
    });
  });

  describe('twitter card type logic', () => {
    it('should use summary_large_image when image is provided', () => {
      const image: MetaImageOptions = { url: 'test.jpg', alt: 'Test' };
      const cardType = image ? 'summary_large_image' : 'summary';

      expect(cardType).toBe('summary_large_image');
    });

    it('should use summary when no image is provided', () => {
      const image: MetaImageOptions | undefined = undefined;
      const cardType = image ? 'summary_large_image' : 'summary';

      expect(cardType).toBe('summary');
    });
  });

  describe('optional chaining for image properties', () => {
    it('should return url when image is provided', () => {
      const options: MetaOptions = {
        title: 'Test',
        description: 'Test',
        image: { url: 'https://example.com/og.jpg', alt: 'OG Image' },
      };

      expect(options.image?.url).toBe('https://example.com/og.jpg');
      expect(options.image?.alt).toBe('OG Image');
    });

    it('should return undefined when image is not provided', () => {
      const options: MetaOptions = {
        title: 'Test',
        description: 'Test',
      };

      expect(options.image?.url).toBeUndefined();
      expect(options.image?.alt).toBeUndefined();
    });
  });
});