Skip to content

fix(ios): apply background color behind status bar - #8609

Open
skyfallsin wants to merge 1 commit into
ionic-team:mainfrom
skyfallsin:fix/ios-status-bar-background
Open

skyfallsin wants to merge 1 commit into
ionic-team:mainfrom
skyfallsin:fix/ios-status-bar-background

Conversation

@skyfallsin

@skyfallsin skyfallsin commented Sep 17, 2026

Copy link
Copy Markdown

Summary

ios.backgroundColor was applied to Capacitor's WKWebView, but not to the visible top safe area behind iOS's transparent status bar. Apps could configure a native background color and still see the system fallback color above their content.

This adds a non-interactive native view between the WebView's top edge and its top safe-area anchor. It uses the configured ios.backgroundColor, falling back to systemBackground when no color is configured.

Visual verification

A real Capacitor app in the iOS Simulator was configured with:

ios: {
  backgroundColor: '#ff0000',
}
Released framework This change
The top safe area stayed at the system fallback: rgb(246,247,250) The top safe area used the configured color: rgb(255,0,0)

Screenshots are available in the internal verification record; they can be attached here if needed.

Testing

  • Added testConfiguredBackgroundCoversStatusBarSafeArea, which verifies that Capacitor installs the configured, non-interactive native status-area view inside the WebView.
  • Passed CapacitorTests/testConfiguredBackgroundCoversStatusBarSafeArea on an iOS Simulator: 1 test, 0 failures.
  • Built the Capacitor iOS framework successfully.
  • Verified the result in an iOS Simulator using a real Capacitor app and the patched framework.
  • git diff --check passes.

Related issues

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.

1 participant