@pingux/astro 2.0.0-alpha.1 → 2.0.0-alpha.4

package/lib/cjs/components/Menu/Menu.test.js

@@ -1,29 +1,17 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-
 var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
-
 var _set = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-
-var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
-
-var _testWrapper = require("../../utils/testUtils/testWrapper");
-
 var _index = require("../../index");
-
 var _orientation = _interopRequireDefault(require("../../utils/devUtils/constants/orientation"));
-
+var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
+var _testWrapper = require("../../utils/testUtils/testWrapper");
 var _react2 = require("@emotion/react");
-
 var testTitle = 'Test Title';
 var defaultProps = {
   title: testTitle,
@@ -39,7 +27,6 @@ var defaultItems = [{
   key: 'c',
   children: 'C'
 }];
-
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return (0, _testWrapper.render)((0, _react2.jsx)(_index.Menu, (0, _extends2["default"])({}, defaultProps, props), (0, _map["default"])(defaultItems).call(defaultItems, function (item) {
@@ -47,19 +34,15 @@ var getComponent = function getComponent() {
       key: item.key
     }, item));
   })));
-}; // Need to be added to each test file to test accessibility using axe.
-
+};
 
+// Need to be added to each test file to test accessibility using axe.
 (0, _testAxe["default"])(getComponent);
 test('should render basic menu with children', function () {
   getComponent();
-
   var menu = _testWrapper.screen.queryByRole('menu');
-
   expect(menu).toBeInTheDocument();
-
   var menuItems = _testWrapper.screen.queryAllByRole('menuitem');
-
   expect(menuItems).toHaveLength(3);
   expect(menu).toHaveAttribute('aria-orientation', _orientation["default"].VERTICAL);
 });
@@ -67,69 +50,53 @@ test('should render items when selectionMode is set to single', function () {
   getComponent({
     selectionMode: 'single'
   });
-
   var menu = _testWrapper.screen.queryByRole('menu');
-
   expect(menu).toBeInTheDocument();
-
   var menuItems = _testWrapper.screen.queryAllByRole('menuitemradio');
-
   expect(menuItems).toHaveLength(3);
 });
 test('should render items when selectionMode is set to multiple', function () {
   getComponent({
     selectionMode: 'multiple'
   });
-
   var menu = _testWrapper.screen.queryByRole('menu');
-
   expect(menu).toBeInTheDocument();
-
   var menuItems = _testWrapper.screen.queryAllByRole('menuitemcheckbox');
-
   expect(menuItems).toHaveLength(3);
 });
 test('applies disabled class with disabled prop', function () {
   getComponent({
     isDisabled: true
   });
-
   var menuItems = _testWrapper.screen.getAllByRole('menuitem');
-
   (0, _forEach["default"])(menuItems).call(menuItems, function (item) {
     return expect(item).toHaveClass('is-disabled');
   });
 });
 test('should be able to navigate through the items with the keyboard', function () {
   getComponent();
-
   var menuItems = _testWrapper.screen.getAllByRole('menuitem');
+  expect(menuItems[0]).not.toHaveFocus();
 
-  expect(menuItems[0]).not.toHaveFocus(); // Need to tab to them first
-
+  // Need to tab to them first
   _userEvent["default"].tab();
+  expect(menuItems[0]).toHaveFocus();
 
-  expect(menuItems[0]).toHaveFocus(); // Then we can use the arrow keys
-
+  // Then we can use the arrow keys
   _testWrapper.fireEvent.keyDown(menuItems[0], {
     key: 'ArrowDown'
   });
-
   _testWrapper.fireEvent.keyUp(menuItems[0], {
     key: 'ArrowDown'
   });
-
   expect(menuItems[0]).not.toHaveFocus();
   expect(menuItems[1]).toHaveFocus();
-
   _testWrapper.fireEvent.keyDown(menuItems[1], {
     key: 'ArrowDown'
   });
-
   _testWrapper.fireEvent.keyUp(menuItems[1], {
     key: 'ArrowDown'
   });
-
   expect(menuItems[1]).not.toHaveFocus();
   expect(menuItems[2]).toHaveFocus();
 });
