import React from 'react';
import { render, screen } from '@testing-library/react';
import App from './App';
import '@testing-library/jest-dom';

describe('App Component', () => {
  it('renders header', () => {
    render(<App />);
    const header = screen.getByText(/Markdown Editor/i);
    expect(header).toBeInTheDocument();
  });

  it('renders file list', () => {
    render(<App />);
    const fileList = screen.getByText(/Files/i);
    expect(fileList).toBeInTheDocument();
  });

  it('renders editor', () => {
    render(<App />);
    // Editor is not directly testable without more specific selector
    const header = screen.getByText(/Markdown Editor/i);
    expect(header).toBeInTheDocument();
  });

  it('renders preview section', () => {
    render(<App />);
    const preview = screen.getByText(/Preview/i);
    expect(preview).toBeInTheDocument();
  });
});
