@zextras/carbonio-ui-preview 0.2.0 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (69) hide show
  1. package/lib/preview/ImagePreview.d.ts +8 -0
  2. package/lib/preview/ImagePreview.js +16 -7
  3. package/lib/preview/ImagePreview.js.map +1 -1
  4. package/lib/preview/Navigator.d.ts +5 -0
  5. package/lib/preview/Navigator.js +28 -0
  6. package/lib/preview/Navigator.js.map +1 -0
  7. package/lib/preview/PageController.d.ts +8 -0
  8. package/lib/preview/PageController.js +112 -0
  9. package/lib/preview/PageController.js.map +1 -0
  10. package/lib/preview/PdfPreview.d.ts +14 -0
  11. package/lib/preview/PdfPreview.js +108 -112
  12. package/lib/preview/PdfPreview.js.map +1 -1
  13. package/lib/preview/PdfPreview.test.js +620 -93
  14. package/lib/preview/PdfPreview.test.js.map +1 -1
  15. package/lib/preview/PreviewManager.d.ts +8 -2
  16. package/lib/preview/PreviewManager.js +58 -23
  17. package/lib/preview/PreviewManager.js.map +1 -1
  18. package/lib/preview/PreviewManager.test.js +94 -3
  19. package/lib/preview/PreviewManager.test.js.map +1 -1
  20. package/lib/preview/StyledComponents.d.ts +3 -0
  21. package/lib/preview/StyledComponents.js +21 -0
  22. package/lib/preview/StyledComponents.js.map +1 -0
  23. package/lib/preview/ZoomController.d.ts +17 -0
  24. package/lib/preview/ZoomController.js +58 -0
  25. package/lib/preview/ZoomController.js.map +1 -0
  26. package/lib/preview/usePageScrollController.d.ts +4 -0
  27. package/lib/preview/usePageScrollController.js +70 -0
  28. package/lib/preview/usePageScrollController.js.map +1 -0
  29. package/lib/preview/useZoom.d.ts +13 -0
  30. package/lib/preview/useZoom.js +85 -0
  31. package/lib/preview/useZoom.js.map +1 -0
  32. package/lib/utils/test-utils.d.ts +1 -0
  33. package/lib/utils/test-utils.js +63 -1
  34. package/lib/utils/test-utils.js.map +1 -1
  35. package/lib-esm/preview/ImagePreview.d.ts +8 -0
  36. package/lib-esm/preview/ImagePreview.js +16 -7
  37. package/lib-esm/preview/ImagePreview.js.map +1 -1
  38. package/lib-esm/preview/Navigator.d.ts +5 -0
  39. package/lib-esm/preview/Navigator.js +21 -0
  40. package/lib-esm/preview/Navigator.js.map +1 -0
  41. package/lib-esm/preview/PageController.d.ts +8 -0
  42. package/lib-esm/preview/PageController.js +82 -0
  43. package/lib-esm/preview/PageController.js.map +1 -0
  44. package/lib-esm/preview/PdfPreview.d.ts +14 -0
  45. package/lib-esm/preview/PdfPreview.js +109 -113
  46. package/lib-esm/preview/PdfPreview.js.map +1 -1
  47. package/lib-esm/preview/PdfPreview.test.js +620 -93
  48. package/lib-esm/preview/PdfPreview.test.js.map +1 -1
  49. package/lib-esm/preview/PreviewManager.d.ts +8 -2
  50. package/lib-esm/preview/PreviewManager.js +57 -25
  51. package/lib-esm/preview/PreviewManager.js.map +1 -1
  52. package/lib-esm/preview/PreviewManager.test.js +95 -4
  53. package/lib-esm/preview/PreviewManager.test.js.map +1 -1
  54. package/lib-esm/preview/StyledComponents.d.ts +3 -0
  55. package/lib-esm/preview/StyledComponents.js +15 -0
  56. package/lib-esm/preview/StyledComponents.js.map +1 -0
  57. package/lib-esm/preview/ZoomController.d.ts +17 -0
  58. package/lib-esm/preview/ZoomController.js +28 -0
  59. package/lib-esm/preview/ZoomController.js.map +1 -0
  60. package/lib-esm/preview/usePageScrollController.d.ts +4 -0
  61. package/lib-esm/preview/usePageScrollController.js +66 -0
  62. package/lib-esm/preview/usePageScrollController.js.map +1 -0
  63. package/lib-esm/preview/useZoom.d.ts +13 -0
  64. package/lib-esm/preview/useZoom.js +78 -0
  65. package/lib-esm/preview/useZoom.js.map +1 -0
  66. package/lib-esm/utils/test-utils.d.ts +1 -0
  67. package/lib-esm/utils/test-utils.js +62 -1
  68. package/lib-esm/utils/test-utils.js.map +1 -1
  69. package/package.json +3 -2
@@ -47,9 +47,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
47
47
  var react_1 = __importDefault(require("react"));
48
48
  var react_2 = require("@testing-library/react");
49
49
  var user_event_1 = __importDefault(require("@testing-library/user-event"));
50
- var test_utils_1 = require("../utils/test-utils");
51
50
  var constants_1 = require("./constants");
52
51
  var PdfPreview_1 = require("./PdfPreview");
52
+ var test_utils_1 = require("test-utils");
53
53
  var pdfFile = (0, test_utils_1.loadPDF)('./__mocks__/_pdf.pdf');
54
54
  var zoomInIcon = 'icon: Plus';
55
55
  var zoomOutIcon = 'icon: Minus';