@@ -138,25 +105,21 @@ test('should fire onAction', function () {
   getComponent({
     onAction: onAction
   });
-
   var menuItems = _testWrapper.screen.getAllByRole('menuitem');
+  expect(onAction).not.toHaveBeenCalled();
 
-  expect(onAction).not.toHaveBeenCalled(); // Keyboard events
-
+  // Keyboard events
   _userEvent["default"].tab();
-
   _testWrapper.fireEvent.keyDown(menuItems[0], {
     key: 'Enter'
   });
-
   _testWrapper.fireEvent.keyUp(menuItems[0], {
     key: 'Enter'
   });
+  expect(onAction).toHaveBeenNthCalledWith(1, defaultItems[0].key);
 
-  expect(onAction).toHaveBeenNthCalledWith(1, defaultItems[0].key); // Click events
-
+  // Click events
   _userEvent["default"].click(menuItems[1]);
-
   expect(onAction).toHaveBeenNthCalledWith(2, defaultItems[1].key);
 });
 test('should not fire onSelectionChange when selectionMode is none', function () {
@@ -164,25 +127,21 @@ test('should not fire onSelectionChange when selectionMode is none', function ()
   getComponent({
     onSelectionChange: onSelectionChange
   });
-
   var menuItems = _testWrapper.screen.getAllByRole('menuitem');
+  expect(onSelectionChange).not.toHaveBeenCalled();
 
-  expect(onSelectionChange).not.toHaveBeenCalled(); // Keyboard events
-
+  // Keyboard events
   _userEvent["default"].tab();
-
   _testWrapper.fireEvent.keyDown(menuItems[0], {
     key: 'Enter'
   });
-
   _testWrapper.fireEvent.keyUp(menuItems[0], {
     key: 'Enter'
   });
+  expect(onSelectionChange).not.toHaveBeenCalled();
 
-  expect(onSelectionChange).not.toHaveBeenCalled(); // Click events
-
+  // Click events
   _userEvent["default"].click(menuItems[1]);
-
   expect(onSelectionChange).not.toHaveBeenCalled();
 });
 test('should fire onSelectionChange when selectionMode is not none', function () {
@@ -191,25 +150,21 @@ test('should fire onSelectionChange when selectionMode is not none', function ()
     onSelectionChange: onSelectionChange,
     selectionMode: 'single'
   });
-
   var menuItems = _testWrapper.screen.getAllByRole('menuitemradio');
+  expect(onSelectionChange).not.toHaveBeenCalled();
 
-  expect(onSelectionChange).not.toHaveBeenCalled(); // Keyboard events
-
+  // Keyboard events
   _userEvent["default"].tab();
-
   _testWrapper.fireEvent.keyDown(menuItems[0], {
     key: 'Enter'
   });
-
   _testWrapper.fireEvent.keyUp(menuItems[0], {
     key: 'Enter'
   });
+  expect(onSelectionChange).toHaveBeenNthCalledWith(1, expect.any(_set["default"]));
 
-  expect(onSelectionChange).toHaveBeenNthCalledWith(1, expect.any(_set["default"])); // Click events
-
+  // Click events
   _userEvent["default"].click(menuItems[1]);
-
   expect(onSelectionChange).toHaveBeenNthCalledWith(2, expect.any(_set["default"]));
 });
 test('props passed through others are passed to menu', function () {
@@ -218,9 +173,7 @@ test('props passed through others are passed to menu', function () {
       bg: 'red'
     }
   });
-
   var menu = _testWrapper.screen.queryByRole('menu');
-
   expect(menu).toBeInTheDocument();
   expect(menu).toHaveStyle('background-color: red');
 });

package/lib/cjs/components/Menu/index.js

@@ -1,18 +1,14 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 _Object$defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
     return _Menu["default"];
   }
 });
-
 var _Menu = _interopRequireDefault(require("./Menu"));

package/lib/cjs/components/MenuItem/MenuItem.js

@@ -1,134 +1,102 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireWildcard(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _reactAria = require("react-aria");
-
 var _interactions = require("@react-aria/interactions");
-
+var _propTypes = _interopRequireDefault(require("prop-types"));
 var _MenuContext = require("../../context/MenuContext");
-
 var _hooks = require("../../hooks");
-
-var _Box = _interopRequireDefault(require("../Box"));
-
 var _isIterable = require("../../utils/devUtils/props/isIterable");
-
+var _Box = _interopRequireDefault(require("../Box"));
 var _react2 = require("@emotion/react");
-
 var _excluded = ["isSeparator", "isPressed", "data-id"];
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 /**
  * Menu Item component intended to be used within Menu or PopupMenu.
  * This component is not intented to be used outside of Menu or independently.
  * Utilizes [React Aria](https://react-spectrum.adobe.com/react-aria/useMenu.html)
  */
+
 var MenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var item = props.item,
-      propIsDisabled = props.isDisabled,
-      isFocusVisible = props.isFocusVisible,
-      isNotFocusedOnHover = props.isNotFocusedOnHover,
-      className = props.className,
-      onAction = props.onAction,
-      state = props.state;
-
+    propIsDisabled = props.isDisabled,
+    isFocusVisible = props.isFocusVisible,
+    isNotFocusedOnHover = props.isNotFocusedOnHover,
+    className = props.className,
+    onAction = props.onAction,
+    state = props.state;
   var _useMenuContext = (0, _MenuContext.useMenuContext)(),
-      onClose = _useMenuContext.onClose,
-      closeOnSelect = _useMenuContext.closeOnSelect;
-
+    onClose = _useMenuContext.onClose,
+    closeOnSelect = _useMenuContext.closeOnSelect;
   var key = item.key,
-      rendered = item.rendered,
-      itemProps = item.props;
+    rendered = item.rendered,
+    itemProps = item.props;
   var isSeparator = itemProps.isSeparator,
-      propIsPressed = itemProps.isPressed,
-      dataId = itemProps['data-id'],
-      others = (0, _objectWithoutProperties2["default"])(itemProps, _excluded);
+    propIsPressed = itemProps.isPressed,
+    dataId = itemProps['data-id'],
+    others = (0, _objectWithoutProperties2["default"])(itemProps, _excluded);
   var isDisabled = propIsDisabled || state.disabledKeys.has(key);
   var isSelected = state.selectionManager.isSelected(key);
   var menuItemRef = (0, _react.useRef)();
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
   /* istanbul ignore next */
-
   (0, _react.useImperativeHandle)(ref, function () {
     return menuItemRef.current;
   });
-
   var _useMenuItem = (0, _reactAria.useMenuItem)({
-    key: item.key,
-    'aria-label': item['aria-label'],
-    isDisabled: isDisabled,
-    onAction: onAction,
-    isSelected: isSelected,
-    onClose: onClose,
-    closeOnSelect: closeOnSelect
-  }, state, menuItemRef),
-      menuItemProps = _useMenuItem.menuItemProps;
-
+      key: item.key,
+      'aria-label': item['aria-label'],
+      isDisabled: isDisabled,
+      onAction: onAction,
+      isSelected: isSelected,
+      onClose: onClose,
+      closeOnSelect: closeOnSelect
+    }, state, menuItemRef),
+    menuItemProps = _useMenuItem.menuItemProps;
   var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      isFocused = _useState2[0],
-      setFocused = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    isFocused = _useState2[0],
+    setFocused = _useState2[1];
   var _usePress = (0, _interactions.usePress)({
-    ref: menuItemRef,
-    isDisabled: isDisabled,
-    isPressed: propIsPressed
-  }),
-      pressProps = _usePress.pressProps,
-      isPressed = _usePress.isPressed;
-
+      ref: menuItemRef,
+      isDisabled: isDisabled,
+      isPressed: propIsPressed
+    }),
+    pressProps = _usePress.pressProps,
+    isPressed = _usePress.isPressed;
   var _useFocus = (0, _interactions.useFocus)({
-    onFocusChange: setFocused
-  }),
-      focusProps = _useFocus.focusProps;
-
+      onFocusChange: setFocused
+    }),
+    focusProps = _useFocus.focusProps;
   var _useHover = (0, _interactions.useHover)({
-    isDisabled: isDisabled
-  }),
-      hoverProps = _useHover.hoverProps,
-      isHovered = _useHover.isHovered;
-
+      isDisabled: isDisabled
+    }),
+    hoverProps = _useHover.hoverProps,
+    isHovered = _useHover.isHovered;
   var _useStatusClasses = (0, _hooks.useStatusClasses)(className, {
-    isFocused: isFocused || isHovered && !isFocusVisible,
-    isDisabled: isDisabled,
-    isSelected: isSelected,
-    isPressed: isPressed
-  }),
-      classNames = _useStatusClasses.classNames;
-
+      isFocused: isFocused || isHovered && !isFocusVisible,
+      isDisabled: isDisabled,
+      isSelected: isSelected,
+      isPressed: isPressed
+    }),
+    classNames = _useStatusClasses.classNames;
   if (isNotFocusedOnHover) {
     delete menuItemProps.onPointerEnter;
     delete menuItemProps.onPointerLeave;
   }
