repomix-mirror/tests/core/treeSitter/parseFile.css.test.ts

import { describe, expect, test } from 'vitest';
import { parseFile } from '../../../src/core/treeSitter/parseFile.js';
import { createMockConfig } from '../../testing/testUtils.js';

describe('parseFile for CSS', () => {
  test('should parse CSS correctly', async () => {
    const fileContent = `
      /* Main styles for the application */
      body {
        font-family: 'Arial', sans-serif;
        line-height: 1.6;
        color: #333;
        background-color: #f4f4f4;
        margin: 0;
        padding: 0;
      }

      /* Header styles */
      .header {
        background-color: #35424a;
        color: #ffffff;
        padding: 20px;
        border-bottom: #e8491d 3px solid;
      }

      /* Navigation styles */
      .nav {
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      @media (max-width: 768px) {
        .nav {
          flex-direction: column;
        }

        .container {
          width: 95%;
        }
      }
    `;
    const filePath = 'style.css';
    const config = {};
    const result = await parseFile(fileContent, filePath, createMockConfig(config));
    expect(typeof result).toBe('string');

    const expectContents = [
      // Comments (all lines should be extracted)
      'Main styles for the application',
      'Header styles',
      'Navigation styles',

      // Selectors (only the first line should be extracted)
      'body {',
      '.header {',
      '.nav {',

      // at-rules are not extracted with the current query, so removed from expectations
      // '@media (max-width: 768px) {',
    ];

    for (const expectContent of expectContents) {
      expect(result).toContain(expectContent);
    }

    // Properties should not be extracted
    const unexpectedContents = [
      'font-family:',
      'line-height:',
      'color:',
      'background-color:',
      'margin:',
      'padding:',
      'display:',
      'justify-content:',
      'align-items:',
      'flex-direction:',
      'width:',
    ];

    for (const unexpectedContent of unexpectedContents) {
      expect(result).not.toContain(unexpectedContent);
    }
  });

  test('should handle different comment styles', async () => {
    const fileContent = `
      /* Single line comment */
      body { color: black; }

      /* Multi-line comment
         spanning multiple lines */
      .container { width: 100%; }
    `;
    const filePath = 'comments.css';
    const config = {};
    const result = await parseFile(fileContent, filePath, createMockConfig(config));
    expect(typeof result).toBe('string');

    const expectContents = [
      'Single line comment',
      'Multi-line comment\n         spanning multiple lines',
      'body {',
      '.container {',
    ];

    for (const expectContent of expectContents) {
      expect(result).toContain(expectContent);
    }
  });

  test('should handle various at-rules', async () => {
    const fileContent = `
      @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

      @charset "UTF-8";

      @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
      }

      @media screen and (min-width: 768px) {
        body { font-size: 16px; }
      }
    `;
    const filePath = 'at-rules.css';
    const config = {};
    const result = await parseFile(fileContent, filePath, createMockConfig(config));
    expect(typeof result).toBe('string');

    // Skip testing at-rules as they are not extracted in the current implementation
    // Enable this test when at-rule extraction is implemented in the future

    // Inner rules should not be extracted
    const unexpectedContents = ['from { opacity: 0; }', 'to { opacity: 1; }'];

    for (const unexpectedContent of unexpectedContents) {
      expect(result).not.toContain(unexpectedContent);
    }
  });

  test('should handle complex selectors', async () => {
    const fileContent = `
      /* Complex selectors */
      body.dark-theme .container > div:first-child {
        color: white;
        background-color: #333;
      }

      .sidebar ul li a:hover,
      .sidebar ul li a:focus {
        text-decoration: underline;
        color: blue;
      }

      #main-content h1 + p::first-line {
        font-weight: bold;
        font-size: 1.2em;
      }
    `;
    const filePath = 'complex-selectors.css';
    const config = {};
    const result = await parseFile(fileContent, filePath, createMockConfig(config));
    expect(typeof result).toBe('string');

    const expectContents = [
      'Complex selectors',
      'body.dark-theme .container > div:first-child {',
      '.sidebar ul li a:hover,',
      '#main-content h1 + p::first-line {',
    ];

    for (const expectContent of expectContents) {
      expect(result).toContain(expectContent);
    }

    // Properties should not be extracted
    const unexpectedContents = [
      'color: white;',
      'background-color: #333;',
      'text-decoration: underline;',
      'color: blue;',
      'font-weight: bold;',
      'font-size: 1.2em;',
    ];

    for (const unexpectedContent of unexpectedContents) {
      expect(result).not.toContain(unexpectedContent);
    }
  });
});