@@ -66,10 +66,10 @@ describe('Pdf Preview', function () {
66
66
  (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
67
67
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
68
68
  });
69
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
69
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
70
70
  case 1:
71
71
  _a.sent();
72
- expect(react_2.screen.queryByText(/loading pdf/i)).not.toBeInTheDocument();
72
+ expect(react_2.screen.queryByText(/Loading document preview…/i)).not.toBeInTheDocument();
73
73
  expect(react_2.screen.getByTestId('pdf-preview-container')).toBeInTheDocument();
74
74
  pageElement = document.querySelector('[data-page-number="1"]');
75
75
  expect(pageElement).toBeDefined();
@@ -86,7 +86,7 @@ describe('Pdf Preview', function () {
86
86
  (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: false, src: pdfFile.dataURI, onClose: onClose }), {
87
87
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
88
88
  });
89
- expect(react_2.screen.queryByText(/loading pdf/i)).not.toBeInTheDocument();
89
+ expect(react_2.screen.queryByText(/Loading document preview…/i)).not.toBeInTheDocument();
90
90
  expect(react_2.screen.queryByTestId('pdf-preview-container')).not.toBeInTheDocument();
91
91
  return [2 /*return*/];
92
92
  });
@@ -100,13 +100,13 @@ describe('Pdf Preview', function () {
100
100
  (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: "invalid-pdf.pdf", onClose: onClose }), {
101
101
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
102
102
  });
103
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
103
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
104
104
  case 1:
105
105
  _a.sent();
106
- return [4 /*yield*/, react_2.screen.findByText(/Failed to load PDF file/i)];
106
+ return [4 /*yield*/, react_2.screen.findByText(/Failed to load document preview./i)];
107
107
  case 2:
108
108
  _a.sent();
109
- expect(react_2.screen.queryByText(/loading pdf/i)).not.toBeInTheDocument();
109
+ expect(react_2.screen.queryByText(/Loading document preview…/i)).not.toBeInTheDocument();
110
110
  expect(react_2.screen.getByTestId('pdf-preview-container')).toBeInTheDocument();
111
111
  return [2 /*return*/];
112
112
  }
@@ -153,10 +153,10 @@ describe('Pdf Preview', function () {
153
153
  (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, filename: "file name", extension: "pdf", size: "18KB" }), {
154
154
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
155
155
  });
156
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
156
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
157
157
  case 1:
158
158
  _a.sent();
159
- expect(react_2.screen.queryByText(/loading pdf/i)).not.toBeInTheDocument();
159
+ expect(react_2.screen.queryByText(/Loading document preview…/i)).not.toBeInTheDocument();
160
160
  expect(react_2.screen.getByText(/file name/i)).toBeVisible();
161
161
  expect(react_2.screen.getByText(/pdf.*18KB/i)).toBeVisible();
162
162
  return [2 /*return*/];
@@ -172,10 +172,10 @@ describe('Pdf Preview', function () {
172
172
  user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
173
173
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
174
174
  }).user;
175
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
175
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
176
176
  case 1:
177
177
  _a.sent();
178
- expect(react_2.screen.queryByText(/loading pdf/i)).not.toBeInTheDocument();
178
+ expect(react_2.screen.queryByText(/Loading document preview…/i)).not.toBeInTheDocument();
179
179
  return [4 /*yield*/, user.keyboard('{Escape}')];
180
180
  case 2:
181
181
  _a.sent();
@@ -200,10 +200,10 @@ describe('Pdf Preview', function () {
200
200
  user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, closeAction: closeAction }), {
201
201
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
202
202
  }).user;
203
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
203
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
204
204
  case 1:
205
205
  _a.sent();
206
- expect(react_2.screen.queryByText(/loading pdf/i)).not.toBeInTheDocument();
206
+ expect(react_2.screen.queryByText(/Loading document preview…/i)).not.toBeInTheDocument();
207
207
  closeActionElement = react_2.screen.getByTestId('icon: Activity');
208
208
  expect(closeActionElement).toBeVisible();
209
209
  return [4 /*yield*/, user.hover(closeActionElement)];
@@ -251,7 +251,7 @@ describe('Pdf Preview', function () {
251
251
  user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, actions: actions, filename: "pdf name", closeAction: closeAction }), {
252
252
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
253
253
  }).user;
254
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
254
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
255
255
  case 1:
256
256
  _a.sent();
