@enact/sandstone/Spinner/tests/Spinner-specs.js

Large-screen/TV support library for Enact, containing a variety of UI components.

"use strict";

var _FloatingLayer = require("@enact/ui/FloatingLayer");
require("@testing-library/jest-dom");
var _react = require("@testing-library/react");
var _Spinner = _interopRequireDefault(require("../Spinner"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
var FloatingLayerController = (0, _FloatingLayer.FloatingLayerDecorator)('div');
describe('Spinner Specs', function () {
  test('should not have client node when Spinner has no children', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {}));
    var spinner = _react.screen.getByRole('alert');
    var children = spinner.children;
    expect(children.length).toEqual(1);
    expect(children.item(0)).toHaveClass('bg');
    expect(children.item(1)).not.toBeInTheDocument();
  });
  test('should have a client node when Spinner has children', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {
      children: "Loading..."
    }));
    var spinner = _react.screen.getByRole('alert');
    var childClient = spinner.children.item(1);
    expect(childClient).toHaveClass('client');
  });
  test('should have content class when Spinner has children', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {
      children: "Loading..."
    }));
    var spinner = _react.screen.getByRole('alert');
    expect(spinner).toHaveClass('content');
  });
  test('should have transparent class when transparent prop equals true', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {
      transparent: true,
      children: "Loading..."
    }));
    var spinner = _react.screen.getByRole('alert');
    expect(spinner).toHaveClass('transparent');
  });
  test('should set role to alert by default', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {}));
    var spinner = _react.screen.getByLabelText('Loading');
    expect(spinner).toHaveAttribute('role', 'alert');
  });
  test('should set aria-live to off by default', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {}));
    var spinner = _react.screen.getByRole('alert');
    expect(spinner).toHaveAttribute('aria-live', 'off');
  });
  test('should apply custom aria-label to spinner', function () {
    var customAriaLabel = 'custom aria label';
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {
      "aria-label": customAriaLabel
    }));
    var spinner = _react.screen.getByRole('alert');
    expect(spinner).toHaveAttribute('aria-label', customAriaLabel);
  });
  test('should render a spinner with \'blockClickOn\' = \'screen\' inside FloatingLayer', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner["default"], {
        blockClickOn: "screen"
      })
    }));
    var floatingLayer = _react.screen.getByRole('alert').parentElement;
    var expectedClass = 'floatingLayer';
    expect(floatingLayer).toHaveClass(expectedClass);
  });
});