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

General Documentation

Posts under General subtopic

Post

Replies

Boosts

Views

Created

iOS
Hi i Need help, my phone keeps getting all these updates and rapid security features on it at first I thought it was just the normal updates but i started to pay more attention and it's not. i have the beta updates on my phone iPad and Apple Watch but when I go in to see if it in my updates like apple said to do it wasn't in there. Also all my apps are developer apps I'm not able to get normal ones and if I can the next time I go on it it's not how it was. I really don't know what to do, I've gotten 2 new phones because I thought it was just bad software but I researched a lot and I think someone it hacking me. everytime I look something up on safari it takes me to a whole other website or its completly altered and doesnt look like it usually does. Someone please help me lmao I actually think I'm going to lose my mind.
Topic: Safari & Web SubTopic: General
1
0
323
Mar ’25
Redirecting to an app's universal link from and app extension popup
I have a simple Safari extension for iOS. In its popup, I want a button that will open the app via a universal link. I have this kind-of working, except that Safari opens the actual online destination of the link with a banner at the top saying "Open in the XXXX app" and an OPEN button. What do I have to do to go directly to the app? More generally, I know that if I copy-and-paste a universal link into the Safari address bar, Safari does the same thing - but it does go directly to the app from an <a href="...."> link. In my app extension JavaScript, I set window.location. Presumably this is too similar to pasting into the address bar. Is there some alternative to setting window.location that is more like clicking on a link and will go directly to the universal link's app? Thanks.
5
0
1.3k
Mar ’25
Safari Web Extension - storage.session not available on iPad v16.3
I'm creating a Safari Web Extension, which successfully uses storage.local and storage.session on MacOS (14.x/15.x) and iOS (15.x,18.x). However, when testing on an iPad running iPadOS 16.3, it fails with an undefined error: TypeError: undefined is not an object (evaluating 'api.storage.session.get') Dropping to the console, I can access 'api.storage.local', but no luck for 'api.storage.session'. First question, why would storage.session not be available? Is there something different on this iPadOS version to enable it? I could just use local storage, but don't need the data to persist. I'll probably just fall back to this solution. Second question, should I instead be using localStorage and sessionStorage? I can't find any helpful direction on if using localStorage vs storage.local is best practice?
1
0
373
Mar ’25
PointerEvents on Safari on iPad with Apple Pencil Pro
Hi, I would like to share a finding and ask for a solution, if possible. This may be a potential bug with PointerMoveEvent on Safari on an iPad with Pencil Pro. I tested onPointerMove and onTouchMove in a <canvas> element in a React web app for freehand drawing using Mouse on a PC. Finger touch on iPad Apple pencil pro on iPad Finger touch on iPhone I was able to draw smooth curves in all cases except when using onPointerMove with Apple pencil pro on iPad. The curve drawn in this case looked like it was created using several straight-line segments. It seems like the sampling rate for PointerMoveEvent is lower than that of TouchMoveEvent on Safari I am not sure how to solve this problem or if it is an issue with Safari's interpretation of PointerEvents. Any input is greatly appreciated. Edit: It seems like https://developer.apple.com/forums/thread/689375 is related.
0
0
313
Mar ’25
Push subscribe error User denied push permission
Hi, I am developing the Click & Read web add-on for Chromium, Firefox and Safari. We use xcrun safari-web-extension-converter tool to generate the Safari add-on, with up-to-date MacBook MacOS, Xcode et Safari : Sequoia 15.3.2, Safari Version 18.3.1 (20620.2.4.11.6), XCode Version 16.0 (16A242d). We have updated our addon to Manifest v3, having the Background script as Server Worker "background": { "service_worker": "background.js", "type": "module" } self.addEventListener("activate", (event) => { console.info("Service Worker activated", event); event.waitUntil( self.registration.pushManager .subscribe({ userVisibleOnly: true, applicationServerKey: urlBase64ToUint8Array( process.env.VAPID_PUBLIC_KEY ), }) .then(async (subscription) => { console.info("[Service Worker] Extension is subscribed to push"); const { subscription: savedSubscription } = await getLocalStorageKeyData("subscription"); if (savedSubscription) fetchApi({ url: `${API_SERVER_URL}/subscription/remove/${savedSubscription.keys.auth}`, }); // Remove previous subscription from server on addon activate currentBrowser.storage.local.set({ subscription: subscription.toJSON(), }); // Save subscription in local storage currentBrowser.runtime.setUninstallURL( `${API_SERVER_URL}/subscription/remove/${ subscription.toJSON().keys.auth }` ); // Set uninstall URL to remove notification subscription on addon uninstall fetchApi({ url: `${API_SERVER_URL}/subscription`, reqInit: { body: JSON.stringify(subscription.toJSON()), method: "POST", headers: { "Content-Type": "application/json", }, }, }); }) .catch((error) => { console.error("Push subscribe error: ", error); }) // Subscribe to push notifications ); }); When trying to subscribe the addon instance to our Push server, we get this error : Push subscribe error: NotAllowedError: User denied push permission Our NodeJS backend is using the web-push librabry : https://github.com/web-push-libs/web-push) to save subscriptions and make notifications push. By looking for same errors on forums, the best hint I found is that it could be related to the testing is done on localhost (addon is built from XCode onto Safari, and Push server is running on localhost). Thanks for your help !
1
0
388
Mar ’25
fetch() in safari extension does not include credentials (cookie) when using from non-default profile
It seems fetch() does not include credentials (cookie) even when credentials: include is used and Safari extension has host_permissions for that domain when using from a non-default Safari profile. It includes credentials (cookie) when using from the default profile (which has the default name Personal). Is there anyone who has this problem? I try to request in popup.js like this: const response = await fetch( url, { method: 'GET', mode: 'cors', credentials: 'include', referrerPolicy: 'no-referrer', } ); and it does not include the credentials (cookie) from host_permissions. I already posted https://developer.apple.com/forums/thread/764279, and opened feedback assistant (FB15307169). But it is still not fixed yet. (macOS 15.4 beta 3) I hope this is fixed soon.
0
1
375
Mar ’25
Safari extension without native code
I have a simple Safari extension which contains only Javascript and no native code. Currently I have the placeholder SafariWebExtensionHandler.swift that Xcode created when I added the extension. It's not doing anything useful, but simply deleting it doesn't seem to work. Can I have an extension that includes no native code?
2
0
427
Mar ’25
iOS Mobile Video Audio Playback Issues in React
I'm experiencing issues with audio playback in my React video player component specifically on iOS mobile devices (iPhone/iPad). Even after implementing several recommended solutions, including Apple's own guidelines, the audio still isn't working properly on iOS Safari. It works completely fine on Android. On iOS, I ensured the video doesn't autoplay (it requires user interaction). Here are all the details: Environment iOS Safari (latest version) React 18 TypeScript Video files: MP4 with AAC audio codec Current Implementation const VideoPlayer: React.FC<VideoPlayerProps> = ({ src, autoplay = true, }) => { const videoRef = useRef<HTMLVideoElement>(null); const isIOSDevice = isIOS(); // Custom iOS detection const [touchStartY, setTouchStartY] = useState<number | null>(null); const [touchStartTime, setTouchStartTime] = useState<number | null>(null); // Handle touch start event for gesture detection const handleTouchStart = (e: React.TouchEvent) => { setTouchStartY(e.touches[0].clientY); setTouchStartTime(Date.now()); }; // Handle touch end event with gesture validation const handleTouchEnd = (e: React.TouchEvent) => { if (touchStartY === null || touchStartTime === null) return; const touchEndY = e.changedTouches[0].clientY; const touchEndTime = Date.now(); // Validate if it's a legitimate tap (not a scroll) const verticalDistance = Math.abs(touchEndY - touchStartY); const touchDuration = touchEndTime - touchStartTime; // Only trigger for quick taps (< 200ms) with minimal vertical movement if (touchDuration < 200 && verticalDistance < 10) { handleVideoInteraction(e); } setTouchStartY(null); setTouchStartTime(null); }; // Simplified video interaction handler following Apple's guidelines const handleVideoInteraction = (e: React.MouseEvent | React.TouchEvent) => { console.log('Video interaction detected:', { type: e.type, timestamp: new Date().toISOString() }); // Ensure keyboard is dismissed (iOS requirement) if (document.activeElement instanceof HTMLElement) { document.activeElement.blur(); } e.stopPropagation(); const video = videoRef.current; if (!video || !video.paused) return; // Attempt playback in response to user gesture video.play().catch(err => console.error('Error playing video:', err)); }; // Effect to handle video source and initial state useEffect(() => { console.log('VideoPlayer props:', { src, loadingState }); setError(null); setLoadingState('initial'); setShowPlayButton(false); // Never show custom play button on iOS if (videoRef.current) { // Set crossOrigin attribute for CORS videoRef.current.crossOrigin = "anonymous"; if (autoplay && !hasPlayed && !isIOSDevice) { // Only autoplay on non-iOS devices dismissKeyboard(); setHasPlayed(true); } } }, [src, autoplay, hasPlayed, isIOSDevice]); return ( <Paper shadow="sm" radius="md" withBorder onClick={handleVideoInteraction} onTouchStart={handleTouchStart} onTouchEnd={handleTouchEnd} > <video ref={videoRef} autoPlay={!isIOSDevice && autoplay} playsInline controls crossOrigin="anonymous" preload="auto" onLoadedData={handleLoadedData} onLoadedMetadata={handleMetadataLoaded} onEnded={handleVideoEnd} onError={handleError} onPlay={dismissKeyboard} onClick={handleVideoInteraction} onTouchStart={handleTouchStart} onTouchEnd={handleTouchEnd} {...(!isFirefoxBrowser && { "x-webkit-airplay": "allow", "x-webkit-playsinline": true, "webkit-playsinline": true })} > <source src={videoSrc} type="video/mp4" /> </video> </Paper> ); }; Apple's Guidelines Implementation Removed custom play controls on iOS Using native video controls for user interaction Ensuring audio playback is triggered by user gesture Following Apple's audio session guidelines Properly handling the canplaythrough event Current Behavior Video plays but without sound on iOS mobile Mute/unmute button in native video controls doesn't work Audio works fine on desktop browsers and Android devices Videos are confirmed to have AAC audio codec No console errors related to audio playback User interaction doesn't trigger audio as expected Questions Are there any additional iOS-specific requirements I'm missing? Could this be related to iOS audio session handling? Are there known issues with React's handling of video elements on iOS? Should I be implementing additional audio context initialization? Any insights or suggestions would be greatly appreciated!
0
0
507
Mar ’25
Safari Web Extension: This extension can read ... including passwords...
I want to migrate from a Safari App Extension to a Safari Web Extension, but don't know how to get rid of the message, telling users that my extension can access their passwords. Here is a message which I see: I was thinking that this might be because all Safari Web Extension get this type of access, but I have a Safari Web Extension which does not require such level of access: Here is the manifest: { "manifest_version": 2, "default_locale": "en", "name": "__MSG_extension_name__", "description": "__MSG_extension_description__", "version": "1.1", "icons": { "48": "images/icon-48.png" }, "background": { "scripts": [ "background.js" ], "persistent": true }, "browser_action": { "default_popup": "popup.html", "default_icon": { "16": "images/toolbar-icon-16.png" } }, "permissions": [ "nativeMessaging", "tabs" ] } and here is the Info.plist file: Here is the entire code of the extension: https://github.com/kopyl/web-extension-simplified
3
0
534
Mar ’25
Safari extension doesn't load
I don't know why but all of a sudden when I build the extension it just doesn't load in Safari. The build executes fine but the extension doesn't load. Sometimes, through trying different combinations of clearing the build folder, building, archiving, ... it suddenly loads. And the next time I build again it doesn't load properly. So I can't do any work on it or test anything. I don't know why all of a sudden I am getting this behavior. It looks like engineers at Apple are constantly trying to overcomplicate a process that is at least ten times simpler in any other browser. This is ridiculous. Is this what our annual fee goes to? And they don't even provide any support for that. Several times I've tried to get some help here just to have to spend hours upon hours to figure it out by myself. I'm so tired of this.
6
1
294
Mar ’25
com.apple.developer.web-browser
When I open com. apple. developer. web browser, I am unable to inject JavaScript into the webview through methods such as addUserScript. The console will prompt 'ignoring user script injection for non app bound domain'
Topic: Safari & Web SubTopic: General Tags:
0
1
222
Mar ’25
Mailto href is not working in iOS 18.3.2
Hi Team, I'm using the simple mailto functionality in the demo page and when I tested the same via Safari mailto functionality is not working. However, the same feature is working as expected via Chrome. Demo: https://jsfiddle.net/xut0ed4y/ Kindly help.me to resolve this issue.
Topic: Safari & Web SubTopic: General Tags:
0
0
284
Mar ’25
Declarative Web Push
Anybody succeeded sending a Web Push Message using the new Declarative approach introduced with Safari Version 18.4 (20621.1.14.11.3)? I will help as well if someone can point me to a solution debugging the entire system using Xcode and Minibrowser? Currently I can't get the MiniBrowser connected to the WebPush Daemon.
0
0
240
Mar ’25
Bug {year}} in New Apple Pay SDK Third-browsers (iOS 18)
Hello! While working with the new Apple Pay SDK for iOS 18, I encountered a bug. When using the Ukrainian language, in the modal displaying the QR code, I noticed that there is a missing bracket for the year variable. This causes incorrect data to be displayed in the QR code. This seems to be a localization issue specifically with the Ukrainian language in the new SDK, as the bug does not occur with other languages like English. Has anyone else experienced this? Any advice or information on this bug would be appreciated. Thanks!
1
0
218
Mar ’25
Custom WkWebsiteDatastore
Hey team, I've integrated custom WkWebsiteDatastore to manage profiling for different sessions. upon testing the WkWebsiteDataStore as its mentioned to be persistent But The storage can be accessed via identifier, But the session data in storage is absent, such as cookies caches all are cleared when app is relaunched is it the default behavior to be expected or there is some property missing causing the session data to be removed from storage.
Topic: Safari & Web SubTopic: General Tags:
0
0
77
Mar ’25
Safari doesn't seem to respect cache-control on fetch redirects
I am calling fetch with a POST on page1 in Safari. No special cache parameters on the fetch call. The response from the server is a 303 redirect to page2 The second page -- page2 -- is in my browser's cache with cache-control "public, max-age=31536000, immutable". For some reason, the page2 redirect is causing a server hit to re-GET the second page every time instead of pulling from cache. If I instead directly get the second page by doing a fetch on page2, there is no server hit. If I do this on Chrome or Firefox, it behaves as I would expect, pulling page2 from the cache with no server hit. In case it matters, the fetch is coming from within an iFrame. Also, if I change the original POST to a GET, the problem still happens. I am using a pretty old version of Safari on my Mac, so I could chalk it up to that, but I am getting the same behavior with Safari on my iPhone with iOS 18.3.2 Any ideas? Thanks.
Topic: Safari & Web SubTopic: General Tags:
0
0
74
Mar ’25