257
257
  return [4 /*yield*/, (0, react_2.waitFor)(function () {
@@ -275,10 +275,10 @@ describe('Pdf Preview', function () {
275
275
  _a.sent();
276
276
  expect(actions[0].onClick).toHaveBeenCalled();
277
277
  expect(onClose).toHaveBeenCalledTimes(1);
278
- // click on action 2 skips the handler of the action since it is disabled and do not calls onClose
278
+ // click on action 2 skips the handler of the action since it is disabled and does not call onClose
279
279
  return [4 /*yield*/, user.click(action2Item)];
280
280
  case 4:
281
- // click on action 2 skips the handler of the action since it is disabled and do not calls onClose
281
+ // click on action 2 skips the handler of the action since it is disabled and does not call onClose
282
282
  _a.sent();
283
283
  expect(actions[1].onClick).not.toHaveBeenCalled();
284
284
  expect(onClose).toHaveBeenCalledTimes(1);
@@ -301,15 +301,15 @@ describe('Pdf Preview', function () {
301
301
  });
302
302
  }); });
303
303
  test('Zoom starts at lowest step', function () { return __awaiter(void 0, void 0, void 0, function () {
304
- var onClose, user, canvas;
304
+ var onClose, canvas;
305
305
  return __generator(this, function (_a) {
306
306
  switch (_a.label) {
307
307
  case 0:
308
308
  onClose = jest.fn();
309
- user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
309
+ (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
310
310
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
311
- }).user;
312
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
311
+ });
312
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
313
313
  case 1:
314
314
  _a.sent();
315
315
  canvas = document.querySelector('canvas');
@@ -328,7 +328,7 @@ describe('Pdf Preview', function () {
328
328
  user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
329
329
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
330
330
  }).user;
331
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
331
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
332
332
  case 1:
333
333
  _a.sent();
334
334
  canvas = document.querySelector('canvas');
@@ -361,7 +361,7 @@ describe('Pdf Preview', function () {
361
361
  user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
362
362
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
363
363
  }).user;
364
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
364
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
365
365
  case 1:
366
366
  _a.sent();
367
367
  // eslint-disable-next-line testing-library/no-node-access
@@ -414,7 +414,7 @@ describe('Pdf Preview', function () {
414
414
  user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
415
415
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
416
416
  }).user;
417
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
417
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
418
418
  case 1:
419
419
  _a.sent();
420
420
  // eslint-disable-next-line testing-library/no-node-access
@@ -443,19 +443,19 @@ describe('Pdf Preview', function () {
443
443
  });
444
444
  }); });
445
445
  test('Fit to width zoom set width of pdf to width of the window', function () { return __awaiter(void 0, void 0, void 0, function () {
446
- var onClose, ref, mockPdfWidth, _a, user, container;
447
- return __generator(this, function (_b) {
448
- switch (_b.label) {
446
+ var onClose, ref, mockPdfWidth, user;
447
+ return __generator(this, function (_a) {
448
+ switch (_a.label) {
449
449
  case 0:
450
450
  onClose = jest.fn();
451
451
  ref = react_1.default.createRef();
452
452
  mockPdfWidth = 1000;
453
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
453
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
454
454
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
455
- }), user = _a.user, container = _a.container;
456
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
455
+ }).user;
456
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
457
457
  case 1:
458
- _b.sent();
458
+ _a.sent();
459
459
  // eslint-disable-next-line testing-library/no-node-access
460
460
  expect(document.querySelector('canvas')).toBeVisible();
461
461
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -464,7 +464,7 @@ describe('Pdf Preview', function () {
464
464
  jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
465
465
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
466
466
  case 2:
467
- _b.sent();
467
+ _a.sent();
468
468
  // eslint-disable-next-line testing-library/no-node-access
469
469
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(mockPdfWidth));
470
470
  expect(react_2.screen.getByTestId(zoomResetWidthIcon)).toBeVisible();
@@ -474,19 +474,19 @@ describe('Pdf Preview', function () {
474
474
  });
475
475
  }); });
476
476
  test('Reset zoom set width to lowest step', function () { return __awaiter(void 0, void 0, void 0, function () {
477
- var onClose, ref, mockPdfWidth, _a, user, container;
478
- return __generator(this, function (_b) {
479
- switch (_b.label) {
477
+ var onClose, ref, mockPdfWidth, user;
478
+ return __generator(this, function (_a) {
479
+ switch (_a.label) {
480
480
  case 0:
481
481
  onClose = jest.fn();
482
482
  ref = react_1.default.createRef();
483
483
  mockPdfWidth = 1000;
484
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
484
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
485
485
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
486
- }), user = _a.user, container = _a.container;
487
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
486
+ }).user;
487
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
488
488
  case 1:
489
- _b.sent();
489
+ _a.sent();
490
490
  // eslint-disable-next-line testing-library/no-node-access
491
491
  expect(document.querySelector('canvas')).toBeVisible();
492
492
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -495,14 +495,14 @@ describe('Pdf Preview', function () {
495
495
  jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
496
496
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
497
497
  case 2:
498
- _b.sent();
498
+ _a.sent();
499
499
  // eslint-disable-next-line testing-library/no-node-access
500
500
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(mockPdfWidth));
501
501
  expect(react_2.screen.getByTestId(zoomResetWidthIcon)).toBeVisible();
502
502
  expect(react_2.screen.queryByTestId(zoomFitToWidthIcon)).not.toBeInTheDocument();
503
503
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomResetWidthIcon))];
504
504
  case 3:
505
- _b.sent();
505
+ _a.sent();
506
506
  // eslint-disable-next-line testing-library/no-node-access
507
507
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[0]));
508
508
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -512,26 +512,26 @@ describe('Pdf Preview', function () {
512
512
  });
513
513
  }); });
514
514
  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 () {
515
- var onClose, ref, mockPdfWidth, _a, user, container;
516
- return __generator(this, function (_b) {
517
- switch (_b.label) {
515
+ var onClose, ref, mockPdfWidth, user;
516
+ return __generator(this, function (_a) {
517
+ switch (_a.label) {
518
518
  case 0:
519
519
  onClose = jest.fn();
520
520
  ref = react_1.default.createRef();
521
521
  mockPdfWidth = constants_1.ZOOM_STEPS[0] - 1;
522
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
522
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
523
523
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
524
- }), user = _a.user, container = _a.container;
525
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
524
+ }).user;
525
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
526
526
  case 1:
527
- _b.sent();
527
+ _a.sent();
528
528
  // eslint-disable-next-line testing-library/no-node-access
529
529
  expect(document.querySelector('canvas')).toBeVisible();
530
530
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
531
531
  jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
532
532
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
533
533
  case 2:
534
- _b.sent();
534
+ _a.sent();
535
535
  // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
536
536
  expect(react_2.screen.getByTestId(zoomOutIcon).parentElement).toHaveAttribute('disabled', '');
537
537
  // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
@@ -541,26 +541,26 @@ describe('Pdf Preview', function () {
541
541
  });
542
542
  }); });
543
543
  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 () {
544
- var onClose, ref, mockPdfWidth, _a, user, container;
545
- return __generator(this, function (_b) {
546
- switch (_b.label) {
544
+ var onClose, ref, mockPdfWidth, user;
545
+ return __generator(this, function (_a) {
546
+ switch (_a.label) {
547
547
  case 0:
548
548
  onClose = jest.fn();
549
549
  ref = react_1.default.createRef();
550
550
  mockPdfWidth = constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1] + 1;
551
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
551
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
552
552
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
553
- }), user = _a.user, container = _a.container;
554
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
553
+ }).user;
554
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
555
555
  case 1:
556
- _b.sent();
556
+ _a.sent();
557
557
  // eslint-disable-next-line testing-library/no-node-access
558
558
  expect(document.querySelector('canvas')).toBeVisible();
559
559
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
560
560
  jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
561
561
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
562
562
  case 2:
563
- _b.sent();
563
+ _a.sent();
564
564
  // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
565
565
  expect(react_2.screen.getByTestId(zoomInIcon).parentElement).toHaveAttribute('disabled', '');
566
566
  // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
@@ -570,32 +570,32 @@ describe('Pdf Preview', function () {
570
570
  });
571
571
  }); });
