@zextras/carbonio-ui-preview 0.2.0 → 0.2.1

package/lib/preview/PdfPreview.test.js

@@ -47,9 +47,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var react_2 = require("@testing-library/react");
 var user_event_1 = __importDefault(require("@testing-library/user-event"));
-var test_utils_1 = require("../utils/test-utils");
 var constants_1 = require("./constants");
 var PdfPreview_1 = require("./PdfPreview");
+var test_utils_1 = require("test-utils");
 var pdfFile = (0, test_utils_1.loadPDF)('./__mocks__/_pdf.pdf');
 var zoomInIcon = 'icon: Plus';
 var zoomOutIcon = 'icon: Minus';
@@ -275,10 +275,10 @@ describe('Pdf Preview', function () {
                     _a.sent();
                     expect(actions[0].onClick).toHaveBeenCalled();
                     expect(onClose).toHaveBeenCalledTimes(1);
-                    // click on action 2 skips the handler of the action since it is disabled and do not calls onClose
+                    // click on action 2 skips the handler of the action since it is disabled and does not call onClose
                     return [4 /*yield*/, user.click(action2Item)];
                 case 4:
-                    // click on action 2 skips the handler of the action since it is disabled and do not calls onClose
+                    // click on action 2 skips the handler of the action since it is disabled and does not call onClose
                     _a.sent();
                     expect(actions[1].onClick).not.toHaveBeenCalled();
                     expect(onClose).toHaveBeenCalledTimes(1);
@@ -301,14 +301,14 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('Zoom starts at lowest step', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, user, canvas;
+        var onClose, canvas;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
-                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
+                    (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }).user;
+                    });
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
                     _a.sent();
@@ -443,19 +443,19 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('Fit to width zoom set width of pdf to width of the window', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, mockPdfWidth, _a, user, container;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, mockPdfWidth, user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
                     mockPdfWidth = 1000;
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -464,7 +464,7 @@ describe('Pdf Preview', function () {
                     jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(mockPdfWidth));
                     expect(react_2.screen.getByTestId(zoomResetWidthIcon)).toBeVisible();
@@ -474,19 +474,19 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('Reset zoom set width to lowest step', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, mockPdfWidth, _a, user, container;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, mockPdfWidth, user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
                     mockPdfWidth = 1000;
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -495,14 +495,14 @@ describe('Pdf Preview', function () {
                     jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(mockPdfWidth));
                     expect(react_2.screen.getByTestId(zoomResetWidthIcon)).toBeVisible();
                     expect(react_2.screen.queryByTestId(zoomFitToWidthIcon)).not.toBeInTheDocument();
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomResetWidthIcon))];
                 case 3:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[0]));
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -512,26 +512,26 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('When client width is lower than lowest zoom step and zoom is set to fit to width, decrease zoom is disabled and increase is enabled', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, mockPdfWidth, _a, user, container;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, mockPdfWidth, user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
                     mockPdfWidth = constants_1.ZOOM_STEPS[0] - 1;
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
                     jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
                     expect(react_2.screen.getByTestId(zoomOutIcon).parentElement).toHaveAttribute('disabled', '');
                     // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
@@ -541,26 +541,26 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('When client width is greater than greatest zoom step and zoom is set to fit to width, decrease zoom is enabled and increase is disabled', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, mockPdfWidth, _a, user, container;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, mockPdfWidth, user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
                     mockPdfWidth = constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1] + 1;
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
                     jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
                     expect(react_2.screen.getByTestId(zoomInIcon).parentElement).toHaveAttribute('disabled', '');
                     // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
@@ -570,32 +570,32 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('After fit to width, decrease zoom set zoom to nearest lower zoom step', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, stepToReach, mockPdfWidth, _a, user, container;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, stepToReach, mockPdfWidth, user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
                     stepToReach = 1;
                     mockPdfWidth = constants_1.ZOOM_STEPS[stepToReach + 1] - 1;
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
                     jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
                     expect(react_2.screen.getByTestId(zoomOutIcon).parentElement).not.toHaveAttribute('disabled', '');
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomOutIcon))];
                 case 3:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[stepToReach]));
                     return [2 /*return*/];
