"use strict";
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
        if (ar || !(i in from)) {
            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
            ar[i] = from[i];
        }
    }
    return to.concat(ar || Array.prototype.slice.call(from));
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = __importDefault(require("react"));
var react_2 = require("@testing-library/react");
var dndKit_1 = require("../test-utils/dndKit");
jest.mock('@dnd-kit/core', function () { return dndKit_1.mockDndKit; });
var VerticalHeadingsTable_1 = __importDefault(require("./VerticalHeadingsTable"));
var setUp = function (props) {
    var containerRef = {
        current: {
            clientHeight: 500,
            clientWidth: 500,
            getBoundingClientRect: function () {
                return {
                    top: 0,
                    left: 0
                };
            }
        }
    };
    return (0, react_2.render)(react_1.default.createElement(VerticalHeadingsTable_1.default, __assign({ containerRef: containerRef }, props)));
};
describe('VerticalHeadingsTable drag and drop tests', function () {
    var rowsData = [
        { id: 'entityCard', label: '' },
        { id: 'matchMethod', label: 'Match Method' },
        { id: 'workflowCard', label: '' },
        { id: 'attributes.FirstName', label: 'First Name' },
        { id: 'attributes.LastName', label: 'Last Name' },
        { id: 'attributes.Int', label: 'Int' }
    ];
    var columnsData = __spreadArray([], new Array(3), true).map(function (_, index) { return ({
        entityCard: "entityCard-".concat(index),
        matchMethod: "matchMethod-".concat(index),
        workflowCard: "workflowCard-".concat(index),
        'attributes.FirstName': "attributes.FirstName-".concat(index),
        'attributes.LastName': "attributes.LastName-".concat(index),
        'attributes.Int': "attributes.Int-".concat(index),
        id: "entities/".concat(index),
        isDraggable: index !== 0
    }); });
    var defaultProps = {
        theadRowsNumber: 2,
        rowsData: rowsData,
        columnsData: columnsData,
        onMoveColumn: jest.fn(),
        onDropColumn: jest.fn(),
        onMoveRow: jest.fn(),
        onDropRow: jest.fn()
    };
    it('should reorder draggable columns correctly', function () {
        setUp(defaultProps);
        var from = react_2.screen.getByText(columnsData[1].entityCard);
        var to = react_2.screen.getByText(columnsData[2].entityCard);
        react_2.fireEvent.mouseDown(from.firstChild);
        react_2.fireEvent.mouseOver(to.parentNode);
        react_2.fireEvent.mouseUp(from.firstChild);
        expect(defaultProps.onMoveColumn).toHaveBeenCalledWith(columnsData[1].id, columnsData[2].id);
        expect(defaultProps.onDropColumn).toHaveBeenCalled();
    });
    it('should reorder draggable rows correctly', function () {
        setUp(defaultProps);
        var from = react_2.screen.getByText(rowsData[3].label);
        var to = react_2.screen.getByText(rowsData[5].label);
        react_2.fireEvent.mouseDown(from.firstChild);
        react_2.fireEvent.mouseOver(to.parentNode);
        react_2.fireEvent.mouseUp(from.firstChild);
        expect(defaultProps.onMoveRow).toHaveBeenCalledWith(rowsData[3].id, rowsData[5].id);
        expect(defaultProps.onDropRow).toHaveBeenCalled();
    });
    it('should render backdrop during drag', function () {
        setUp(defaultProps);
        var draggingRow = react_2.screen.getByText(rowsData[3].label);
        react_2.fireEvent.mouseDown(draggingRow.firstChild);
        expect(document.getElementsByClassName('backDrop')).toHaveLength(1);
        react_2.fireEvent.mouseUp(draggingRow.firstChild);
        expect(document.getElementsByClassName('backDrop')).toHaveLength(0);
        var draggingColumn = react_2.screen.getByText(columnsData[1].entityCard);
        react_2.fireEvent.mouseDown(draggingColumn.firstChild);
        expect(document.getElementsByClassName('backDrop')).toHaveLength(1);
        react_2.fireEvent.mouseUp(draggingColumn.firstChild);
        expect(document.getElementsByClassName('backDrop')).toHaveLength(0);
    });
    it('should render column overlay', function () {
        setUp(defaultProps);
        var draggingColumn = react_2.screen.getByText(columnsData[1].entityCard);
        react_2.fireEvent.mouseDown(draggingColumn.firstChild);
        expect(react_2.screen.getAllByText(columnsData[1].entityCard)).toHaveLength(2);
    });
    it('should render row overlay', function () {
        setUp(defaultProps);
        var draggingRow = react_2.screen.getByText(rowsData[3].label);
        react_2.fireEvent.mouseDown(draggingRow.firstChild);
        expect(react_2.screen.getAllByText(rowsData[3].label)).toHaveLength(2);
    });
});
