@enact/ui
Version:
A collection of simplified unstyled cross-platform UI components for Enact
273 lines (272 loc) • 9.58 kB
JavaScript
;
require("@testing-library/jest-dom");
var _react = require("@testing-library/react");
var _react2 = require("react");
var _testUtils = require("./test-utils");
var _View = _interopRequireDefault(require("../View"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
describe('View', function () {
test('should render its child when neither enteringProp or childProps is specified', function () {
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
duration: 1000,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
"data-testid": "span"
})
}));
var actual = _react.screen.getByTestId('span');
expect(actual).toBeInTheDocument();
});
test('should pass the value of entering to its child in enteringProp', function () {
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
duration: 1000,
enteringProp: "data-entering",
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
"data-testid": "span"
})
}));
var expected = 'true';
var actual = _react.screen.getByTestId('span');
expect(actual).toHaveAttribute('data-entering', expected);
});
test('should pass enteringProp as false for an appearing view', function () {
// Views visible on mount are "appearing" and shouldn't perform "entering" logic like
// deferring children rendering
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
appearing: true,
duration: 1000,
enteringProp: "data-entering",
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
"data-testid": "span"
})
}));
var actual = _react.screen.getByTestId('span');
expect(actual).toHaveAttribute('data-entering', 'false');
});
describe('imperative API without arranger', function () {
test('should call callback immediately for "stay"', function () {
var spy = jest.fn();
var ref = /*#__PURE__*/(0, _react2.createRef)();
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
duration: 16,
ref: ref,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
(0, _react.act)(function () {
return ref.current.componentWillStay(spy);
});
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
});
test('should call callback immediately for "enter"', function () {
var spy = jest.fn();
var ref = /*#__PURE__*/(0, _react2.createRef)();
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
duration: 16,
ref: ref,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
(0, _react.act)(function () {
return ref.current.componentWillEnter(spy);
});
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
});
test('should call callback immediately for "leave"', function () {
var spy = jest.fn();
var ref = /*#__PURE__*/(0, _react2.createRef)();
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
duration: 16,
ref: ref,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
(0, _react.act)(function () {
return ref.current.componentWillLeave(spy);
});
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
});
test('should reset entering if a rendered panel re-enters', function () {
jest.useFakeTimers();
var spy = jest.fn();
var ref = /*#__PURE__*/(0, _react2.createRef)();
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
duration: 16,
enteringProp: "data-entering",
ref: ref,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
"data-testid": "span"
})
}));
(0, _react.act)(function () {
return ref.current.componentDidAppear(spy);
});
var firstExpected = 'false';
var firstSpan = _react.screen.getByTestId('span');
expect(firstSpan).toHaveAttribute('data-entering', firstExpected);
(0, _react.act)(function () {
return ref.current.componentWillEnter(spy);
});
var secondExpected = 'true';
var secondSpan = _react.screen.getByTestId('span');
expect(secondSpan).toHaveAttribute('data-entering', secondExpected);
});
});
describe('imperative API with arranger', function () {
beforeEach(function () {
jest.useFakeTimers();
});
afterEach(function () {
jest.useRealTimers();
});
test('should call callback for "stay"', function (done) {
var ref = /*#__PURE__*/(0, _react2.createRef)();
var getParentRef = function getParentRef() {
return {
children: [{}]
};
};
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
arranger: _testUtils.MockArranger,
duration: 16,
ref: ref,
getParentRef: getParentRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
var spy = jest.fn(function () {
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
done();
});
(0, _react.act)(function () {
return ref.current.componentWillStay(spy);
});
jest.runAllTimers();
});
test('should call callback for "enter"', function (done) {
var ref = /*#__PURE__*/(0, _react2.createRef)();
var getParentRef = function getParentRef() {
return {
children: [{}]
};
};
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
arranger: _testUtils.MockArranger,
duration: 16,
ref: ref,
getParentRef: getParentRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
var spy = jest.fn(function () {
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
done();
});
(0, _react.act)(function () {
return ref.current.componentWillEnter(spy);
});
jest.runAllTimers();
});
test('should call callback for "leave"', function (done) {
var ref = /*#__PURE__*/(0, _react2.createRef)();
var getParentRef = function getParentRef() {
return {
children: [{}]
};
};
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
arranger: _testUtils.MockArranger,
duration: 16,
ref: ref,
getParentRef: getParentRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
var spy = jest.fn(function () {
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
done();
});
(0, _react.act)(function () {
return ref.current.componentWillLeave(spy);
});
jest.runAllTimers();
});
test('should call callback immediately when {noAnimation}', function () {
var spy = jest.fn();
var ref = /*#__PURE__*/(0, _react2.createRef)();
var getParentRef = function getParentRef() {
return {
children: [{}]
};
};
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
arranger: _testUtils.MockArranger,
duration: 16,
noAnimation: true,
ref: ref,
getParentRef: getParentRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
(0, _react.act)(function () {
return ref.current.componentWillEnter(spy);
});
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
});
test('should call callback immediately for "appear"', function () {
var spy = jest.fn();
var ref = /*#__PURE__*/(0, _react2.createRef)();
var getParentRef = function getParentRef() {
return {
children: [{}]
};
};
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
arranger: _testUtils.MockArranger,
duration: 16,
ref: ref,
getParentRef: getParentRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
(0, _react.act)(function () {
return ref.current.componentWillAppear(spy);
});
var expected = 1;
expect(spy).toHaveBeenCalledTimes(expected);
});
});
describe('arranger API', function () {
var arrangerStruct = {
from: expect.any(Number),
reverse: expect.any(Boolean),
to: expect.any(Number),
duration: expect.any(Number),
fill: expect.any(String),
node: expect.any(Object)
};
test('should pass the expected object to the arranger', function () {
var arranger = {
enter: jest.fn(function () {
return {};
})
};
var ref = /*#__PURE__*/(0, _react2.createRef)();
var getParentRef = function getParentRef() {
return {
children: [{}]
};
};
(0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_View["default"], {
arranger: arranger,
duration: 1000,
ref: ref,
getParentRef: getParentRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {})
}));
(0, _react.act)(function () {
return ref.current.componentWillEnter();
});
expect(arranger.enter).toHaveBeenCalledWith(arrangerStruct);
});
});
});