@@ -603,32 +603,32 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('After fit to width, increase zoom set zoom to nearest greater zoom step', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, stepToReach, mockPdfWidth, _a, user, container;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, stepToReach, mockPdfWidth, user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
                     stepToReach = 2;
                     mockPdfWidth = constants_1.ZOOM_STEPS[stepToReach - 1] + 1;
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
                     jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
                     expect(react_2.screen.getByTestId(zoomInIcon).parentElement).not.toHaveAttribute('disabled', '');
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomInIcon))];
                 case 3:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[stepToReach]));
                     return [2 /*return*/];
@@ -636,19 +636,19 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('When fit to width is active, resize of the window update width of the pdf', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, mockPdfWidth, _a, user, container, getPreviewClientWidthMock;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, mockPdfWidth, user, getPreviewClientWidthMock;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
                     mockPdfWidth = [1001, 1501, 2001];
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -656,7 +656,7 @@ describe('Pdf Preview', function () {
                     getPreviewClientWidthMock.mockReturnValueOnce(mockPdfWidth[0]);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(mockPdfWidth[0]));
                     getPreviewClientWidthMock.mockReturnValueOnce(mockPdfWidth[1]);
@@ -671,26 +671,25 @@ describe('Pdf Preview', function () {
         });
     }); });
     test('Click on disabled decrease/increase zoom actions does not change step and does not close preview', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var onClose, ref, mockPdfWidth, _a, user, container;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var onClose, ref, user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     onClose = jest.fn();
                     ref = react_1.default.createRef();
-                    mockPdfWidth = [1001, 1501, 2001];
-                    _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                    user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
                         setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
-                    }), user = _a.user, container = _a.container;
+                    }).user;
                     return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toBeVisible();
                     // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
                     expect(react_2.screen.getByTestId(zoomOutIcon).parentElement).toHaveAttribute('disabled', '');
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomOutIcon))];
                 case 2:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[0]));
                     expect(onClose).not.toHaveBeenCalled();
@@ -699,14 +698,14 @@ describe('Pdf Preview', function () {
                         .mockReturnValue(constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1]);
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
                 case 3:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1]));
                     // eslint-disable-next-line testing-library/no-node-access,jest-dom/prefer-enabled-disabled
                     expect(react_2.screen.getByTestId(zoomInIcon).parentElement).toHaveAttribute('disabled', '');
                     return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomInIcon))];
                 case 4:
-                    _b.sent();
+                    _a.sent();
                     // eslint-disable-next-line testing-library/no-node-access
                     expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1]));
                     expect(onClose).not.toHaveBeenCalled();
@@ -714,5 +713,266 @@ describe('Pdf Preview', function () {
             }
         });
     }); });
