"use strict";

require("@testing-library/jest-dom");
var _react = require("@testing-library/react");
var _ArcSlider = _interopRequireDefault(require("../ArcSlider"));
var _utils = require("../utils");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
var focus = function focus(arcSlider) {
  return _react.fireEvent.focus(arcSlider);
};
var keyDown = function keyDown(keyCode) {
  return function (arcSlider) {
    return _react.fireEvent.keyDown(arcSlider, {
      keyCode: keyCode
    });
  };
};
var downKeyDown = keyDown(40);
var upKeyDown = keyDown(38);
var getElementClientCenter = function getElementClientCenter(element) {
  var _element$getBoundingC = element.getBoundingClientRect(),
    left = _element$getBoundingC.left,
    top = _element$getBoundingC.top,
    width = _element$getBoundingC.width,
    height = _element$getBoundingC.height;
  return {
    x: left + width / 2,
    y: top + height / 2
  };
};
var drag = function drag(element, _ref) {
  var delta = _ref.delta,
    _ref$steps = _ref.steps,
    steps = _ref$steps === void 0 ? 1 : _ref$steps;
  var from = getElementClientCenter(element);
  var to = {
    x: from.x + delta.x,
    y: from.y + delta.y
  };
  var step = {
    x: (to.x - from.x) / steps,
    y: (to.y - from.y) / steps
  };
  var current = {
    clientX: from.x,
    clientY: from.y
  };
  _react.fireEvent.mouseEnter(element, current);
  _react.fireEvent.mouseOver(element, current);
  _react.fireEvent.mouseMove(element, current);
  _react.fireEvent.mouseDown(element, current);
  for (var i = 0; i < steps; i++) {
    current.clientX += step.x;
    current.clientY += step.y;
    (0, _react.act)(function () {
      return jest.advanceTimersByTime(1000 / steps);
    });
    _react.fireEvent.mouseMove(element, current);
  }
};
describe('ArcSlider', function () {
  beforeEach(function () {
    Object.defineProperty(global.SVGSVGElement.prototype, 'createSVGPoint', {
      writable: true,
      value: jest.fn().mockImplementation(function () {
        return {
          x: 0,
          y: 0,
          matrixTransform: jest.fn().mockImplementation(function () {
            return {
              x: 0,
              y: 0
            };
          })
        };
      })
    });
    Object.defineProperty(global.SVGSVGElement.prototype, 'getScreenCTM', {
      writable: true,
      value: jest.fn().mockImplementation(function () {
        return {
          angle: 0,
          matrix: {
            a: 0.6666666666666666,
            b: 0,
            c: 0,
            d: 0.6666666666666666,
            e: 28,
            f: 139,
            multiply: jest.fn()
          },
          inverse: jest.fn().mockImplementation(function () {
            return global.SVGSVGElement;
          })
        };
      })
    });
    jest.useFakeTimers();
  });
  afterEach(function () {
    jest.useRealTimers();
  });
  test('should have `aria-valuetext` equal to value', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      value: 25
    }));
    var arcSlider = _react.screen.getByRole('slider');
    var expected = '25';
    expect(arcSlider).toHaveAttribute('aria-valuetext', expected);
  });
  test('should support custom background color', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      backgroundColor: "#FF0000"
    }));
    var backgroundColor = _react.screen.getByRole('slider').children.item(0).children.item(0);
    var expected = '#FF0000';
    expect(backgroundColor).toHaveAttribute('stroke', expected);
  });
  test('should support custom foreground color', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      foregroundColor: "#00FF00"
    }));
    var foregroundColor = _react.screen.getByRole('slider').children.item(1).children.item(0);
    var expected = '#00FF00';
    expect(foregroundColor).toHaveAttribute('stroke', expected);
  });
  test('should reflect disabled state to `aria-disabled`', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      disabled: true
    }));
    var arcSlider = _react.screen.getByRole('slider');
    var expected = 'true';
    expect(arcSlider).toHaveAttribute('aria-disabled', expected);
  });
  test('should display a node in the center', function () {
    var node = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
      children: "Hello"
    });
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      slotCenter: node
    }));
    var slotCenter = _react.screen.getByRole('slider').children.item(2).children.item(0);
    var expected = 'SPAN';
    var actual = slotCenter.tagName;
    expect(expected).toBe(actual);
  });
  test('should set stroke width', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      strokeWidth: 10
    }));
    var svgPath = _react.screen.getByRole('slider').children.item(0).children.item(0);
    var expected = '10';
    expect(svgPath).toHaveAttribute('stroke-width', expected);
  });
  test('should call `onChange` when value is changed', function () {
    var handleChange = jest.fn();
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      onChange: handleChange
    }));
    var arcSlider = _react.screen.getByRole('slider');
    focus(arcSlider);
    upKeyDown(arcSlider);
    var expected = {
      type: 'onChange',
      value: 1
    };
    var actual = handleChange.mock.calls.length && handleChange.mock.calls[0][0];
    expect(actual).toMatchObject(expected);
  });
  test('should increase value on pressing arrowUp', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {}));
    var arcSlider = _react.screen.getByRole('slider');
    focus(arcSlider);
    upKeyDown(arcSlider);
    upKeyDown(arcSlider);
    upKeyDown(arcSlider);
    var expected = '3';
    expect(arcSlider).toHaveAttribute('aria-valuetext', expected);
  });
  test('should decrease value on pressing arrowDown', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      value: 10
    }));
    var arcSlider = _react.screen.getByRole('slider');
    focus(arcSlider);
    downKeyDown(arcSlider);
    downKeyDown(arcSlider);
    downKeyDown(arcSlider);
    var expected = '7';
    expect(arcSlider).toHaveAttribute('aria-valuetext', expected);
  });
  test('should change `cx` and `cy` values of `circle` on pressing arrowUp', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {}));
    var arcSlider = _react.screen.getByRole('slider');
    var circle = _react.screen.getByRole('slider').children.item(1).children.item(2);
    var originalCx = circle.getAttribute('cx'); // 73.49999999999996
    var originalCy = circle.getAttribute('cy'); // 274.3057343563124

    focus(arcSlider);
    upKeyDown(arcSlider);
    upKeyDown(arcSlider);
    upKeyDown(arcSlider);
    var actualCx = circle.getAttribute('cx'); // 59.354943380054436
    var actualCy = circle.getAttribute('cy'); // 265.0141688530938

    expect(originalCx).not.toBe(actualCx);
    expect(originalCy).not.toBe(actualCy);
  });
  test('should change value on mouse down', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {}));
    var arcSlider = _react.screen.getByRole('slider');
    focus(arcSlider);
    var initialExpected = '0';
    expect(arcSlider).toHaveAttribute('aria-valuetext', initialExpected);
    _react.fireEvent.mouseDown(arcSlider, {
      clientX: 10,
      clientY: 10
    });
    var expected = '48';
    expect(arcSlider).toHaveAttribute('aria-valuetext', expected);
  });
  test('should call onDragStart when dragging', /*#__PURE__*/_asyncToGenerator(function* () {
    var handleDragStart = jest.fn();
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      onDragStart: handleDragStart
    }));
    var arcSlider = _react.screen.getByRole('slider');
    focus(arcSlider);
    yield drag(arcSlider, {
      delta: {
        x: 0,
        y: 100
      }
    });
    expect(handleDragStart).toHaveBeenCalled();
  }));
  test('should have `#343434` foreground color with `carbon` skin', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      skin: "carbon"
    }));
    var foregroundColor = _react.screen.getByRole('slider').children.item(1).children.item(0);
    var expected = '#343434';
    expect(foregroundColor).toHaveAttribute('stroke', expected);
  });
  test('should have `#ffffff` foreground color with night mode', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArcSlider["default"], {
      skinVariants: {
        night: true
      }
    }));
    var foregroundColor = _react.screen.getByRole('slider').children.item(1).children.item(0);
    var expected = '#ffffff';
    expect(foregroundColor).toHaveAttribute('stroke', expected);
  });
  describe('utils', function () {
    test('should convert a given value to a corresponding angle', function () {
      var value = 25;
      var expected = 85;
      var actual = (0, _utils.valueToAngle)(value, 0, 100, 30, 250);
      expect(actual).toBe(expected);
    });
    test('should convert a given angle to a corresponding value', function () {
      var angle = 85;
      var expected = 25;
      var actual = (0, _utils.angleToValue)(angle, 0, 100, 30, 250);
      expect(actual).toBe(expected);
    });
    test('should return min if `angle` is less than `startAngle`', function () {
      var angle = 20;
      var min = 0;
      var value = (0, _utils.angleToValue)(angle, min, 100, 30, 250);
      expect(value).toBe(min);
    });
    test('should return max if `angle` is greater than `endAngle`', function () {
      var angle = 260;
      var max = 100;
      var value = (0, _utils.angleToValue)(angle, 0, max, 30, 250);
      expect(value).toBe(max);
    });
  });
});