"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 test_utilities_1 = require("../../test-utilities");
const Labelled_1 = require("./Labelled");
const hook_1 = require("./hook");
const context_1 = require("./context");
const defaultProps = {
    children: <Child />,
    label: '',
    htmlFor: '',
    empty: true,
};
describe('<Labelled />', () => {
    it('renders the children', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps}/>);
        expect(labelled).toContainReactComponent(Child);
    });
    it('wraps children with a LabelledContext.Provider', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} label="Email"/>);
        expect(labelled).toProvideReactContext(context_1.LabelledContext);
    });
    it('renders a floating label when the value is prefilled', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} label="Email" empty={false}/>);
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: true,
        }));
    });
    it('does not render a floating label on focus when empty', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} label="Email"/>);
        // Gain focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onFocus');
        });
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: false,
        }));
    });
    it('renders a floating label once a value is entered', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} label="Email"/>);
        // Enter value
        labelled.act(() => {
            labelled.setProps({ empty: false });
        });
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: true,
        }));
    });
    it('renders a floating label when focused, then the value is removed', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} empty={false} label="Email"/>);
        // Gain focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onFocus');
        });
        // Remove value
        labelled.act(() => {
            labelled.setProps({ empty: true });
        });
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: true,
        }));
    });
    it('does not render a floating label when not focused and the value is removed', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} empty={false} label="Email"/>);
        // Remove value
        labelled.act(() => {
            labelled.setProps({ empty: true });
        });
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: false,
        }));
    });
    it('does not render a floating label when focused, then a value is entered, then removed, then the focus is lost', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} label="Email"/>);
        // Gain focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onFocus');
        });
        // Enter value
        labelled.act(() => {
            labelled.setProps({ empty: false });
        });
        // Remove value
        labelled.act(() => {
            labelled.setProps({ empty: true });
        });
        // Lose focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onBlur');
        });
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: false,
        }));
    });
    it('renders a floating label when focused, then a value is entered, then the focus is lost', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} label="Email"/>);
        // Gain focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onFocus');
        });
        // Enter value
        labelled.act(() => {
            labelled.setProps({ empty: false });
        });
        // Lose focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onBlur');
        });
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: true,
        }));
    });
    it('renders a floating label when focused, then a value is entered, then lost focus, then focused, then the value removed', async () => {
        const labelled = test_utilities_1.mountWithContext(<Labelled_1.Labelled {...defaultProps} label="Email"/>);
        // Gain focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onFocus');
        });
        // Enter value
        labelled.act(() => {
            labelled.setProps({ empty: false });
        });
        // Lose focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onBlur');
        });
        // Gain focus
        labelled.act(() => {
            var _a;
            (_a = labelled.find('input')) === null || _a === void 0 ? void 0 : _a.trigger('onFocus');
        });
        // Remove value
        labelled.act(() => {
            labelled.setProps({ empty: true });
        });
        expect(labelled).toProvideReactContext(context_1.LabelledContext, expect.objectContaining({
            floating: true,
        }));
    });
});
function Child({ value }) {
    const { onBlur, onFocus } = hook_1.useLabelled();
    return (<input value={value} onBlur={onBlur} onFocus={onFocus} onChange={() => { }}/>);
}