572
572
  test('After fit to width, decrease zoom set zoom to nearest lower zoom step', function () { return __awaiter(void 0, void 0, void 0, function () {
573
- var onClose, ref, stepToReach, mockPdfWidth, _a, user, container;
574
- return __generator(this, function (_b) {
575
- switch (_b.label) {
573
+ var onClose, ref, stepToReach, mockPdfWidth, user;
574
+ return __generator(this, function (_a) {
575
+ switch (_a.label) {
576
576
  case 0:
577
577
  onClose = jest.fn();
578
578
  ref = react_1.default.createRef();
579
579
  stepToReach = 1;
580
580
  mockPdfWidth = constants_1.ZOOM_STEPS[stepToReach + 1] - 1;
581
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
581
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
582
582
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
583
- }), user = _a.user, container = _a.container;
584
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
583
+ }).user;
584
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
585
585
  case 1:
586
- _b.sent();
586
+ _a.sent();
587
587
  // eslint-disable-next-line testing-library/no-node-access
588
588
  expect(document.querySelector('canvas')).toBeVisible();
589
589
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
590
590
  jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
591
591
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
592
592
  case 2:
593
- _b.sent();
593
+ _a.sent();
594
594
  // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
595
595
  expect(react_2.screen.getByTestId(zoomOutIcon).parentElement).not.toHaveAttribute('disabled', '');
596
596
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomOutIcon))];
597
597
  case 3:
598
- _b.sent();
598
+ _a.sent();
599
599
  // eslint-disable-next-line testing-library/no-node-access
600
600
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[stepToReach]));
601
601
  return [2 /*return*/];
@@ -603,32 +603,32 @@ describe('Pdf Preview', function () {
603
603
  });
604
604
  }); });
605
605
  test('After fit to width, increase zoom set zoom to nearest greater zoom step', function () { return __awaiter(void 0, void 0, void 0, function () {
606
- var onClose, ref, stepToReach, mockPdfWidth, _a, user, container;
607
- return __generator(this, function (_b) {
608
- switch (_b.label) {
606
+ var onClose, ref, stepToReach, mockPdfWidth, user;
607
+ return __generator(this, function (_a) {
608
+ switch (_a.label) {
609
609
  case 0:
610
610
  onClose = jest.fn();
611
611
  ref = react_1.default.createRef();
612
612
  stepToReach = 2;
613
613
  mockPdfWidth = constants_1.ZOOM_STEPS[stepToReach - 1] + 1;
614
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
614
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
615
615
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
616
- }), user = _a.user, container = _a.container;
617
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
616
+ }).user;
617
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
618
618
  case 1:
619
- _b.sent();
619
+ _a.sent();
620
620
  // eslint-disable-next-line testing-library/no-node-access
621
621
  expect(document.querySelector('canvas')).toBeVisible();
622
622
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
623
623
  jest.spyOn(ref.current, 'clientWidth', 'get').mockReturnValue(mockPdfWidth);
624
624
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
625
625
  case 2:
626
- _b.sent();
626
+ _a.sent();
627
627
  // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
628
628
  expect(react_2.screen.getByTestId(zoomInIcon).parentElement).not.toHaveAttribute('disabled', '');
629
629
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomInIcon))];
630
630
  case 3:
631
- _b.sent();
631
+ _a.sent();
632
632
  // eslint-disable-next-line testing-library/no-node-access
633
633
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[stepToReach]));
634
634
  return [2 /*return*/];
@@ -636,19 +636,19 @@ describe('Pdf Preview', function () {
636
636
  });
637
637
  }); });
638
638
  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 () {
639
- var onClose, ref, mockPdfWidth, _a, user, container, getPreviewClientWidthMock;
640
- return __generator(this, function (_b) {
641
- switch (_b.label) {
639
+ var onClose, ref, mockPdfWidth, user, getPreviewClientWidthMock;
640
+ return __generator(this, function (_a) {
641
+ switch (_a.label) {
642
642
  case 0:
643
643
  onClose = jest.fn();
644
644
  ref = react_1.default.createRef();
645
645
  mockPdfWidth = [1001, 1501, 2001];
646
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
646
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
647
647
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
648
- }), user = _a.user, container = _a.container;
649
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
648
+ }).user;
649
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
650
650
  case 1:
651
- _b.sent();
651
+ _a.sent();
652
652
  // eslint-disable-next-line testing-library/no-node-access
653
653
  expect(document.querySelector('canvas')).toBeVisible();
654
654
  expect(react_2.screen.getByTestId(zoomFitToWidthIcon)).toBeVisible();
@@ -656,7 +656,7 @@ describe('Pdf Preview', function () {
656
656
  getPreviewClientWidthMock.mockReturnValueOnce(mockPdfWidth[0]);
657
657
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
658
658
  case 2:
659
- _b.sent();
659
+ _a.sent();
660
660
  // eslint-disable-next-line testing-library/no-node-access
661
661
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(mockPdfWidth[0]));
662
662
  getPreviewClientWidthMock.mockReturnValueOnce(mockPdfWidth[1]);
@@ -671,26 +671,25 @@ describe('Pdf Preview', function () {
671
671
  });
672
672
  }); });
673
673
  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 () {
674
- var onClose, ref, mockPdfWidth, _a, user, container;
675
- return __generator(this, function (_b) {
676
- switch (_b.label) {
674
+ var onClose, ref, user;
675
+ return __generator(this, function (_a) {
676
+ switch (_a.label) {
677
677
  case 0:
678
678
  onClose = jest.fn();
679
679
  ref = react_1.default.createRef();
680
- mockPdfWidth = [1001, 1501, 2001];
681
- _a = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
680
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose, ref: ref }), {
682
681
  setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
683
- }), user = _a.user, container = _a.container;
684
- return [4 /*yield*/, react_2.screen.findByText(/loading pdf/i)];
682
+ }).user;
683
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
685
684
  case 1:
686
- _b.sent();
685
+ _a.sent();
687
686
  // eslint-disable-next-line testing-library/no-node-access
688
687
  expect(document.querySelector('canvas')).toBeVisible();
689
688
  // eslint-disable-next-line jest-dom/prefer-enabled-disabled,testing-library/no-node-access
690
689
  expect(react_2.screen.getByTestId(zoomOutIcon).parentElement).toHaveAttribute('disabled', '');
691
690
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomOutIcon))];
692
691
  case 2:
