@enact/sandstone
Version:
Large-screen/TV support library for Enact, containing a variety of UI components.
711 lines (709 loc) • 30.1 kB
JavaScript
"use strict";
var _spotlight = _interopRequireDefault(require("@enact/spotlight"));
require("@testing-library/jest-dom");
var _react = require("@testing-library/react");
var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
var _ = require("../");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
describe('WizardPanels Specs', function () {
test('should have title in `Header`', function () {
var title = 'WizardPanel title';
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.WizardPanels, {
title: title,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})
}));
var expected = 'heading title';
var actual = _react.screen.getByText(title).parentElement.parentElement;
expect(actual).toHaveClass(expected);
});
test('should have title overridden by title set in `View`', function () {
var wizardTitle = 'WizardPanel title';
var viewTitle = 'View title';
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.WizardPanels, {
title: wizardTitle,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
title: viewTitle
})
}));
var headerTitle = _react.screen.queryByText(viewTitle);
expect(headerTitle).toBeInTheDocument();
expect(headerTitle.parentElement.parentElement).toHaveClass('title');
});
test('should have subtitle from `View`', function () {
var viewSubtitle = 'View subtitle';
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.WizardPanels, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
subtitle: viewSubtitle
})
}));
var expected = 'subtitle';
var actual = _react.screen.getByText(viewSubtitle);
expect(actual).toHaveClass(expected);
});
test('should have View buttons rendered in footer', function () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.WizardPanels, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("footer", {
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
children: "Button 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
children: "Button 2"
})]
})
})
}));
var buttons = _react.screen.getAllByRole('button');
var prevButtonContainer = buttons[0].parentElement;
var nextButtonContainer = buttons[1].parentElement;
var expected = 2;
var actual = buttons.length;
expect(actual).toBe(expected);
expect(prevButtonContainer).toHaveClass('footer');
expect(nextButtonContainer).toHaveClass('footer');
});
test('should have View contents rendered in `.content`', function () {
var contentText = 'content';
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.WizardPanels, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: contentText
})
}));
var expected = 'content';
var actual = _react.screen.getByText(contentText).parentElement.parentElement;
expect(actual).toHaveClass(expected);
});
test('should not hide next button on the last view when `nextButton` prop is added on the last Panel', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 2,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
nextButton: true,
children: "Last"
})]
}));
var expected = 'Next';
var actual = _react.screen.getAllByRole('button')[1];
yield (0, _react.waitFor)(function () {
expect(actual).toHaveAttribute('aria-label', expected);
});
}));
test('should hide next button on the last view', function () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 2,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Last!"
})]
}));
var buttons = _react.screen.getAllByRole('button');
var expected = 1;
var actual = buttons.length;
expect(actual).toBe(expected);
expect(buttons[0]).not.toHaveAttribute('aria-label', 'Next');
});
test('should hide previous button on the first view', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 0,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Last!"
})]
}));
var buttons = _react.screen.getAllByRole('button');
var expected = 1;
var actual = buttons.length;
yield (0, _react.waitFor)(function () {
expect(actual).toBe(expected);
});
yield (0, _react.waitFor)(function () {
expect(buttons[0]).not.toHaveAttribute('aria-label', 'Previous');
});
}));
test('should show next button on the first view', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 0,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Last!"
})]
}));
var nextButton = _react.screen.getByLabelText('Next');
yield (0, _react.waitFor)(function () {
expect(nextButton).toBeInTheDocument();
});
}));
test('should not hide previous button on the first view when `prevButton` prop is added on the first Panel', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 0,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
prevButton: true,
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
}));
var prevButton = _react.screen.getByLabelText('Previous');
yield (0, _react.waitFor)(function () {
expect(prevButton).toBeInTheDocument();
});
}));
test('should hide next nextButton on all the panels with `nextButtonVisibility` set to never', /*#__PURE__*/_asyncToGenerator(function* () {
var _render = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 2,
nextButtonVisibility: "never",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
})),
rerender = _render.rerender;
var panel3Buttons = _react.screen.getAllByRole('button');
yield (0, _react.waitFor)(function () {
expect(panel3Buttons.length).toBe(1);
});
yield (0, _react.waitFor)(function () {
expect(panel3Buttons[0]).not.toHaveAttribute('aria-label', 'Next');
});
rerender( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 1,
nextButtonVisibility: "never",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
}));
var panel2Buttons = _react.screen.getAllByRole('button');
yield (0, _react.waitFor)(function () {
expect(panel2Buttons.length).toBe(1);
});
yield (0, _react.waitFor)(function () {
expect(panel2Buttons[0]).not.toHaveAttribute('aria-label', 'Next');
});
}));
test('should hide previous button on all the panels with `prevButtonVisibility` set to never', /*#__PURE__*/_asyncToGenerator(function* () {
var _render2 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 0,
prevButtonVisibility: "never",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
})),
rerender = _render2.rerender;
var panel1Buttons = _react.screen.getAllByRole('button');
yield (0, _react.waitFor)(function () {
expect(panel1Buttons.length).toBe(1);
});
yield (0, _react.waitFor)(function () {
expect(panel1Buttons[0]).not.toHaveAttribute('aria-label', 'Previous');
});
rerender( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 1,
prevButtonVisibility: "never",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
}));
var panel2Buttons = _react.screen.getAllByRole('button');
yield (0, _react.waitFor)(function () {
expect(panel2Buttons.length).toBe(1);
});
yield (0, _react.waitFor)(function () {
expect(panel2Buttons[0]).not.toHaveAttribute('aria-label', 'Previous');
});
}));
test('should hide previous button on the second Panel when panel overrides', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
defaultIndex: 1,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
prevButton: false,
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
}));
var buttons = _react.screen.getAllByRole('button');
var expected = 1;
var actual = buttons.length;
yield (0, _react.waitFor)(function () {
expect(actual).toBe(expected);
});
yield (0, _react.waitFor)(function () {
expect(buttons[0]).not.toHaveAttribute('aria-label', 'Previous');
});
}));
test('should show previous button on the first view when `prevButtonVisibility` prop is set to always', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 0,
prevButtonVisibility: "always",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
}));
var buttons = _react.screen.getAllByRole('button');
var expected = 2;
var actual = buttons.length;
yield (0, _react.waitFor)(function () {
expect(actual).toBe(expected);
});
yield (0, _react.waitFor)(function () {
expect(buttons[0]).toHaveAttribute('aria-label', 'Previous');
});
}));
test('should hide previous button on the first view when `prevButtonVisibility` prop is set to always and panel overrides', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 0,
prevButtonVisibility: "always",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
prevButton: false,
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
}));
var buttons = _react.screen.getAllByRole('button');
var expected = 1;
var actual = buttons.length;
yield (0, _react.waitFor)(function () {
expect(actual).toBe(expected);
});
yield (0, _react.waitFor)(function () {
expect(buttons[0]).not.toHaveAttribute('aria-label', 'Previous');
});
}));
test('should show next button on the last view when `nextButtonVisibility` prop is set to always', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 2,
nextButtonVisibility: "always",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 3"
})]
}));
var buttons = _react.screen.getAllByRole('button');
var expected = 2;
var actual = buttons.length;
yield (0, _react.waitFor)(function () {
expect(actual).toBe(expected);
});
yield (0, _react.waitFor)(function () {
expect(buttons[1]).toHaveAttribute('aria-label', 'Next');
});
}));
test('should hide next button on the last view when `nextButtonVisibility` prop is set to always and panel overrides', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 2,
nextButtonVisibility: "always",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 1"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "Panel 2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
nextButton: false,
children: "Panel 3"
})]
}));
var buttons = _react.screen.getAllByRole('button');
var expected = 1;
var actual = buttons.length;
yield (0, _react.waitFor)(function () {
expect(actual).toBe(expected);
});
yield (0, _react.waitFor)(function () {
expect(buttons[0]).not.toHaveAttribute('aria-label', 'Next');
});
}));
test('should fire `onWillTransition` with target index and type in pointer mode', /*#__PURE__*/_asyncToGenerator(function* () {
var spy = jest.fn();
var index = 0;
var _render3 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: index,
onWillTransition: spy,
noAnimation: true,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
})]
})),
rerender = _render3.rerender;
spy.mockClear();
index++;
rerender( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: index,
onWillTransition: spy,
noAnimation: true,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
})]
}));
var expected = {
index: index,
type: 'onWillTransition'
};
var actual = spy.mock.calls.length && spy.mock.calls[0][0];
yield (0, _react.waitFor)(function () {
expect(actual).toMatchObject(expected);
});
}));
test('should fire `onWillTransition` with target index and type in 5-way mode', /*#__PURE__*/_asyncToGenerator(function* () {
_spotlight["default"].setPointerMode(false);
var spy = jest.fn();
var index = 0;
var _render4 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: index,
onWillTransition: spy,
noAnimation: true,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents3"
})]
})),
rerender = _render4.rerender;
spy.mockClear();
var nextButton = _react.screen.getByLabelText('Next');
_spotlight["default"].focus(nextButton);
index++;
rerender( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: index,
onWillTransition: spy,
noAnimation: true,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents3"
})]
}));
var expected = {
index: index,
type: 'onWillTransition'
};
var actual = spy.mock.calls.length && spy.mock.calls[0][0];
yield (0, _react.waitFor)(function () {
expect(actual).toMatchObject(expected);
});
}));
test('should fire `onTransition` with target index and type', /*#__PURE__*/_asyncToGenerator(function* () {
var spy = jest.fn();
var index = 0;
var _render5 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: index,
onTransition: spy,
noAnimation: true,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
})]
})),
rerender = _render5.rerender;
spy.mockClear();
index++;
rerender( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: index,
onTransition: spy,
noAnimation: true,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "I gots contents2"
})]
}));
var expected = {
index: index,
type: 'onTransition'
};
var actual = spy.mock.calls.length && spy.mock.calls[0][0];
yield (0, _react.waitFor)(function () {
expect(actual).toMatchObject(expected);
});
}));
test('should advance on next click', /*#__PURE__*/_asyncToGenerator(function* () {
var user = _userEvent["default"].setup();
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 1,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
var nextButton = _react.screen.getByLabelText('Next');
yield user.click(nextButton);
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText('2');
expect(actual).toHaveClass('current');
});
}));
test('should fire `onNextClick` and `onChange` with type when go to the next panel', /*#__PURE__*/_asyncToGenerator(function* () {
var handleChange = jest.fn();
var handleNextClick = jest.fn();
var user = _userEvent["default"].setup();
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 1,
onChange: handleChange,
onNextClick: handleNextClick,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
var nextButton = _react.screen.getByLabelText('Next');
var expected = {
type: 'onNextClick'
};
yield user.click(nextButton);
yield (0, _react.waitFor)(function () {
expect(handleChange).toBeCalledWith({
index: 2,
type: 'onChange'
});
});
yield (0, _react.waitFor)(function () {
var actual = handleNextClick.mock.calls.length && handleNextClick.mock.calls[0][0];
expect(actual).toMatchObject(expected);
});
}));
test('should go back on prev click', /*#__PURE__*/_asyncToGenerator(function* () {
var user = _userEvent["default"].setup();
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
defaultIndex: 1,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
var prevButton = _react.screen.getByLabelText('Previous');
yield user.click(prevButton);
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText('1');
expect(actual).toHaveClass('current');
});
}));
test('should fire `onPrevClick` and `onChange` with type when go to the previous panel', /*#__PURE__*/_asyncToGenerator(function* () {
var handleChange = jest.fn();
var handlePrevClick = jest.fn();
var user = _userEvent["default"].setup();
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 2,
onChange: handleChange,
onPrevClick: handlePrevClick,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
var prevButton = _react.screen.getByLabelText('Previous');
var expected = {
type: 'onPrevClick'
};
yield user.click(prevButton);
yield (0, _react.waitFor)(function () {
expect(handleChange).toBeCalledWith({
index: 1,
type: 'onChange'
});
});
yield (0, _react.waitFor)(function () {
var actual = handlePrevClick.mock.calls.length && handlePrevClick.mock.calls[0][0];
expect(actual).toMatchObject(expected);
});
}));
test('should go back on back key', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
defaultIndex: 1,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "test"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
_react.fireEvent.keyUp(_react.screen.getByText('test'), {
keyCode: 27
});
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText('1');
expect(actual).toHaveClass('current');
});
}));
test('should go back on back key when prevButtonVisibility set to show never', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
defaultIndex: 1,
prevButtonVisibility: "never",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "test"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
_react.fireEvent.keyUp(_react.screen.getByText('test'), {
keyCode: 27
});
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText('1');
expect(actual).toHaveClass('current');
});
}));
test('should go back on back key when onBack does not call preventDefault', /*#__PURE__*/_asyncToGenerator(function* () {
var spy = jest.fn();
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
defaultIndex: 1,
onBack: spy,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "test"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
_react.fireEvent.keyUp(_react.screen.getByText('test'), {
keyCode: 27
});
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText('1');
expect(actual).toHaveClass('current');
});
yield (0, _react.waitFor)(function () {
var expected = {
type: 'onBack',
stopPropagation: expect.any(Function)
};
expect(spy).toBeCalledWith(expect.objectContaining(expected));
});
}));
test('should not go back on back key when onBack calls preventDefault', /*#__PURE__*/_asyncToGenerator(function* () {
var spy = jest.fn(function (ev) {
return ev.preventDefault();
});
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
defaultIndex: 1,
onBack: spy,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
children: "test"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
_react.fireEvent.keyUp(_react.screen.getByText('test'), {
keyCode: 27
});
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText('2');
expect(actual).toHaveClass('current');
});
yield (0, _react.waitFor)(function () {
var expected = {
type: 'onBack',
stopPropagation: expect.any(Function)
};
expect(spy).toBeCalledWith(expect.objectContaining(expected));
});
}));
test('should support noAnimation', function () {
var viewSubtitle = 'View subtitle';
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.WizardPanels, {
noAnimation: true,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {
subtitle: viewSubtitle
})
}));
// check if animation container exists
var notExpected = 'titleContainer';
var actual = _react.screen.getByText(viewSubtitle).parentElement;
expect(actual).not.toHaveClass(notExpected);
});
test('should reflect the current index in Steps when "current" is not specified', /*#__PURE__*/_asyncToGenerator(function* () {
var index = 1;
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: index,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText(index + 1);
expect(actual).toHaveClass('current');
});
}));
test('should reflect the specified index in Steps when "current" is set', /*#__PURE__*/_asyncToGenerator(function* () {
var current = 3;
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 0,
current: current,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
yield (0, _react.waitFor)(function () {
var actual = _react.screen.getByText(current);
expect(actual).toHaveClass('current');
});
}));
test('should reflect the total views in Steps when "total" is not specified', /*#__PURE__*/_asyncToGenerator(function* () {
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
var expected = 5;
var actual = _react.screen.getByRole('list').children.length;
yield (0, _react.waitFor)(function () {
expect(actual).toBe(expected);
});
}));
test('should reflect the specified total in Steps when "total" is set', /*#__PURE__*/_asyncToGenerator(function* () {
var total = 3;
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
index: 1,
current: 1,
total: total,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
var steps = _react.screen.getByRole('list').children.length;
yield (0, _react.waitFor)(function () {
expect(steps).toBe(total);
});
}));
test('should reflect the aria-label when "current" is set', /*#__PURE__*/_asyncToGenerator(function* () {
var current = 2;
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.WizardPanels, {
current: current,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})]
}));
var header = _react.screen.getByRole('region').children[0].children[0];
var expected = "step ".concat(current, " ");
yield (0, _react.waitFor)(function () {
expect(header).toHaveAttribute('aria-label', expected);
});
}));
test('should return a ref to the root Panel node', function () {
var ref = jest.fn();
(0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.WizardPanels, {
ref: ref,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Panel, {})
}));
var expected = 'ARTICLE';
var actual = ref.mock.calls[0][0].nodeName;
expect(actual).toBe(expected);
});
});