@enact/ui/AnnounceDecorator/tests/useAnnounce-specs.js

A collection of simplified unstyled cross-platform UI components for Enact

"use strict";

var _react = require("@testing-library/react");
var _useAnnounce2 = _interopRequireDefault(require("../useAnnounce"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
describe('useAnnounce', function () {
  var announceType;
  function Base(_ref) {
    var children = _ref.children,
      announce = _ref.announce;
    announceType = typeof announce;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      "data-testid": "announce",
      children: children
    });
  }
  function Component() {
    var _useAnnounce = (0, _useAnnounce2["default"])(),
      announce = _useAnnounce.announce,
      children = _useAnnounce.children;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Base, {
      announce: announce,
      children: children
    });
  }
  test('should return an announce function', function () {
    (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {}));
    var expected = 'function';
    expect(announceType).toBe(expected);
  });
  test('should return a single element in children', function () {
    (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {}));
    var expected = 1;
    var baseElementChildrenCount = _react.screen.getByTestId('announce').children.length;
    expect(baseElementChildrenCount).toBe(expected);
  });

  // this might be too specialized to the implementation but we lack a better way to unit test this
  // capability right now
  // TODO: find a relevant scenario that works on testing-library
  test.skip('should set the value passed to announce into the ARIA role="alert" node', function () {
    var text = '__NOTIFY__';
    (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
      "data-testid": "announce-test"
    }));
    var component = _react.screen.getByTestId('announce-test');
    component.find(Base).invoke('announce')(text);
    component.update();
    var expected = text;
    // Have to get the actual DOM node here since Announce updates the DOM directly so the
    // change isn't represented in either the React or Enzyme views
    var actual = component.find({
      role: 'alert'
    }).instance().getAttribute('aria-label');
    expect(actual).toBe(expected);
  });
});