693
- _b.sent();
692
+ _a.sent();
694
693
  // eslint-disable-next-line testing-library/no-node-access
695
694
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[0]));
696
695
  expect(onClose).not.toHaveBeenCalled();
@@ -699,14 +698,14 @@ describe('Pdf Preview', function () {
699
698
  .mockReturnValue(constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1]);
700
699
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomFitToWidthIcon))];
701
700
  case 3:
702
- _b.sent();
701
+ _a.sent();
703
702
  // eslint-disable-next-line testing-library/no-node-access
704
703
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1]));
705
704
  // eslint-disable-next-line testing-library/no-node-access,jest-dom/prefer-enabled-disabled
706
705
  expect(react_2.screen.getByTestId(zoomInIcon).parentElement).toHaveAttribute('disabled', '');
707
706
  return [4 /*yield*/, user.click(react_2.screen.getByTestId(zoomInIcon))];
708
707
  case 4:
709
- _b.sent();
708
+ _a.sent();
710
709
  // eslint-disable-next-line testing-library/no-node-access
711
710
  expect(document.querySelector('canvas')).toHaveAttribute('width', "".concat(constants_1.ZOOM_STEPS[constants_1.ZOOM_STEPS.length - 1]));
712
711
  expect(onClose).not.toHaveBeenCalled();
@@ -714,5 +713,533 @@ describe('Pdf Preview', function () {
714
713
  }
715
714
  });
716
715
  }); });
