I am developing a new app using ionic with angular.
I realized that on devices with IOS 12, a component is not looking good, i want to inspect the html to see if the component now looks good.
I installed Safari technology preview for the testing, ran an iphone with ios 12, but safari does not recognize the simulated device. i tried restarting the computer, opening and closing the browser several times, changing the ios version but this hasn't worked yet.
I am using :
Xcode 12.5
Mac OS big sur 11.3.1
Safari technology preview :Release 124 (Safari 14.2, WebKit 16612.1.11.10)
Safari : Versión 14.1 (16611.1.21.161.6)
I saw this issue was happening like 4 years ago, and it was fixed buy restarting the computer, but this didn't work for me?
does somenone know how to fix this?
I have installed Safari Technology Preview and now it's working perfectly.
I am able to inspect normally a review with it.
Hope it helps you too
I am facing issue with the Ionic PWA application for click issue on Safari for below UI components.
ion-radio
ion-select
ion-menu
you can see attached screenshot when you click on radio button component “https://ionicframework.com/docs/api/radio 1” it is actually asking to reload the page.
Here are the version details:
MacOs: Catalina 10.15.7 (19H2)
Safari: Version 14.0 (15610.1.28.1.9, 15610)
Angular: 9.1.6
Ionic : 5.0.0
Any support will be appreciated. Thanks in advance.
It's a bug with latest Safari and ionic 5.
Short explanation & workaround:
The problem is with ion-item, just add <div tabindex="0"></div> inside ion-item and it will fix the issue.
Long Explanation (Copied from the github issue below):
GitHub Issue: https://github.com/ionic-team/ionic-framework/issues/21939#issuecomment-694259307
What happened?
There was a regression in Safari/iOS betas where web components with delegatesFocus: true caused the browser to crash if there were no focusable child elements. The underlying issue was that WebKit was not checking if the focusable element existed prior to forwarding focus. This affects the ion-item component as delegatesFocus: true is used.
The issue was resolved and code to fix the issue was merged; however, the fix has not shipped in Safari for macOS. As a result, this issue will still appear when Safari 14 for macOS is released. This fix has shipped in iOS 14, so devices running that version of iOS are not affected.
When will the fix be released?
The Ionic Framework team has verified that the issue is resolved in the latest Safari Technology Preview, indicating that this fix should ship in an upcoming update to Safari (i.e. Safari 14.0.1 or whatever the version ends up being). We will follow up on this thread when the fix has been released.
I have a Xamarin.iOS app developed on Visual Studio 2019 and paired to a Mac. The app was displaying correctly on both iPhones and iPads until I updated Xcode on the Mac to version 11. Since then Apple is rejecting my app because is displaying a white blank screen on iPads (see image below!).
I have validated the issue on Xcode Simulator and on a physical iPad. Does anyone have an idea of why this is happening?
I had exactly the same problem as you, and even though it could be you already got a solution i will share how i got it working at the end... for those who could still have that same problem.
Note: in my case the issue appeared only on Apps built with XCode 11 that use MasterDetailPage on Xamarin.Forms version < 4.0 and running on iPad: the easiest solution to this issue is simply updating Xamarin.Forms to the latest version (or simply downgrading XCode to a previous version!), but if you (as i was) are not able to update Xamarin.Forms, then keep reading.
As mentioned in this thread from the Xamarin Forums all you have to do is copy the latest MasterDetailPage renderer from the Xamarin.Forms source and do a few changes.
Since the final script is too long to be added here as text (it exceeds the maximal number of allowed lines), and since i could not find a way to upload a text file, i would point to the thread in Xamarin Forums where i added that script with all the changes needed:
TabletMasterDetailRenderer
Note: Do not forget to change {YourNamespace} for your correct namespace!
This is fixed in at least Xamarin Forms 3.6.0.709228.
I have been searching/reading over the steps to set up the web inspector from an ipad on the mac. It all seems straight forward and it always shows the ipad connected in the develop drop down (in safari on the mac). But it never allows anything to be selected from my ipad (“No Inspectable Applications”), no matter what site I have pulled up in safari on my ipad.
I have a second gen Ipad 32 Gig
IOS version 8.0.2 (I started with 7.0.1 then upgraded to 7.0.2 then 8)
I am using a Mac Book Pro
IOS 10.9.5
Safari
Version 7.0.6
Initially it was not syncing with my itunes when connected to the Mac, but I was still seeing the ipad connected (I just couldn't selected anything from the develop drop down “No Inspectable Applications”). I updated to the newer version on the ipad, and now I see my name attached to the ipad in the safari drop down on my mac. But it still does not allow me to actually select any applications regardless of what site I have loaded up in safari on my ipad.
I have tried restarted/updating both my mac and the ipad, I have started and stopped safari on the mac after connecting to the ipad... Still nothing. I am not really sure what I am doing wrong or if this is just a bug?
This seems like the same issue posted 3 days ago
*** UPDATED TO:
My version numbers that worked were:
Mac Book Pro IOS: 10.9.5,
Safari Version: 7.1,
iPad IOS: 8.0.2,
Xcode: 6.0.1
I believe you need to install Xcode on the Mac, and also use Xcode (in the organizer) to set the iPad to be "use for Development." Also make sure your Safari version is up to date, as well. Apparently, all versions need to be updated for success.
Interesting to read a lot of answers but no one that just said to you Update your Safari.
Yeah, you don't need XCode to be installed, just Safari 7.1. And it's a simple update that you can do from the Mac App Store.
I need to debug an HTML app on ipad. I used to be able to connect ipad by USB cable to my mac and it would show in the "Develop" menu in Safari. I have two ipads now - one with iOS 6 and another with iOS 7. The iOS 6 one is showing correctly and I can access the web inspector from my mac. iOS 7 ipad is not showing in the "Develop" menu.
I have the latest version of iOS installed (version 7.1) and the latest version of Safari (7.0.2) on Maverick.
Any suggestions are welcome.
Enable web inspector on your iOS device by following these steps:
iOS Device > Settings app > Safari > Advanced > Web Inspector
This setting allows you to connect to safari on your desktop.
I know this is a little late. I had this same issue and figured I would post how I got it to work in my case just in case it helps anyone in the future. I enabled it on the iPad and it didn't show. I tried closing Safari on the iPad, disconnecting and reconnecting the cable and neither worked. It ended up for me being really simple, I just quit of Safari on my laptop and restarted it and Safari then recognized the iPad and allowed me to debug. This may not work for every case but it did for me, hope it helps.
edit: just a note, I had the iPad plugged in with web inspector enabled when I restarted Safari.
In my case I was running iOS 11 BETA on the iPhone, and was trying to access from Safari 10 (current stable version). I have installed Safari 11 BETA, and now it is working as expected.
So in general: Make sure you are running the latest version of Safari. And if you are testing on iOS BETAs, you can download Safari Betas & Safari Technology previews from here (Thank you for the link #Jacob Ford).
You also need to enable web inspector from the device.
Open the settings app, select safari, select advance and then turn on web inspector.
ref:
http://www.spiraltrack.com/blog/how-debug-iphone-and-ipad-web-applications-using-safari.
Using a genuine Apple lightning cable (instead of a fake one) solved my problem.
After all these years, I finally found out what the problem was! Apparently, Safari version on the Mac needs to be the same or newer than the version on the iPad. If iPad has a newer version than Mac, then it won't be visible. If Mac has the same or newer version, then iPad is visible and can be debugged.
I wish Apple had documented this anywhere - would have saved loads of time for a lot of people.
One more tip to try - after trying many of the above suggestions I turned off "Sync with this iPhone over Wi-Fi" in iTunes.
Voila! Got my iPhone into the Develop menu!
(for context, this is in Mojave 10.14.6, iOS 13.1.3, Safari 13.0.3)
I just had to toggle the web inspector on and off on the device I was trying to connect and it showed up under Safari's develop menu:
iOS Device > Settings app > Safari > Advanced > Web Inspector
If you already have enabled web inspector on your iOS device by following these steps and still it is not showing you can try just disabling and then again enable web Inspector in device's Safari browser.
iOS Device > Settings app > Safari > Advanced > Web Inspector
Had the same issue after updating to Safari 13 and Xcode 11.3 on macOS Catalina. For me the following change brought the iOS device back to Safari's Develop menu:
Connect the device via USB
Start Xcode and go to menu "Window > Devices and Simulators"
Select the device
Check the "Connect via network" option
I've tried all the above but the only thing that works for me is to put iphone/ipad in airplane mode and then unplug/plug in the lighting cable a few times while keeping the develop menu open, once it shows up you can then turn off airplane mode
Another gotcha for the basket: If you've another OS running in a virtual machine that you've forgotten about then the iPad can end up connected to that and hence invisible to Safari on the Mac.
Additional go to:
Device Settings -> Safari -> Private Browsing = OFF
For me, the problem was the different OS versions between the iPad and the iMac. I updated the iPad with the latest OS (iOS 11.2.2 at the time of this writing), but the iMac was under El Capitan (10.11.6) macOS. Once I updated the iMac to High Sierra (10.13.2) everything worked correctly.
I've found that Simulator is always in Safari's Develop menu if it's already running when Safari launches, and Simulator is never in the menu if Safari is launched first.
So you need to restart your Safari again.
That's Simulator 11.2 (comes with Xcode 9.1), Safari 11.0.3 and macOS 10.13.3
Similar to what BernieSF said, with a little more detail from my specific scenario. I was getting ready to upgrade my laptop to High Sierra to try and solve this, but I'm glad I didn't have to.
I have been trying to solve this for some time now, so maybe my situation will apply to someone else. The problem was the version of Safari I had installed on my older Macbook Air.
Symptoms: All the appropriate settings were enabled, and when I plugged in my phone to the USB cable, it would show up in the Develop tab, and then quickly disappear.
Setup: iPhone 7 on 11.3.1 and Macbook Air(3,2) on 10.12. On the Air, Safari was version 10.1.
I read in an Apple thread that for iOS 11, I needed to have Safari 11, but I had no option to update Safari in the App Store. There was a system update available, and the update to 10.13 available, but not Safari.
Solution:
I did the system updates (not the update to 10.13)
After my computer rebooted, the App Store then offered me an update to Safari 11.1.1 and I installed that
Voila! It now works!
I had this issue with iOS 13.2.3 on both macOS Mojave and Catalina.
When I disconnected the iPhone from the Wi-Fi and only connected it via the cable the dropdown in Safari showed the iPhone.
The solution for me was:
In iTunes click the sync-settings button and enabling and then disabling the "Sync with this iPhone over Wi-Fi".
After that the iPhone showed up again in Safari's developer menu.
I experienced the same issue today with iOS 13 and Mac OS 10.14 (Mojave).
What fixed it for me was simply installing a required Update in MacOS.
However, it is not an update that is installed via system preferences but only via a dialog that appears when trying to connect the devices.
Unfortunately the dialog appeared behind all other windows and could not be tabbed to. Thus I did not see it at all until I closed all other windows.
Regarding the dialog itself - here some information from Apple support:
https://support.apple.com/en-us/HT208831
In my case, I was using iOS beta version.
Xcode > Window > Devices and Simulators > Connect via network
then I can see error messages.
"The current device configuration is unsupported. This iPhone X (Model A1865, A1901, A1902,…"
"To run on this device, please update to a version of Xcode that supports iOS 13.6. You can download Xcode from the Mac App Store or the Apple Developer website."
Oh yeah.
Another thing to check is Build Settings > Signing > Code Signing Identity
Make sure both Release and Debug are set to iOS Developer