+    describe('Page selector', function () {
+        test('shows page controller', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        });
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        expect(react_2.screen.getByRole('textbox', { name: /current page/i })).toBeVisible();
+                        // mock pdf has 4 pages
+                        expect(react_2.screen.getByText('4')).toBeVisible();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        test('blur is a confirmation event on page input', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref, user, pageInput;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        }).user;
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
+                        expect(pageInput).toHaveDisplayValue('1');
+                        return [4 /*yield*/, user.clear(pageInput)];
+                    case 2:
+                        _a.sent();
+                        return [4 /*yield*/, user.type(pageInput, '2')];
+                    case 3:
+                        _a.sent();
+                        return [4 /*yield*/, user.tab()];
+                    case 4:
+                        _a.sent();
+                        expect(pageInput).not.toHaveFocus();
+                        expect(pageInput).toHaveDisplayValue('2');
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        test('enter key is a confirmation event on page input', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref, user, pageInput;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        }).user;
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
+                        expect(pageInput).toHaveDisplayValue('1');
+                        return [4 /*yield*/, user.clear(pageInput)];
+                    case 2:
+                        _a.sent();
+                        return [4 /*yield*/, user.type(pageInput, '2')];
+                    case 3:
+                        _a.sent();
+                        return [4 /*yield*/, user.type(pageInput, '{Enter}')];
+                    case 4:
+                        _a.sent();
+                        expect(pageInput).not.toHaveFocus();
+                        expect(pageInput).toHaveDisplayValue('2');
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        test('when input is confirmed, input loses focus and the document is scrolled to typed page', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref, scrollIntoViewFn, user, pageInput;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        scrollIntoViewFn = jest.fn();
+                        window.HTMLElement.prototype.scrollIntoView = scrollIntoViewFn;
+                        user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        }).user;
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
+                        expect(pageInput).toHaveDisplayValue('1');
+                        return [4 /*yield*/, user.clear(pageInput)];
+                    case 2:
+                        _a.sent();
+                        return [4 /*yield*/, user.type(pageInput, '2')];
+                    case 3:
+                        _a.sent();
+                        return [4 /*yield*/, user.click(react_2.screen.getByText(/page/i))];
+                    case 4:
+                        _a.sent();
+                        expect(pageInput).not.toHaveFocus();
+                        expect(pageInput).toHaveDisplayValue('2');
+                        expect(scrollIntoViewFn).toHaveBeenCalledTimes(1);
+                        expect(scrollIntoViewFn.mock.instances[0]).toHaveAttribute('data-page-number', '2');
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        test('when input is confirmed with an invalid value, input loses focus and the input value is reset to previous valid page', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref, scrollIntoViewFn, user, pageInput;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        scrollIntoViewFn = jest.fn();
+                        window.HTMLElement.prototype.scrollIntoView = scrollIntoViewFn;
+                        user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        }).user;
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
+                        expect(pageInput).toHaveDisplayValue('1');
+                        return [4 /*yield*/, user.clear(pageInput)];
+                    case 2:
+                        _a.sent();
+                        return [4 /*yield*/, user.type(pageInput, 'invalid')];
+                    case 3:
+                        _a.sent();
+                        return [4 /*yield*/, user.click(react_2.screen.getByText(/page/i))];
+                    case 4:
+                        _a.sent();
+                        expect(pageInput).not.toHaveFocus();
+                        expect(pageInput).toHaveDisplayValue('1');
+                        expect(scrollIntoViewFn).not.toHaveBeenCalled();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        test('on scroll, if focus is not on input, value is updated with current page', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref, pageInput, page2Element;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        });
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
+                        expect(pageInput).toHaveDisplayValue('1');
+                        page2Element = document.querySelector('[data-page-number="2"]');
+                        expect(page2Element).not.toBeNull();
+                        return [4 /*yield*/, (0, test_utils_1.triggerObserver)(page2Element)];
+                    case 2:
+                        _a.sent();
+                        expect(pageInput).toHaveDisplayValue('2');
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        test('on scroll, if focus is on input, value is updated with current page', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref, user, pageInput, page2Element;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        }).user;
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
+                        expect(pageInput).toHaveDisplayValue('1');
+                        return [4 /*yield*/, user.clear(pageInput)];
+                    case 2:
+                        _a.sent();
+                        return [4 /*yield*/, user.type(pageInput, '4')];
+                    case 3:
+                        _a.sent();
+                        expect(pageInput).toHaveFocus();
+                        page2Element = document.querySelector('[data-page-number="2"]');
+                        expect(page2Element).not.toBeNull();
+                        return [4 /*yield*/, (0, test_utils_1.triggerObserver)(page2Element)];
+                    case 4:
+                        _a.sent();
+                        expect(pageInput).toHaveDisplayValue('2');
+                        expect(pageInput).toHaveFocus();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        test('esc key makes user exit from the preview, even when focus is on input', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onClose, ref, user, pageInput;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onClose = jest.fn();
+                        ref = react_1.default.createRef();
+                        user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
+                            setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
+                        }).user;
+                        return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
+                    case 1:
+                        _a.sent();
+                        // eslint-disable-next-line testing-library/no-node-access
+                        expect(document.querySelector('canvas')).toBeVisible();
+                        expect(react_2.screen.getByText(/page/i)).toBeVisible();
+                        pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
+                        expect(pageInput).toHaveDisplayValue('1');
+                        return [4 /*yield*/, user.clear(pageInput)];
+                    case 2:
+                        _a.sent();
+                        return [4 /*yield*/, user.type(pageInput, '4')];
+                    case 3:
+                        _a.sent();
+                        expect(pageInput).toHaveFocus();
+                        return [4 /*yield*/, user.keyboard('{Escape}')];
+                    case 4:
+                        _a.sent();
+                        expect(onClose).toHaveBeenCalled();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+    });
 });
 //# sourceMappingURL=PdfPreview.test.js.map