716
+ describe('Page selector', function () {
717
+ test('shows page controller', function () { return __awaiter(void 0, void 0, void 0, function () {
718
+ var onClose;
719
+ return __generator(this, function (_a) {
720
+ switch (_a.label) {
721
+ case 0:
722
+ onClose = jest.fn();
723
+ (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
724
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
725
+ });
726
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
727
+ case 1:
728
+ _a.sent();
729
+ // eslint-disable-next-line testing-library/no-node-access
730
+ expect(document.querySelector('canvas')).toBeVisible();
731
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
732
+ expect(react_2.screen.getByRole('textbox', { name: /current page/i })).toBeVisible();
733
+ // mock pdf has 4 pages
734
+ expect(react_2.screen.getByText('4')).toBeVisible();
735
+ return [2 /*return*/];
736
+ }
737
+ });
738
+ }); });
739
+ test('blur is a confirmation event on page input', function () { return __awaiter(void 0, void 0, void 0, function () {
740
+ var onClose, user, pageInput;
741
+ return __generator(this, function (_a) {
742
+ switch (_a.label) {
743
+ case 0:
744
+ onClose = jest.fn();
745
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
746
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
747
+ }).user;
748
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
749
+ case 1:
750
+ _a.sent();
751
+ // eslint-disable-next-line testing-library/no-node-access
752
+ expect(document.querySelector('canvas')).toBeVisible();
753
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
754
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
755
+ expect(pageInput).toHaveDisplayValue('1');
756
+ return [4 /*yield*/, user.clear(pageInput)];
757
+ case 2:
758
+ _a.sent();
759
+ return [4 /*yield*/, user.type(pageInput, '2')];
760
+ case 3:
761
+ _a.sent();
762
+ return [4 /*yield*/, user.tab()];
763
+ case 4:
764
+ _a.sent();
765
+ expect(pageInput).not.toHaveFocus();
766
+ expect(pageInput).toHaveDisplayValue('2');
767
+ return [2 /*return*/];
768
+ }
769
+ });
770
+ }); });
771
+ test('enter key is a confirmation event on page input', function () { return __awaiter(void 0, void 0, void 0, function () {
772
+ var onClose, user, pageInput;
773
+ return __generator(this, function (_a) {
774
+ switch (_a.label) {
775
+ case 0:
776
+ onClose = jest.fn();
777
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
778
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
779
+ }).user;
780
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
781
+ case 1:
782
+ _a.sent();
783
+ // eslint-disable-next-line testing-library/no-node-access
784
+ expect(document.querySelector('canvas')).toBeVisible();
785
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
786
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
787
+ expect(pageInput).toHaveDisplayValue('1');
788
+ return [4 /*yield*/, user.clear(pageInput)];
789
+ case 2:
790
+ _a.sent();
791
+ return [4 /*yield*/, user.type(pageInput, '2')];
792
+ case 3:
793
+ _a.sent();
794
+ return [4 /*yield*/, user.type(pageInput, '{Enter}')];
795
+ case 4:
796
+ _a.sent();
797
+ expect(pageInput).not.toHaveFocus();
798
+ expect(pageInput).toHaveDisplayValue('2');
799
+ return [2 /*return*/];
800
+ }
801
+ });
802
+ }); });
803
+ 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 () {
804
+ var onClose, scrollIntoViewFn, user, pageInput;
805
+ return __generator(this, function (_a) {
806
+ switch (_a.label) {
807
+ case 0:
808
+ onClose = jest.fn();
809
+ scrollIntoViewFn = jest.fn();
810
+ window.HTMLElement.prototype.scrollIntoView = scrollIntoViewFn;
811
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
812
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
813
+ }).user;
814
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
815
+ case 1:
816
+ _a.sent();
817
+ // eslint-disable-next-line testing-library/no-node-access
818
+ expect(document.querySelector('canvas')).toBeVisible();
819
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
820
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
821
+ expect(pageInput).toHaveDisplayValue('1');
822
+ return [4 /*yield*/, user.clear(pageInput)];
823
+ case 2:
824
+ _a.sent();
825
+ return [4 /*yield*/, user.type(pageInput, '2')];
826
+ case 3:
827
+ _a.sent();
828
+ return [4 /*yield*/, user.click(react_2.screen.getByText(/page/i))];
829
+ case 4:
830
+ _a.sent();
831
+ expect(pageInput).not.toHaveFocus();
832
+ expect(pageInput).toHaveDisplayValue('2');
833
+ expect(scrollIntoViewFn).toHaveBeenCalledTimes(1);
834
+ expect(scrollIntoViewFn.mock.instances[0]).toHaveAttribute('data-page-number', '2');
835
+ return [2 /*return*/];
836
+ }
837
+ });
838
+ }); });
839
+ 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 () {
840
+ var onClose, scrollIntoViewFn, user, pageInput;
841
+ return __generator(this, function (_a) {
842
+ switch (_a.label) {
843
+ case 0:
844
+ onClose = jest.fn();
845
+ scrollIntoViewFn = jest.fn();
846
+ window.HTMLElement.prototype.scrollIntoView = scrollIntoViewFn;
847
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
848
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
849
+ }).user;
850
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
851
+ case 1:
852
+ _a.sent();
853
+ // eslint-disable-next-line testing-library/no-node-access
854
+ expect(document.querySelector('canvas')).toBeVisible();
855
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
856
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
857
+ expect(pageInput).toHaveDisplayValue('1');
858
+ return [4 /*yield*/, user.clear(pageInput)];
859
+ case 2:
860
+ _a.sent();
861
+ return [4 /*yield*/, user.type(pageInput, 'invalid')];
862
+ case 3:
863
+ _a.sent();
864
+ return [4 /*yield*/, user.click(react_2.screen.getByText(/page/i))];
865
+ case 4:
866
+ _a.sent();
867
+ expect(pageInput).not.toHaveFocus();
868
+ expect(pageInput).toHaveDisplayValue('1');
869
+ expect(scrollIntoViewFn).not.toHaveBeenCalled();
870
+ return [2 /*return*/];
871
+ }
872
+ });
873
+ }); });
874
+ 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 () {
875
+ var onClose, pageInput, page2Element;
876
+ return __generator(this, function (_a) {
877
+ switch (_a.label) {
878
+ case 0:
879
+ onClose = jest.fn();
880
+ (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
881
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
882
+ });
883
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
884
+ case 1:
885
+ _a.sent();
886
+ // eslint-disable-next-line testing-library/no-node-access
887
+ expect(document.querySelector('canvas')).toBeVisible();
888
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
889
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
890
+ expect(pageInput).toHaveDisplayValue('1');
891
+ page2Element = document.querySelector('[data-page-number="2"]');
892
+ expect(page2Element).not.toBeNull();
893
+ return [4 /*yield*/, (0, test_utils_1.triggerObserver)(page2Element)];
894
+ case 2:
895
+ _a.sent();
896
+ expect(pageInput).toHaveDisplayValue('2');
897
+ return [2 /*return*/];
898
+ }
899
+ });
900
+ }); });
901
+ test('on scroll, if focus is on input, value is updated with current page', function () { return __awaiter(void 0, void 0, void 0, function () {
902
+ var onClose, user, pageInput, page2Element;
903
+ return __generator(this, function (_a) {
904
+ switch (_a.label) {
905
+ case 0:
906
+ onClose = jest.fn();
907
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
908
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
909
+ }).user;
910
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
911
+ case 1:
912
+ _a.sent();
913
+ // eslint-disable-next-line testing-library/no-node-access
914
+ expect(document.querySelector('canvas')).toBeVisible();
915
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
916
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
917
+ expect(pageInput).toHaveDisplayValue('1');
918
+ return [4 /*yield*/, user.clear(pageInput)];
919
+ case 2:
920
+ _a.sent();
921
+ return [4 /*yield*/, user.type(pageInput, '4')];
922
+ case 3:
923
+ _a.sent();
924
+ expect(pageInput).toHaveFocus();
925
+ page2Element = document.querySelector('[data-page-number="2"]');
926
+ expect(page2Element).not.toBeNull();
927
+ return [4 /*yield*/, (0, test_utils_1.triggerObserver)(page2Element)];
928
+ case 4:
929
+ _a.sent();
930
+ expect(pageInput).toHaveDisplayValue('2');
931
+ expect(pageInput).toHaveFocus();
932
+ return [2 /*return*/];
933
+ }
934
+ });
935
+ }); });
936
+ test('must press esc key 2 times to make user exit from the preview, when focus is on input', function () { return __awaiter(void 0, void 0, void 0, function () {
937
+ var onClose, user, pageInput;
938
+ return __generator(this, function (_a) {
939
+ switch (_a.label) {
940
+ case 0:
941
+ onClose = jest.fn();
942
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
943
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
944
+ }).user;
945
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
946
+ case 1:
947
+ _a.sent();
948
+ // eslint-disable-next-line testing-library/no-node-access
949
+ expect(document.querySelector('canvas')).toBeVisible();
950
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
951
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
952
+ expect(pageInput).toHaveDisplayValue('1');
953
+ return [4 /*yield*/, user.clear(pageInput)];
954
+ case 2:
955
+ _a.sent();
956
+ return [4 /*yield*/, user.type(pageInput, '4')];
957
+ case 3:
958
+ _a.sent();
959
+ expect(pageInput).toHaveFocus();
960
+ return [4 /*yield*/, user.keyboard('{Escape}')];
961
+ case 4:
962
+ _a.sent();
963
+ expect(onClose).not.toHaveBeenCalled();
964
+ return [4 /*yield*/, user.keyboard('{Escape}')];
965
+ case 5:
966
+ _a.sent();
967
+ expect(onClose).toHaveBeenCalledTimes(1);
968
+ return [2 /*return*/];
969
+ }
970
+ });
971
+ }); });
972
+ });
973
+ describe('keyboard shortcuts', function () {
974
+ describe('Home and End', function () {
975
+ test('click End go to last page and Home return to the first page', function () { return __awaiter(void 0, void 0, void 0, function () {
976
+ var onClose, user, pageInput;
977
+ return __generator(this, function (_a) {
978
+ switch (_a.label) {
979
+ case 0:
980
+ onClose = jest.fn();
981
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
982
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
983
+ }).user;
984
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
985
+ case 1:
986
+ _a.sent();
987
+ // eslint-disable-next-line testing-library/no-node-access
988
+ expect(document.querySelector('canvas')).toBeVisible();
989
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
990
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
991
+ expect(pageInput).toHaveDisplayValue('1');
992
+ return [4 /*yield*/, user.keyboard('{End}')];
993
+ case 2:
994
+ _a.sent();
995
+ expect(pageInput).toHaveDisplayValue('4');
996
+ return [4 /*yield*/, user.keyboard('{Home}')];
997
+ case 3:
998
+ _a.sent();
999
+ expect(pageInput).toHaveDisplayValue('1');
1000
+ return [2 /*return*/];
1001
+ }
1002
+ });
1003
+ }); });
1004
+ test('click End go to last page and Home return to the first page, but they do not work if the page input is focussed ', function () { return __awaiter(void 0, void 0, void 0, function () {
1005
+ var onClose, user, pageInput;
1006
+ return __generator(this, function (_a) {
1007
+ switch (_a.label) {
1008
+ case 0:
1009
+ onClose = jest.fn();
1010
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
1011
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
1012
+ }).user;
1013
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
1014
+ case 1:
1015
+ _a.sent();
1016
+ // eslint-disable-next-line testing-library/no-node-access
1017
+ expect(document.querySelector('canvas')).toBeVisible();
1018
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
1019
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
1020
+ expect(pageInput).toHaveDisplayValue('1');
1021
+ return [4 /*yield*/, user.click(pageInput)];
1022
+ case 2:
1023
+ _a.sent();
1024
+ expect(pageInput).toHaveFocus();
1025
+ return [4 /*yield*/, user.keyboard('{End}')];
1026
+ case 3:
1027
+ _a.sent();
1028
+ expect(pageInput).not.toHaveDisplayValue('4');
1029
+ expect(pageInput).toHaveDisplayValue('1');
1030
+ // remove focus
1031
+ return [4 /*yield*/, user.keyboard('{Escape}')];
1032
+ case 4:
1033
+ // remove focus
1034
+ _a.sent();
1035
+ expect(pageInput).not.toHaveFocus();
1036
+ return [4 /*yield*/, user.keyboard('{End}')];
1037
+ case 5:
1038
+ _a.sent();
1039
+ expect(pageInput).toHaveDisplayValue('4');
1040
+ // focus input again
1041
+ return [4 /*yield*/, user.click(pageInput)];
1042
+ case 6:
1043
+ // focus input again
1044
+ _a.sent();
1045
+ expect(pageInput).toHaveFocus();
1046
+ return [4 /*yield*/, user.keyboard('{Home}')];
1047
+ case 7:
1048
+ _a.sent();
1049
+ expect(pageInput).not.toHaveDisplayValue('1');
1050
+ expect(pageInput).toHaveDisplayValue('4');
1051
+ // remove focus
1052
+ return [4 /*yield*/, user.keyboard('{Escape}')];
1053
+ case 8:
1054
+ // remove focus
1055
+ _a.sent();
1056
+ expect(pageInput).not.toHaveFocus();
1057
+ return [4 /*yield*/, user.keyboard('{Home}')];
1058
+ case 9:
1059
+ _a.sent();
1060
+ expect(pageInput).toHaveDisplayValue('1');
1061
+ return [2 /*return*/];
1062
+ }
1063
+ });
1064
+ }); });
1065
+ });
1066
+ describe('PageUp and PageDown', function () {
1067
+ test('click PageDown go to the next page and PageUp go to the previous page', function () { return __awaiter(void 0, void 0, void 0, function () {
1068
+ var onClose, user, pageInput;
1069
+ return __generator(this, function (_a) {
1070
+ switch (_a.label) {
1071
+ case 0:
1072
+ onClose = jest.fn();
1073
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
1074
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
1075
+ }).user;
1076
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
1077
+ case 1:
1078
+ _a.sent();
1079
+ // eslint-disable-next-line testing-library/no-node-access
1080
+ expect(document.querySelector('canvas')).toBeVisible();
1081
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
1082
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
1083
+ expect(pageInput).toHaveDisplayValue('1');
1084
+ return [4 /*yield*/, user.keyboard('{PageDown}')];
1085
+ case 2:
1086
+ _a.sent();
1087
+ expect(pageInput).toHaveDisplayValue('2');
1088
+ return [4 /*yield*/, user.keyboard('{PageDown}')];
1089
+ case 3:
1090
+ _a.sent();
1091
+ expect(pageInput).toHaveDisplayValue('3');
1092
+ return [4 /*yield*/, user.keyboard('{PageDown}')];
1093
+ case 4:
1094
+ _a.sent();
1095
+ expect(pageInput).toHaveDisplayValue('4');
1096
+ return [4 /*yield*/, user.keyboard('{PageDown}')];
1097
+ case 5:
1098
+ _a.sent();
1099
+ expect(pageInput).toHaveDisplayValue('4');
1100
+ return [4 /*yield*/, user.keyboard('{PageUp}')];
1101
+ case 6:
1102
+ _a.sent();
1103
+ expect(pageInput).toHaveDisplayValue('3');
1104
+ return [4 /*yield*/, user.keyboard('{PageUp}')];
1105
+ case 7:
1106
+ _a.sent();
1107
+ expect(pageInput).toHaveDisplayValue('2');
1108
+ return [4 /*yield*/, user.keyboard('{PageUp}')];
1109
+ case 8:
1110
+ _a.sent();
1111
+ expect(pageInput).toHaveDisplayValue('1');
1112
+ return [4 /*yield*/, user.keyboard('{PageUp}')];
1113
+ case 9:
1114
+ _a.sent();
1115
+ expect(pageInput).toHaveDisplayValue('1');
1116
+ return [2 /*return*/];
1117
+ }
1118
+ });
1119
+ }); });
1120
+ test('click PageDown go to the next page and PageUp go to the previous page, but they do not work if the page input is focussed ', function () { return __awaiter(void 0, void 0, void 0, function () {
1121
+ var onClose, user, pageInput;
1122
+ return __generator(this, function (_a) {
1123
+ switch (_a.label) {
1124
+ case 0:
1125
+ onClose = jest.fn();
1126
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
1127
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
1128
+ }).user;
1129
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
1130
+ case 1:
1131
+ _a.sent();
1132
+ // eslint-disable-next-line testing-library/no-node-access
1133
+ expect(document.querySelector('canvas')).toBeVisible();
1134
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
1135
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
1136
+ expect(pageInput).toHaveDisplayValue('1');
1137
+ return [4 /*yield*/, user.click(pageInput)];
1138
+ case 2:
1139
+ _a.sent();
1140
+ expect(pageInput).toHaveFocus();
1141
+ return [4 /*yield*/, user.keyboard('{PageDown}')];
1142
+ case 3:
1143
+ _a.sent();
1144
+ expect(pageInput).not.toHaveDisplayValue('2');
1145
+ expect(pageInput).toHaveDisplayValue('1');
1146
+ // remove focus
1147
+ return [4 /*yield*/, user.keyboard('{Escape}')];
1148
+ case 4:
1149
+ // remove focus
1150
+ _a.sent();
1151
+ expect(pageInput).not.toHaveFocus();
1152
+ return [4 /*yield*/, user.keyboard('{PageDown}')];
1153
+ case 5:
1154
+ _a.sent();
1155
+ expect(pageInput).toHaveDisplayValue('2');
1156
+ // focus input again
1157
+ return [4 /*yield*/, user.click(pageInput)];
1158
+ case 6:
1159
+ // focus input again
1160
+ _a.sent();
1161
+ expect(pageInput).toHaveFocus();
1162
+ return [4 /*yield*/, user.keyboard('{PageUp}')];
1163
+ case 7:
1164
+ _a.sent();
1165
+ expect(pageInput).not.toHaveDisplayValue('1');
1166
+ expect(pageInput).toHaveDisplayValue('2');
1167
+ // remove focus
1168
+ return [4 /*yield*/, user.keyboard('{Escape}')];
1169
+ case 8:
1170
+ // remove focus
1171
+ _a.sent();
1172
+ expect(pageInput).not.toHaveFocus();
1173
+ return [4 /*yield*/, user.keyboard('{PageUp}')];
1174
+ case 9:
1175
+ _a.sent();
1176
+ expect(pageInput).toHaveDisplayValue('1');
1177
+ return [2 /*return*/];
1178
+ }
1179
+ });
1180
+ }); });
1181
+ });
1182
+ test('ArrowUp and ArrowDown', function () { return __awaiter(void 0, void 0, void 0, function () {
1183
+ var onClose, scrollByFn, user, pageInput;
1184
+ return __generator(this, function (_a) {
1185
+ switch (_a.label) {
1186
+ case 0:
1187
+ onClose = jest.fn();
1188
+ scrollByFn = jest.fn();
1189
+ window.HTMLElement.prototype.scrollBy = scrollByFn;
1190
+ user = (0, test_utils_1.setup)(react_1.default.createElement(PdfPreview_1.PdfPreview, { show: true, src: pdfFile.dataURI, onClose: onClose }), {
1191
+ setupOptions: { advanceTimers: function () { return Promise.resolve(); } }
1192
+ }).user;
1193
+ return [4 /*yield*/, react_2.screen.findByText(/Loading document preview…/i)];
1194
+ case 1:
1195
+ _a.sent();
1196
+ // eslint-disable-next-line testing-library/no-node-access
1197
+ expect(document.querySelector('canvas')).toBeVisible();
1198
+ expect(react_2.screen.getByText(/page/i)).toBeVisible();
1199
+ pageInput = react_2.screen.getByRole('textbox', { name: /current page/i });
1200
+ expect(pageInput).toHaveDisplayValue('1');
1201
+ return [4 /*yield*/, user.click(pageInput)];
1202
+ case 2:
1203
+ _a.sent();
1204
+ expect(pageInput).toHaveFocus();
1205
+ return [4 /*yield*/, user.keyboard('{ArrowDown}')];
1206
+ case 3:
1207
+ _a.sent();
1208
+ expect(scrollByFn).not.toHaveBeenCalled();
1209
+ // remove focus
1210
+ return [4 /*yield*/, user.keyboard('{Escape}')];
1211
+ case 4:
1212
+ // remove focus
1213
+ _a.sent();
1214
+ expect(pageInput).not.toHaveFocus();
1215
+ return [4 /*yield*/, user.keyboard('{ArrowDown}')];
1216
+ case 5:
1217
+ _a.sent();
1218
+ expect(scrollByFn).toHaveBeenCalledTimes(1);
1219
+ expect(scrollByFn).toHaveBeenCalledWith(0, 40);
1220
+ return [4 /*yield*/, user.click(pageInput)];
1221
+ case 6:
1222
+ _a.sent();
1223
+ expect(pageInput).toHaveFocus();
1224
+ return [4 /*yield*/, user.keyboard('{ArrowUp}')];
1225
+ case 7:
1226
+ _a.sent();
1227
+ expect(scrollByFn).toHaveBeenCalledTimes(1);
1228
+ // remove focus
1229
+ return [4 /*yield*/, user.keyboard('{Escape}')];
1230
+ case 8:
1231
+ // remove focus
1232
+ _a.sent();
1233
+ expect(pageInput).not.toHaveFocus();
1234
+ return [4 /*yield*/, user.keyboard('{ArrowUp}')];
1235
+ case 9:
1236
+ _a.sent();
1237
+ expect(scrollByFn).toHaveBeenCalledTimes(2);
1238
+ expect(scrollByFn).toHaveBeenCalledWith(0, -40);
1239
+ return [2 /*return*/];
1240
+ }
1241
+ });
1242
+ }); });
1243
+ });
717
1244
  });
718
1245
  //# sourceMappingURL=PdfPreview.test.js.map