Explore the integration of web technologies within your app. Discuss building web-based apps, leveraging Safari functionalities, and integrating with web services.

General Documentation

Post

Replies

Boosts

Views

Activity

Pass parameters in AppStore from webpage
Hello everyone,For my first post, i would like to know if it is possible to pass a specific parameter from a link in an html page to the appstore and retrieve it directly in the app? From my search it's quite complicate and there isn't any easy way to do it. Am I right or it is possible?
2
0
3.1k
Mar ’17
touchstart event does not trigger when stopping inertial scrolling
I've met this problem when scrolling on my iPhone 6 device (iOS version 11.2.6). I've tested it on Safari and Chrome.Given a scrollable div, if i touch it when already on momentum scrolling motion, the scrolling stops as expected but the touchstart event is not triggered. If i touch (scrolling stops) and slide the finger, touchmove events does not trigger also.I need to touch (scrolling stops), raise the finger and then touch again to "reactivate" the touchstart/touchmove events.When tested on Xiaomi Android device (on Chrome), if i touch (scrolling stops) and slide the finger then touchstart/touchmove events are triggered.Is this issue a standard behaviour on iPhone?.I have set up a fiddle to test this behaviour:https://fiddle.jshell.net/galoxia/L63wj9or/Just flick to "activate" momentum scrolling on the blue box and then touch again to stop it. On Android you will see touchstart in the yellow box. On iPhone you will not.
4
2
4.4k
Mar ’18
background-attachment:fixed still not supported?
Every now and then I need to make a website. And I noted in my last project that background-attachment:fixed; is still not supported by iOS. It is by Safari on MacBooks, so I'm wondering what the story behind it is? Surely it is not a matter of computational cost due to the so-called repainting of the browser's canvas? Because doesn't playing video cost a multitude of that?
30
5
30k
Apr ’18
Visa test card is "Not accepted by this website"
I'm trying to test payments with different card types on the website.I've added test cards fromhttps://developer.apple.com/support/apple-pay-sandbox/to my tester account.In my payment request I added supportedNetworks:supportedNetworks: ["amex", "masterCard", "visa", "discover"],Payments work fine with amex, mastercard and discover, but Visa cards are not selectable, with the reason "Not accepted by this website".Are there some other requirements to use visa cards on the website?
4
0
2.4k
Jun ’18
Safari passwords on subdomains
When I login to an account on a subdomain of a main domain, I want to be able to store a separate password for the same login id on the main domain account. This doesn't seem possible in the current Safari implementation.eg: domain.com is the main domain and is the general information site.my.domain.com is the subdomain that hosts the customer support.I want different passwords on each for the same login ID... Can't I do this?--marcel
21
9
8.6k
Feb ’20
height:100% is not 100% after rotating device
I've observed some strange behavior that started around iOS 12.2 and continues through iOS 13.x. If you load even a very simple web page into Safari that contains a div with a 100% height, then the result is correct and you get a full-screen div. If you rotate the device to landscape then it resizes and the div still fills the screen. But when you rotate it back to portrait, an empty white area appears at the bottom of the screen, and there doesn't appear to be a way to make it go away.I suspect this has to do with the change Apple made around the iOS 12.2 timeframe, where when a phone is rotated to portrait, the URL bar shrinks and the navigation bar is hidden. When this happens, the content area is in effect larger than it was before, but it's like CSS doesn't know about it, so a height of 100% represents the height as if the URL bar was larger and the nav bar was present.This HTML is enough to show the issue:<!DOCTYPE html> <html style="margin:0; padding:0; height:100%;"> <head> <title>Test Page!</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body style="margin:0; padding:0; height:100%;"> <div id="Layout1" style="border-width:0px; height:100%; width:100%; background-color:red;">Rotate me</div> </body> </html>Viewing that page on an iPhone with iOS 12.2+ will look fine, so rotate to landscape and then rotate back to portrait. A white area will appear at the bottom. I'm told that on larger-style iPhones, this only occurs if it is the only tab open -- otherwise, iOS never hides the navigation bar. On my 6s, it happens every time.Has anybody seen this before? Any ideas for working around it? It is making all of our web apps "scrunch up" after users rotate their devices, with no obvious way to programmatically fix it!Thanks!
6
0
11k
Feb ’20
camera does not open from iOS PWA
Dear All,I have written a PWA which installs an icon when it loads first.The functionalites include offline storage using indexed db and camera.usage to upload photo.In chrome running in android, everything works fine.However in safari in iOS camera does not open when I lunch the app from the icon loaded into launcher screen.Similarly, it does not throw any meaningful error message either ! we tried to use web inspector to inspect the error , but the page when launched from launcher icon does not show up in web inspector.everything works fine when lunched from browser (online mode) . Please help us resolve this. below is a piece of code which we are using for camera <button className="btn btn_gray my-2" onClick={this.takePhoto.bind(this)} > Take photo{" "} takePhoto() { const { capturedImages, cameraHide, showaddimagesComponentScan } = this.props; let selectedPartNumber = this.props.selectedPartNumber; this.setState({ hidevedio: false }); const config = { sizeFactor: 1 }; let dataUri = this.cameraPhoto.getDataUri(config); this.setState({ dataUri }, () => { let _dataUri = this.state.dataUri; DB.InsertOrUpdate(DbConstant.tblImageTemp, { rowID: this.props.taskID, partNumber: this.props.partNumber, ImageURI: _dataUri }); }); // capturedImages.push({ partNumber: selectedPartNumber, imageURI: dataUri }); this.setState({ // capturedImages, cameraHide: false }); this.cameraPhoto .stopCamera() .then(() => { console.log("Camera stoped!"); }) .catch(error => { console.log("No camera to stop!:", error); }); }
2
0
2.3k
Feb ’20
WKWebView memory budget
What exactly is the memory budget of the WKWebView and is it possible to increase the amount of memory it can consume? I am finding that when I attempt to load a large WebGL scene into the WKWebView I am getting the webViewWebContentProcessDidTerminate callback and unable to load my scene. Is it possible to keep the WebContent process from quitting?
4
0
2.3k
May ’20
Embedded PDFs in mobile safari broken since ios8
hi there, I just tested it on iPadOS 14 - issue remains: Mobile safari started rendering embedded PDFs as images. This is problematic both when viewing and printing: when viewing, only the first page of the PDF is displayed when printing, the picture gets printed, leading to incomplete and blurred printing In both cases the user does not understand the problem is on mobile safari and either does not see/ print the remaining pages or complains about broken PDFs. The only workaround currently known to me is to provide a download-link that will show the PDF as full page (no embedding). This way the PDF is rendered with multiple pages and printed correctly. The problem with this workaround is: if the user places the webapplication on the home screen (so it is opened in fullscreen), downloading the PDF as described in the workaround puts the user in a navigation dead-end, as he will not be able to navigate back. This is an awful situation. The platform is powerful enough to simply embed PDFs in the page. Safari is obviously capable of handling PDFs, as shown with the workaround. Please fix this. Or do not show PDFs embedded at all, at least user will direct its complaints at Apple and not to us web developers.
13
5
8.3k
Jun ’20
DOMContentLoaded not working in Safari App Extension
I am trying to run JavaScript only after the page has loaded, and according to here - https://developer.apple.com/documentation/safariservices/safari_app_extensions/injecting_a_script_into_a_webpage, I should use DOMContentLoaded. However, it does not seem to work. This is my content.js file: function runOnStart() {     document.addEventListener('DOMContentLoaded', function(e) {         document.body.style.background = "rgb(20, 20, 20)";         document.html.style.background = "rgb(20, 20, 20)";                var divElements = document.body.getElementsByTagName('div');         for(var i = 0; i < divElements.length; i++) {             let elem = divElements[i];             elem.style.background = "rgba(255, 255, 255, 0.05)";         }     }); } runOnStart(); If I take the code outside of the event listener, it runs fine, but a lot of the elements haven't loaded in yet so it doesn't work as it should. The function is definitely running, but the event listener simply doesn't work. I appreciate any help you can give!
10
2
7.8k
Jun ’20
Change volume of YouTube video playing in WKWebView
We are creating a watch party app that allows you to video chat with your friends and play a YouTube video at the same time. The video is played using Google's youtube-ios-player-helperlibrary which uses a WKWebView with their iframe API, as that's the only way to play it without violating the Terms of Service. We need the ability to change the volume of the YouTube video separately from the video chat, so you can hear your friends over the video for example. Unfortunately it's not possible to directly change the volume because iOS does not support changing the volume via JavaScript - https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html#//apple_ref/doc/uid/TP40009523-CH5-SW10, unlike macOS. Setting volume doesn't do anything and getting it always returns 1. Users can change the volume with the hardware buttons but this applies to all audio including the video chat, not just the YouTube video. Someone found a workaround - https://stackoverflow.com/a/37315071/1795356 to get the underlying AVPlayer and change its volume natively. This worked with UIWebView but does not work now that it uses WKWebView. What can be done to change the volume of the YouTube video?
1
0
1.6k
Sep ’20
Toolbar Button Icons are Blue
All of my third party extensions have blue icons now, in Safari 14.0. It looks pretty awful. Is there a way to keep the monochrome colors or a way for us, as developers, to provide a different kind of icon to sustain the monochrome colors for our extensions? I am assuming the blue color denotes something, like the extension being "active". I wasn't able to find documentation on this change nor any related api doc.
12
1
4.8k
Sep ’20
Safari extension distributed in a notarized app with Developer ID rejected by the browser
Hi folks, We're building a Safari web extension and experiencing an issue to see it among extensions in Safari after installing the container app to /Applications and launching it. The app and extension is notarized and signed with Developer ID After an extensive investigation, we found the following log records in the Console app (the extension ID is redacted): Computing the code signing dictionary failed for extension with identifier com.youcompany.safariext Blocking extension with identifier: com.youcompany.safariext To debug the issue, we've created a HelloWorld-like extension generated by Xcode 12.2 beta 4 (http s://sharedartifacts.s3.eu-central-1.amazonaws.com/safariext.app.zip contains a signed app bundle) It also is under the same code signing issue. According to https://developer.apple.com/documentation/xcode/notarizing_macos_software_before_distribution/resolving_common_notarization_issues, we've run a few checks to verify: code signature ➜&#9;Desktop codesign -vvv --deep --strict ./safariext.app&#9;&#9;&#9;&#9;&#9; ...-prepared:/Users/nikolay/Desktop/safariext.app/Contents/PlugIns/safariext Extension.appex ...-validated:/Users/nikolay/Desktop/safariext.app/Contents/PlugIns/safariext Extension.appex ... ./safariext.app: valid on disk ./safariext.app: satisfies its Designated Requirement signing certificate ➜&#9;Desktop spctl -vvv --assess --type exec ./safariext.app&#9;&#9; ./safariext.app: accepted source=Notarized Developer ID origin=Developer ID secure timestamp ... Timestamp=25 Nov 2020 at 22:23:54 ... We seemed to have all checks good, the extension can be installed only if Safari is allowed to run unsigned extensions. Could anyone assist to debug/resolve this issue? Thanks
14
1
3.3k
Nov ’20
Constant Failure to install package
Hello, I'm keeping on getting a failure when trying to install an App from Samsung Dex. The report says to "disconnect your phone to install" but NO phone is connected. I tried various command line and numerous troubleshooting to reset and refresh some KEXT but still issue exists. Here is the install.log below. What could be the work around this bug? How to reset and proceed with installation? Thank you p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 16.0px 'Helvetica Neue'; color: #262626; -webkit-text-stroke: #262626; background-color: #ffffff} span.s1 {font-kerning: none} 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: @(#)PROGRAM:Install  PROJECT:Install-1000 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: @(#)PROGRAM:Installer  PROJECT:Installer-1020 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Hardware: iMac18,2 @ 3.00 GHz (x 4), 32768 MB RAM 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Running OS Build: macOS 11.4 (20F71) 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: USER=KP 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: __CFBundleIdentifier=com.apple.installer 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: COMMAND_MODE=unix2003 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: LOGNAME=KP 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: PATH=/usr/bin:/bin:/usr/sbin:/sbin 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: SSH_AUTH_SOCK=/private/tmp/com.apple.launchd.LsIZhGSQv0/Listeners 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: SHELL=/bin/zsh 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: HOME=/Users/KP 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: __CF_USER_TEXT_ENCODING=0x1F5:0x0:0x0 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: TMPDIR=/var/folders/d_/hqzchb455m9ct55v66n3n2_w0000gn/T/ 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: XPC_SERVICE_NAME=application.com.apple.installer.1152921500312163432.1152921500312163437 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Env: XPC_FLAGS=0x0 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Samsung DeX  Installation Log 2021-07-08 19:33:08-04 KPs-iMac Installer[9137]: Opened from: /Volumes/Samsung DeX/Install Samsung DeX.pkg 2021-07-08 19:33:09-04 KPs-iMac Installer[9137]: Package Authoring Error: <background_scaling> has an unsupported MIME type: X-NSObject/NSNumber 2021-07-08 19:33:09-04 KPs-iMac Installer[9137]: Package Authoring Error: <background_alignment> has an unsupported MIME type: X-NSObject/NSNumber 2021-07-08 19:33:09-04 KPs-iMac Installer[9137]: Package Authoring Error: has an unsupported MIME type: X-NSObject/NSNumber 2021-07-08 19:33:09-04 KPs-iMac Installer[9137]: Failed to load specified background image 2021-07-08 19:33:09-04 KPs-iMac Installer[9137]: Product archive /Volumes/Samsung DeX/Install Samsung DeX.pkg trustLevel=350 2021-07-08 19:33:09-04 KPs-iMac Installer[9137]: External component packages (2) trustLevel=350 2021-07-08 19:33:09-04 KPs-iMac Installer[9137]: Could not load resource readme: (null) 2021-07-08 19:33:16-04 KPs-iMac Installer[9137]: Installation checks failed. 2021-07-08 19:33:16-04 KPs-iMac Installer[9137]: Installation check failure.  . Disconnect your phone to install..
1
0
1.1k
Jul ’21