const articleSchema = require('./data/eds-c-hero-article-and-book.schema.json');
const articleExample = require('./data/eds-c-hero-article-and-book.example.json');
const { createVariantTests } = require('./eds-c-hero.test');

describe('Hero Article', () => {
    const tests = createVariantTests('Article', articleSchema, articleExample, 'eds-c-hero-article-and-book');

    tests.schemaValidation();
    tests.accessibilityTest();

    tests.renderTest('.eds-c-hero__article-cover', (example) => example.cover);
    tests.renderTest('.eds-c-hero__access', (example) => example.access);
    tests.renderTest('.eds-c-hero__title');
    tests.renderTest('.eds-c-hero__metadata-list', (example) => example.metadata);
    tests.renderTest('.l-with-sidebar');

    tests.customTest('renders cover when provided', (rendered, example) => {
        if (example.cover) {
            const cover = document.querySelector('.eds-c-hero__article-cover');
            expect(cover).toBeTruthy();
            
            if (example.cover.linkUrl) {
                const coverLink = cover.querySelector('a');
                expect(coverLink.getAttribute('href')).toBe(example.cover.linkUrl);
            }
        }
    });

    tests.customTest('renders access badge when provided', (rendered, example) => {
        if (example.access) {
            const accessBadge = document.querySelector('.eds-c-hero__access');
            expect(accessBadge).toBeTruthy();
            
            if (example.access.text) {
                expect(accessBadge.textContent).toContain(example.access.text);
            }
        }
    });

    tests.customTest('renders title with link when provided', (rendered, example) => {
        const titleElement = document.querySelector('.eds-c-hero__title');
        expect(titleElement).toBeTruthy();
        
        if (example.title.linkUrl) {
            const titleLink = titleElement.querySelector('a');
            expect(titleLink.getAttribute('href')).toBe(example.title.linkUrl);
        }
    });

    tests.customTest('renders title as span when headingLevel is not present', (rendered, example) => {
        // Remove headingLevel for this test
        const titleData = { ...example.title };
        delete titleData.headingLevel;

        // Re-render with modified data
        const template = `{{> eds-c-hero-article-and-book }}`;
        const compiled = require('handlebars').compile(template);
        const renderedHtml = compiled({ ...example, title: titleData });
        document.body.innerHTML = renderedHtml;

        const span = document.querySelector('.eds-c-hero__title.eds-c-hero__title--span');
        expect(span).toBeTruthy();

        if (titleData.linkUrl) {
            const link = span.querySelector('a.eds-c-hero__link');
            expect(link).toBeTruthy();
            expect(link.getAttribute('href')).toBe(titleData.linkUrl);
            expect(link.textContent.trim()).toBe(titleData.text);
            expect(renderedHtml).toContain('<span');
            expect(renderedHtml).toContain(`<a href="${titleData.linkUrl}"`);
        } else {
            expect(span.textContent.trim()).toBe(titleData.text);
            expect(span.querySelector('a')).toBeFalsy();
            expect(renderedHtml).toContain('<span');
            expect(renderedHtml).toContain(titleData.text);
            expect(renderedHtml).not.toContain('<a');
        }
    });

});