Skip to content

fix(ios): Adjust WebView sizing during keyboard size changes - #49

Open
GabrielNSD wants to merge 1 commit into
ionic-team:mainfrom
cantoo-scribe:fix-resize-ios
Open

fix(ios): Adjust WebView sizing during keyboard size changes#49
GabrielNSD wants to merge 1 commit into
ionic-team:mainfrom
cantoo-scribe:fix-resize-ios

Conversation

@GabrielNSD

Copy link
Copy Markdown

Proposition to solve #48

@Sharcoux

Copy link
Copy Markdown

Description

Fixes WebView resize on iPad when the keyboard changes size during a transition (e.g. accessory bar ↔ software keyboard, floating keyboard, Stage Manager layouts).

Changes in Keyboard.m:

  • Listen to UIKeyboardWillChangeFrame / UIKeyboardDidChangeFrame in addition to show/hide notifications
  • Compute keyboard height on iPad using screen position (screenHeight - keyboardTop) instead of the previous stageManagerOffset + WebView coordinate conversion
  • Distinguish full keyboard vs accessory bar using the existing shouldIgnoreResizeForHeight ratio (< 20% of screen height)
  • Debounce accessory bar events for 0.5s after full keyboard dismissal to ignore phantom accessory bars reported by iOS
  • Extract shared helpers (keyboardHeightFromFrame:, normalizedKeyboardHeightFromFrame:) to avoid duplicated iPad height logic
  • Limit WillChangeFrame handling to iPad only to avoid conflicting with iPhone show/hide events
  • Emit new JS events: keyboardWillChangeFrame / keyboardDidChangeFrame

Change Type

  • Fix
  • Feature
  • Refactor
  • Breaking Change
  • Documentation
  • Other (CI, chores, etc.)

Rationale / Problems Fixed

On iPad, keyboardWillShow / keyboardDidShow alone are not fired when the keyboard changes size without a full show/hide cycle — for example when switching between the accessory bar and the full software keyboard, or when using Stage Manager with an external keyboard.

The WebView therefore keeps its previous height during these transitions, leaving incorrect layout until the keyboard is fully dismissed and reopened.

This addresses the scenario described in #48. It complements upstream #52 (QuickType / Magic Keyboard black bar), which solves a different iPad keyboard issue with different heuristics — the two fixes are not interchangeable.

Related: #48, original proposal in #49

Tests or Reproductions

Tested on iPad:

  1. Connect an external keyboard, focus an input → accessory bar appears; WebView resizes correctly
  2. Tap the keyboard icon to switch to the software keyboard → WebView resizes during the transition (not only after completion)
  3. Switch back to accessory bar → WebView resizes accordingly
  4. Dismiss keyboard completely → no phantom blank space from a ghost accessory bar (~98px)
  5. Repeat in Stage Manager with a non-fullscreen window → height computed from screen position, not WebView-relative offset
  6. Verify iPhone behavior is unchanged (no double resize from WillChangeFrame)

Screenshots / Media

N/A — layout issue best observed interactively on iPad device/simulator.

Platforms Affected

  • Android
  • iOS
  • Web

Notes / Comments

  • Builds on top of upstream 8.0.5, including shouldIgnoreResizeForHeight from fix(ios): prevent black QuickType bar when using Magic Keyboard on iPad + Fix Keyboard on iOS 26 #52 — reuses the ratio-based threshold instead of a hardcoded 200px value
  • Removes the now-unused stageManagerOffset variable; replaced by position-based calculation
  • The new keyboardWillChangeFrame / keyboardDidChangeFrame events are not yet added to definitions.ts — the primary benefit is native WebView resize; JS listeners are optional
  • WillChangeFrame intentionally skips small (accessory bar) frames during transitions and relies on DidShow for stable final values

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants