Archives/gristlabs_grist-core
1
0
Fork 0
mirror of https://github.com/gristlabs/grist-core.git synced 2024-10-27 20:44:07 +00:00
Code Issues Projects Releases Wiki Activity

(core) When managing focus, don't auto-scroll

Browse Source 
Summary:
When Grist is embedded, calls to focus() cause the outer page to scroll to the embed iframe. Because this happens automatically on load, this cause the page to jump to the embed (not consistent across browsers, but at least in Chrome on Windows).

This change changes the automatic focus() calls to avoid scrolling. In the normal app, it should make no difference; in embedded context, this avoids the unexpected scrolling of the parent page.

Test Plan: Tested manually, with Anais's help: in her browser, embedded Grist consistently caused the page to jump to the embed before the change, and not after.

Reviewers: jarek

Reviewed By: jarek

Differential Revision: https://phab.getgrist.com/D3631
This commit is contained in:
Dmitry S 2022-09-12 23:09:15 -04:00
parent 1a091f1dd5
commit 23008038b7
1 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/client/lib/FocusLayer.ts
View File

@ -82,7 +82,7 @@ class FocusLayerManager extends Disposable {
this._focusLayers.push(layer); this._focusLayers.push(layer);
// Move the focus to the new layer. Not just grabFocus, because if the focus is on the previous // Move the focus to the new layer. Not just grabFocus, because if the focus is on the previous
// layer's defaultFocusElem, the new layer might consider it "allowed" and never get the focus. // layer's defaultFocusElem, the new layer might consider it "allowed" and never get the focus.
setTimeout(() => layer.defaultFocusElem.focus(), 0); setTimeout(() => layer.defaultFocusElem.focus({preventScroll: true}), 0);
} }
public removeLayer(layer: FocusLayer) { public removeLayer(layer: FocusLayer) {
@ -121,7 +121,7 @@ class FocusLayerManager extends Disposable {
watchElementForBlur(document.activeElement, () => this.grabFocus()); watchElementForBlur(document.activeElement, () => this.grabFocus());
layer.onDefaultBlur(); layer.onDefaultBlur();
} else { } else {
layer.defaultFocusElem.focus(); layer.defaultFocusElem.focus({preventScroll: true});
layer.onDefaultFocus(); layer.onDefaultFocus();
} }
} }