From 5a87faf0bd22e8f22460707a75bb17741c61148f Mon Sep 17 00:00:00 2001
From: Aaron Dodson <adodson@google.com>
Date: Mon, 4 Nov 2024 14:52:33 -0800
Subject: [PATCH 1/2] fix: Fix crash when resizing page while editing a field.
---
core/field_input.ts | 33 ++++++++++++++++++---------------
1 file changed, 18 insertions(+), 15 deletions(-)
diff --git a/core/field_input.ts b/core/field_input.ts
index 7ef5a01bc7..adae602f38 100644
--- a/core/field_input.ts
+++ b/core/field_input.ts
@@ -28,6 +28,7 @@ import {
UnattachedFieldError,
} from './field.js';
import {Msg} from './msg.js';
+import * as renderManagement from './render_management.js';
import * as aria from './utils/aria.js';
import {Coordinate} from './utils/coordinate.js';
import * as dom from './utils/dom.js';
@@ -630,22 +631,24 @@ export abstract class FieldInput<T extends InputTypes> extends Field<
/** Resize the editor to fit the text. */
protected resizeEditor_() {
- const block = this.getSourceBlock();
- if (!block) {
- throw new UnattachedFieldError();
- }
- const div = WidgetDiv.getDiv();
- const bBox = this.getScaledBBox();
- div!.style.width = bBox.right - bBox.left + 'px';
- div!.style.height = bBox.bottom - bBox.top + 'px';
+ renderManagement.finishQueuedRenders().then(() => {
+ const block = this.getSourceBlock();
+ if (!block) {
+ throw new UnattachedFieldError();
+ }
+ const div = WidgetDiv.getDiv();
+ const bBox = this.getScaledBBox();
+ div!.style.width = bBox.right - bBox.left + 'px';
+ div!.style.height = bBox.bottom - bBox.top + 'px';
- // In RTL mode block fields and LTR input fields the left edge moves,
- // whereas the right edge is fixed. Reposition the editor.
- const x = block.RTL ? bBox.right - div!.offsetWidth : bBox.left;
- const xy = new Coordinate(x, bBox.top);
+ // In RTL mode block fields and LTR input fields the left edge moves,
+ // whereas the right edge is fixed. Reposition the editor.
+ const x = block.RTL ? bBox.right - div!.offsetWidth : bBox.left;
+ const xy = new Coordinate(x, bBox.top);
- div!.style.left = xy.x + 'px';
- div!.style.top = xy.y + 'px';
+ div!.style.left = xy.x + 'px';
+ div!.style.top = xy.y + 'px';
+ });
}
/**
@@ -657,7 +660,7 @@ export abstract class FieldInput<T extends InputTypes> extends Field<
* div.
*/
override repositionForWindowResize(): boolean {
- const block = this.getSourceBlock();
+ const block = this.getSourceBlock()?.getRootBlock();
// This shouldn't be possible. We should never have a WidgetDiv if not using
// rendered blocks.
if (!(block instanceof BlockSvg)) return false;
From 25e9f032d9ac7b9657d7202792281a92bb7ab132 Mon Sep 17 00:00:00 2001
From: Aaron Dodson <adodson@google.com>
Date: Mon, 11 Nov 2024 08:49:16 -0800
Subject: [PATCH 2/2] refactor: Clean up positioning and exceptions.
---
core/field_input.ts | 11 ++++-------
1 file changed, 4 insertions(+), 7 deletions(-)
diff --git a/core/field_input.ts b/core/field_input.ts
index adae602f38..722316f4f4 100644
--- a/core/field_input.ts
+++ b/core/field_input.ts
@@ -30,7 +30,6 @@ import {
import {Msg} from './msg.js';
import * as renderManagement from './render_management.js';
import * as aria from './utils/aria.js';
-import {Coordinate} from './utils/coordinate.js';
import * as dom from './utils/dom.js';
import {Size} from './utils/size.js';
import * as userAgent from './utils/useragent.js';
@@ -633,9 +632,7 @@ export abstract class FieldInput<T extends InputTypes> extends Field<
protected resizeEditor_() {
renderManagement.finishQueuedRenders().then(() => {
const block = this.getSourceBlock();
- if (!block) {
- throw new UnattachedFieldError();
- }
+ if (!block) throw new UnattachedFieldError();
const div = WidgetDiv.getDiv();
const bBox = this.getScaledBBox();
div!.style.width = bBox.right - bBox.left + 'px';
@@ -644,10 +641,10 @@ export abstract class FieldInput<T extends InputTypes> extends Field<
// In RTL mode block fields and LTR input fields the left edge moves,
// whereas the right edge is fixed. Reposition the editor.
const x = block.RTL ? bBox.right - div!.offsetWidth : bBox.left;
- const xy = new Coordinate(x, bBox.top);
+ const y = bBox.top;
- div!.style.left = xy.x + 'px';
- div!.style.top = xy.y + 'px';
+ div!.style.left = `${x}px`;
+ div!.style.top = `${y}px`;
});
}