From 5bb2cb14f1055c466ac84e65594ab4846e3d9c69 Mon Sep 17 00:00:00 2001
From: Chris Beer <chris@cbeer.info>
Date: Thu, 17 Mar 2022 10:08:24 -0700
Subject: [PATCH] Guard against empty canvas groupings. Related to #3543
(#3545)
---
__tests__/src/components/ThumbnailNavigation.test.js | 6 ++++++
src/components/ThumbnailNavigation.js | 4 +++-
src/lib/CanvasWorld.js | 4 ++--
3 files changed, 11 insertions(+), 3 deletions(-)
diff --git a/__tests__/src/components/ThumbnailNavigation.test.js b/__tests__/src/components/ThumbnailNavigation.test.js
index 249402239..671738378 100644
--- a/__tests__/src/components/ThumbnailNavigation.test.js
+++ b/__tests__/src/components/ThumbnailNavigation.test.js
@@ -100,6 +100,12 @@ describe('ThumbnailNavigation', () => {
expect(wrapper.instance().areaHeight()).toEqual(150);
expect(rightWrapper.instance().areaHeight(99)).toEqual(99);
});
+ describe('without any canvases', () => {
+ it('returns the default for the calculated size', () => {
+ wrapper = createWrapper({ canvasGroupings: new CanvasGroupings([]).groupings() });
+ expect(wrapper.instance().calculateScaledSize(0)).toEqual(108);
+ });
+ });
});
describe('keyboard navigation', () => {
const setNextCanvas = jest.fn();
diff --git a/src/components/ThumbnailNavigation.js b/src/components/ThumbnailNavigation.js
index fb85a4838..7b0497040 100644
--- a/src/components/ThumbnailNavigation.js
+++ b/src/components/ThumbnailNavigation.js
@@ -69,7 +69,9 @@ export class ThumbnailNavigation extends Component {
*/
calculateScaledSize(index) {
const { thumbnailNavigation, canvasGroupings, position } = this.props;
- const canvases = canvasGroupings[index] || [];
+ const canvases = canvasGroupings[index];
+ if (!canvases) return thumbnailNavigation.width + this.spacing;
+
const world = new CanvasWorld(canvases);
const bounds = world.worldBounds();
switch (position) {
diff --git a/src/lib/CanvasWorld.js b/src/lib/CanvasWorld.js
index cb1e0078c..acdd5c245 100644
--- a/src/lib/CanvasWorld.js
+++ b/src/lib/CanvasWorld.js
@@ -203,8 +203,8 @@ export default class CanvasWorld {
* lined up horizontally starting from left to right.
*/
worldBounds() {
- const worldWidth = Math.max(...this.canvasDimensions.map(c => c.x + c.width));
- const worldHeight = Math.max(...this.canvasDimensions.map(c => c.y + c.height));
+ const worldWidth = Math.max(0, ...this.canvasDimensions.map(c => c.x + c.width));
+ const worldHeight = Math.max(0, ...this.canvasDimensions.map(c => c.y + c.height));
return [
0,
--
GitLab