Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

iOS 16.4 (and up) webview can not debug in Safari web inspector #1005

Closed
3 tasks done
martijnvegmond-cw opened this issue Jun 5, 2023 · 6 comments · Fixed by #1015
Closed
3 tasks done

iOS 16.4 (and up) webview can not debug in Safari web inspector #1005

martijnvegmond-cw opened this issue Jun 5, 2023 · 6 comments · Fixed by #1015

Comments

@martijnvegmond-cw
Copy link

martijnvegmond-cw commented Jun 5, 2023

Bug Report

iOS 16.4 (and up) webview can not debug in Safari web inspector

Problem

No Web inspection possible for the InAppBrowser window, due to changes in iOS 16.4

What is expected to happen?

Open a InAppBrowser window and inspects it's content to fix, for example, design issues.

What does actually happen?

InAppBrowser window of our app is not in the list of webpages in Safari: Develop > Device > App

Information

Enabling the Inspection of Web Content in Apps

Environment, Platform, Device

iOS 16.4 and higher
iPhone and iPad

Version information

Cordova plugin in app browser v5.0.0
Capacitor v4.8.0

Checklist

  • I searched for existing GitHub issues
  • I updated all Cordova tooling to most recent version
  • I included all the necessary information above
@peterknezek
Copy link

Hi, I can confirm that in iOS 16.4 and later versions, it prevents InAppBrowser from being inspected in Safari's web inspector by default.

There is an open PR (#995) addressing the problem. As a workaround until the library is fixed, you can add Swift code to src/ios/CDVWKInAppBrowser.m to enable web inspection.

@dylanfpaul

This comment was marked as abuse.

@breautek
Copy link
Contributor

breautek commented Jul 8, 2024

Assuming you're running cordova-ios 6.3 or later with inappbrowser v6 or later, you need to set the InspectableWebview preference.

The preference is documented at https://cordova.apache.org/docs/en/12.x/config_ref/index.html

Default: depends on Debug/Release build
On iOS 16.4 or later, enables or disables the webview inspector. Defaults to true on debug builds and false on release builds. This preference is ignored on iOS 16.3 and earlier; the inspector is always enabled on debug builds and always disabled on release builds.

The default behaviour matches the "old" behaviour, which enables the web inspector while in debug mode, but have it disabled in release mode. If you're running an older version of cordova-ios and in-app-browser plugin, this default won't apply on iOS 16.4+ devices, making a platform and plugin upgrade necessary.

and then putting the resulting build onto testflight with XCode.

I'm fairly certain that archives for upload must be in release mode. Debug mode includes both arm64 and x86_64 architectures, and it's forbidden to upload x86_64 architectures to the iOS app store.

@dylanfpaul
Copy link

@breautek , there is an option to set the archive "scheme" to archive a debug build in Xcode. If I put this "debug" mode archive into TestFlight I am guessing I will be able to install that build onto my device, and finally inspect it. Fingers crossed.

@breautek
Copy link
Contributor

breautek commented Jul 8, 2024

With the current version of cordova-ios and the in-app-browser plugin, AND iOS 16.4 or later, you can debug the webview on both the main cordova webview, and the in-app browser webview by setting the InspectableWebview preference to true. It will be enabled including on release builds if you explicitly set it to true.

You can do this by adding this in your config.xml:

<widget ...>
...
<preference name="InspectableWebview" value="true" />

This does mean that anyone who runs your app will be able to connect to the safari web inspector and run arbitrary code against your app, etc. So it may be an option you want to disable for actual production releases.

On iOS 16.3 and earlier the ability to control the inspector did not exist and it was only available in debug builds. So for the above to work, you need to be on iOS 16.4 or later.

@breautek , there is an option to set the archive "scheme" to archive a debug build in Xcode. If I put this "debug" mode archive into TestFlight I am guessing I will be able to install that build onto my device, and finally inspect it. Fingers crossed.

Testflight runs through the app store, without actually publishing to the app store. So by uploading to testflight, you're actually just uploading to the app store (without publishing that binary to your consumers). Because of that the same app-store checks on binary uploads are done. Debug builds includes both the iphone sdk build the iphonesimulator builds and the upload checks I'm fairly certain will reject binaries in which includes the iphonesimulator packed.

The debug binaries includes the iphonesimulator sdk build which is why I don't think uploading a Debug binary will work. At the very least you'll need to limit the scheme to build only the iphoneos arm64 binaries, which you'll need to configure the xcode settings to do so. But I'm pretty sure Apple will also reject binaries built in Debug mode as well as they do not have the expected optimization levels for release deployments, even if you intend to only publish the binary through your testflight channel. Anyway, like I said above you don't need to do this, just set the InspectableWebview to true and test on a iOS 16.4 or later device.

@dylanfpaul
Copy link

@breautek , thank you so much I really appreciate your reply! I am going to attempt setting the preference in my config I think that is the approach I need to take.

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 a pull request may close this issue.

4 participants