@jsenv/dom 0.17.77 → 0.17.79

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 (2) hide show
  1. package/dist/jsenv_dom.js +33 -11
  2. package/package.json +1 -1
package/dist/jsenv_dom.js CHANGED
@@ -16673,9 +16673,10 @@ const stickyAsRelativeCoords = (
16673
16673
  * to do with the field being typed into — the page reflows, fixed bars move,
16674
16674
  * and a mobile browser fires that resize transiently as focus goes from one
16675
16675
  * input to the next. Overlaying leaves the layout alone and hands over a
16676
- * number instead. So navi takes it by default (see its own index.js) and only
16677
- * offers a way back out, for an app whose own layout was built around the
16678
- * viewport shrinking.
16676
+ * number instead. navi offers it (enableVirtualKeyboardOverlay) rather than
16677
+ * taking it by default: the deal also takes away what the browser does for a
16678
+ * shrinking viewport, and that has to be redone by hand (see navi's
16679
+ * layout/virtual_keyboard.js).
16679
16680
  */
16680
16681
 
16681
16682
  const virtualKeyboard = window.navigator.virtualKeyboard;
@@ -16703,6 +16704,11 @@ const setVirtualKeyboardOverlaysContent = (value) => {
16703
16704
  * `overlaysContent` is false: a keyboard that resized the viewport covers
16704
16705
  * nothing that is left of it, so the zero is the right answer rather than a
16705
16706
  * missing one.
16707
+ *
16708
+ * The height only, never `boundingRect.y`: moving focus from one field to
16709
+ * another with the keyboard up, Chrome 153 (Android 10) reported the same
16710
+ * height with a top 200px off, its bottom nowhere near the screen's. The
16711
+ * keyboard is at the bottom of the viewport; its height is what holds.
16706
16712
  */
16707
16713
  const getVirtualKeyboardOverlayHeight = () => {
16708
16714
  if (!virtualKeyboard) {
@@ -16713,21 +16719,37 @@ const getVirtualKeyboardOverlayHeight = () => {
16713
16719
  };
16714
16720
 
16715
16721
  /**
16716
- * Calls `callback` whenever the keyboard shows, hides or resizes. Returns an
16717
- * unsubscribe function; a no-op (never calls back) without support.
16722
+ * Calls `callback` whenever the keyboard shows, hides or resizes — whenever
16723
+ * getVirtualKeyboardOverlayHeight() changes. Returns an unsubscribe function;
16724
+ * a no-op (never calls back) without support.
16725
+ *
16726
+ * On the height alone: Chrome (Android 10 / Chrome 153) also fires
16727
+ * "geometrychange" at an unchanged height while the page is scrolled with the
16728
+ * keyboard up, and a listener acting on those — bringing the focused field
16729
+ * back into view — takes the scroll away from the user. The rest of the rect
16730
+ * says nothing either (see getVirtualKeyboardOverlayHeight for its y).
16718
16731
  *
16719
16732
  * Undebounced on purpose, unlike window/visualViewport resize
16720
- * (window_size.js): "geometrychange" is not the transient storm those are —
16721
- * it fires on the keyboard itself changing, not on the layout reacting to it,
16722
- * which is the whole point of overlaying.
16733
+ * (window_size.js): filtered on the height, what is left is the keyboard
16734
+ * itself changing, not the layout reacting to it, which is the whole point of
16735
+ * overlaying.
16723
16736
  */
16724
16737
  const subscribeVirtualKeyboardGeometryChange = (callback) => {
16725
16738
  if (!virtualKeyboard) {
16726
16739
  return () => {};
16727
16740
  }
16728
- virtualKeyboard.addEventListener("geometrychange", callback);
16741
+ let height = getVirtualKeyboardOverlayHeight();
16742
+ const onGeometryChange = (event) => {
16743
+ const newHeight = getVirtualKeyboardOverlayHeight();
16744
+ if (newHeight === height) {
16745
+ return;
16746
+ }
16747
+ height = newHeight;
16748
+ callback(event);
16749
+ };
16750
+ virtualKeyboard.addEventListener("geometrychange", onGeometryChange);
16729
16751
  return () => {
16730
- virtualKeyboard.removeEventListener("geometrychange", callback);
16752
+ virtualKeyboard.removeEventListener("geometrychange", onGeometryChange);
16731
16753
  };
16732
16754
  };
16733
16755
 
@@ -16835,7 +16857,7 @@ window.addEventListener("resize", (event) => {
16835
16857
  * and only on browsers with no visualViewport at all.
16836
16858
  *
16837
16859
  * The keyboard is then subtracted rather than assumed to have already shrunk
16838
- * the viewport: with `overlaysContent` (virtual_keyboard.js, navi turns it on)
16860
+ * the viewport: with `overlaysContent` (virtual_keyboard.js, an app turns it on)
16839
16861
  * the viewport stays full height and the keyboard is painted over its bottom.
16840
16862
  * Zero everywhere else, the browser having done the subtraction itself.
16841
16863
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jsenv/dom",
3
- "version": "0.17.77",
3
+ "version": "0.17.79",
4
4
  "type": "module",
5
5
  "description": "DOM utilities for writing frontend code",
6
6
  "repository": {