"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const auto_headings_1 = require("../../utilities/auto-headings");
const test_utilities_1 = require("../../test-utilities");
const Heading_1 = require("./Heading");
describe('<Heading />', () => {
    it('renders its children', () => {
        const text = 'Snowdevil';
        const heading = test_utilities_1.mountWithContext(<Heading_1.Heading>{text}</Heading_1.Heading>);
        expect(heading).toContainReactText(text);
    });
    it('uses a <p> when the role is set to presentation', () => {
        const heading = test_utilities_1.mountWithContext(<Heading_1.Heading role="presentation">Snowdevil</Heading_1.Heading>);
        expect(heading).toContainReactComponent('p');
    });
    it('assigns an id and focusable tabIndex on the element when an id is set', () => {
        const id = 'MyId';
        const heading = test_utilities_1.mountWithContext(<Heading_1.Heading role="presentation" id={id}>
        Snowdevil
      </Heading_1.Heading>);
        expect(heading).toContainReactComponent('p', { id, tabIndex: -1 });
    });
    it('uses a heading based on the semantic heading level', () => {
        const headings = test_utilities_1.mountWithContext(<auto_headings_1.AutoHeadingGroup level={1}>
        <Heading_1.Heading id="one">Snowdevil</Heading_1.Heading>
        <auto_headings_1.AutoHeadingGroup>
          <Heading_1.Heading id="two">History</Heading_1.Heading>
        </auto_headings_1.AutoHeadingGroup>
      </auto_headings_1.AutoHeadingGroup>);
        expect(headings).toContainReactComponent('h1', { id: 'one' });
        expect(headings).toContainReactComponent('h2', { id: 'two' });
    });
});