-
   return (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({
     as: "li",
     className: classNames,
@@ -142,30 +110,23 @@ MenuItem.displayName = 'MenuItem';
 MenuItem.propTypes = {
   /** Whether the item is disabled. */
   isDisabled: _propTypes["default"].bool,
-
   /** Whether the menu item is selected. */
   isSelected: _propTypes["default"].bool,
-
   /** Whether the menu item is currently pressed. */
   isPressed: _propTypes["default"].bool,
-
   /**
    * Whether the containing menu has keyboard focus.
    * Used to determine when to present hover vs focus styling.
    */
   isFocusVisible: _propTypes["default"].bool,
-
   /**
    * Whether menu item should receive focus state on hover.
    */
   isNotFocusedOnHover: _propTypes["default"].bool,
-
   /** A screen reader only label for the menu item. */
   'aria-label': _propTypes["default"].string,
-
   /** Handler that is called when the menu should close after selecting an item. */
   onClose: _propTypes["default"].func,
-
   /** Handler that is called when the user activates the item. */
   onAction: _propTypes["default"].func,
   item: _propTypes["default"].shape({

package/lib/cjs/components/MenuItem/MenuItem.styles.js

@@ -1,11 +1,9 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
 var item = {
   bg: 'transparent',

package/lib/cjs/components/MenuItem/MenuItem.test.js

@@ -1,27 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-
 var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
-
 var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-
+var _index = require("../../index");
 var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
-
 var _testWrapper = require("../../utils/testUtils/testWrapper");
-
-var _index = require("../../index");
-
 var _react2 = require("@emotion/react");
-
 var testId = 'testId';
 var defaultMenuItems = [{
   key: 'MenuItem 1',
@@ -41,16 +30,13 @@ var defaultProps = {
   defaultSelectedKey: defaultMenuItems[0].key,
   'aria-label': 'testLabel'
 };
-
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
   var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-      _ref$items = _ref.items,
-      items = _ref$items === void 0 ? defaultMenuItems : _ref$items,
-      _ref$renderFn = _ref.renderFn,
-      renderFn = _ref$renderFn === void 0 ? _testWrapper.render : _ref$renderFn;
-
+    _ref$items = _ref.items,
+    items = _ref$items === void 0 ? defaultMenuItems : _ref$items,
+    _ref$renderFn = _ref.renderFn,
+    renderFn = _ref$renderFn === void 0 ? _testWrapper.render : _ref$renderFn;
   return renderFn((0, _react2.jsx)(_index.Menu, (0, _extends2["default"])({}, defaultProps, props), (0, _map["default"])(items).call(items, function (li) {
     return (0, _react2.jsx)(_index.Item, (0, _extends2["default"])({
       key: li.key
@@ -60,17 +46,14 @@ var getComponent = function getComponent() {
       }
     }));
   })));
-}; // Need to be added to each test file to test accessibility using axe.
-
+};
 
+// Need to be added to each test file to test accessibility using axe.
 (0, _testAxe["default"])(getComponent);
 test('renders menu with menu items', function () {
   getComponent();
-
   var menu = _testWrapper.screen.getByRole('menu');
-
   var menuItems = _testWrapper.screen.getAllByRole('menuitem');
-
   expect(menu).toBeInTheDocument();
   expect(menuItems).toHaveLength(menuItems.length);
   (0, _forEach["default"])(menuItems).call(menuItems, function (item) {
@@ -80,14 +63,10 @@ test('renders menu with menu items', function () {
 test('applies focus when tabbed to', function () {
   getComponent();
   var itemText = defaultMenuItems[0].children;
-
   var menuItem = _testWrapper.screen.getByText(itemText);
-
   expect(menuItem).not.toHaveFocus();
   expect(menuItem).not.toHaveClass('is-focused');
-
   _userEvent["default"].tab();
-
   expect(menuItem).toHaveFocus();
   expect(menuItem).toHaveClass('is-focused');
 });
@@ -95,24 +74,17 @@ test('can arrow through menuItems', function () {
   getComponent();
   var itemText1 = defaultMenuItems[0].children;
   var itemText2 = defaultMenuItems[1].children;
-
   var menuItem1 = _testWrapper.screen.getByText(itemText1);
-
   var menuItem2 = _testWrapper.screen.getByText(itemText2);
-
   expect(menuItem1).not.toHaveFocus();
   expect(menuItem1).not.toHaveClass('is-focused');
-
   _userEvent["default"].tab();
-
   expect(menuItem1).toHaveFocus();
   expect(menuItem1).toHaveClass('is-focused');
-
   _testWrapper.fireEvent.keyDown(menuItem1, {
     key: 'ArrowDown',
     code: 'ArrowDown'
   });
-
   expect(menuItem2).toHaveFocus();
   expect(menuItem2).toHaveClass('is-focused');
 });
@@ -121,41 +93,26 @@ test('hovering menuItems applies focus class and removes focus style on unhover
     isNotFocusedOnHover: true
   });
   var itemText1 = defaultMenuItems[0].children;
-
   var menuItem1 = _testWrapper.screen.getByText(itemText1);
-
   expect(menuItem1).not.toHaveClass('is-focused');
-
   _userEvent["default"].hover(menuItem1);
-
   expect(menuItem1).toHaveClass('is-focused');
-
   _userEvent["default"].unhover(menuItem1);
-
   expect(menuItem1).not.toHaveClass('is-focused');
 });
 test('hovering menuItems applies focus class and leaves focus style on unhover', function () {
   getComponent();
   var itemText1 = defaultMenuItems[0].children;
   var itemText2 = defaultMenuItems[1].children;
-
   var menuItem1 = _testWrapper.screen.getByText(itemText1);
-
   var menuItem2 = _testWrapper.screen.getByText(itemText2);
-
   expect(menuItem1).not.toHaveClass('is-focused');
   expect(menuItem2).not.toHaveClass('is-focused');
-
   _userEvent["default"].hover(menuItem1);
-
   expect(menuItem1).toHaveClass('is-focused');
-
   _userEvent["default"].hover(menuItem2);
-
   expect(menuItem2).toHaveClass('is-focused');
-
   _userEvent["default"].unhover(menuItem2);
-
   expect(menuItem2).toHaveClass('is-focused');
 });
 test('disables item with isDisabled applied, does not disable without prop', function () {
@@ -163,14 +120,10 @@ test('disables item with isDisabled applied, does not disable without prop', fun
     disabledKeys: [defaultMenuItems[0].key]
   });
   var disbaledItemText = defaultMenuItems[0].children;
-
   var disabledMenuItem = _testWrapper.screen.getByText(disbaledItemText);
-
   expect(disabledMenuItem).toHaveClass('is-disabled');
   var menuItemText = defaultMenuItems[1].children;
-
   var menuItem = _testWrapper.screen.getByText(menuItemText);
-
   expect(menuItem).not.toHaveClass('is-disabled');
 });
 test('should change styles according to isPressed prop', function () {
@@ -179,11 +132,8 @@ test('should change styles according to isPressed prop', function () {
   getComponent({}, {
     items: customItems
   });
-
   var pressedItem = _testWrapper.screen.getAllByRole('menuitem')[0];
-
   var regularItem = _testWrapper.screen.getAllByRole('menuitem')[1];
-
   expect(pressedItem).toHaveClass('is-pressed');
   expect(regularItem).not.toHaveClass('is-pressed');
 });
@@ -193,29 +143,21 @@ test('applies selected styling with isSelected prop, does not add class without
     defaultSelectedKeys: [defaultMenuItems[0].key]
   });
   var selectedItemText = defaultMenuItems[0].children;
-
   var selectedMenuItem = _testWrapper.screen.getByText(selectedItemText);
-
   expect(selectedMenuItem).toHaveClass('is-selected');
   var menuItemText = defaultMenuItems[1].children;
-
   var menuItem = _testWrapper.screen.getByText(menuItemText);
-
   expect(menuItem).not.toHaveClass('is-selected');
 });
 test('Item accepts a data-id and the data-id can be found in the DOM', function () {
   getComponent();
-
   var menuItems = _testWrapper.screen.queryAllByRole('menuitem');
-
   expect(menuItems).toHaveLength(defaultMenuItems.length);
   expect(menuItems[0]).toHaveAttribute('data-id', defaultMenuItems[0]['data-id']);
 });
 test('custom props are passed into menuItem', function () {
   getComponent();
   var itemText1 = defaultMenuItems[0].children;
-
   var menuItem1 = _testWrapper.screen.getByText(itemText1);
-
   expect(menuItem1).toHaveStyleRule('background-color', 'orange');
 });