How to listen to "beforeNavigate" event in safari app extensions - safari

I'm developing a safari app extension. I've to listen to "beforeNavigate" event as in old Safari JS Extensions, we could listen to these events using Safari's Windows & Tabs API.
I went through the How to create Safari App Extension, but unfortunately couldn't find anything related to these events there.
Can anybody please help me with similar APIs for Safari App Extensions as we had in old Safari JS Extensions.

Starting Safari 13, Apple added an API for page navigation notifications.
In your SafariExtensionHandler.swift, you can now override func page(_ page: SFSafariPage, willNavigateTo url: URL?).
Source: https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes

Unfortunately, there is not equivalent in Safari App Extension.
The only thing you can do is catching a new tab id displayed through validateToolbarItem.
Or try to add a content or network filter in your App...

Related

Expo AuthSession: WebBrowser.dismissBrowser is not available on android

Having the error running on android:
The method or property WebBrowser.dismissBrowser is not available on
android, are you sure you've linked all the native dependencies
properly?]
- node_modules/#babel/runtime/helpers/construct.js:30:26 in _construct
- node_modules/#babel/runtime/helpers/wrapNativeSuper.js:26:23 in Wrapper
- ... 19 more stack frames from framework internals
I can open a browser. Once inside the browser if I quit the browser and went back to the application, the above message show up.
I tried look at WebBrowser from expo documentation
WebBrowser.openAuthSessionAsync(url, redirectUrl)
Opens the url with Safari in a modal on iOS using SFAuthenticationSession. The user will be asked whether to allow the app to authenticate using the given url. Unavailable on Android.
What does the line mean? does that mean android don't work etc.
The user will be asked whether to allow the app to authenticate using
the given url. Unavailable on Android.

Progressive Web App: Error Accessing navigator.mediaDevices.getUserMedia?

My app accesses the camera for purposes of webrtc, and works correctly.
I'm using pwacompat from Google Labs to add pwa features to my web app.
When running the app as a pwa, everything works fine until I access the camera. Then I get this console.log error:
getUserMedia failedObject {type: "error", msg: "undefined is not an object (evaluating 'navigat…"}
getUserMedia failed type: error msg: undefined is not an object (evaluating 'navigator.mediaDevices.getUserMedia')
What am I missing?
Update - 19/11/2020
WKWebView can use getUserMedia in iOS 14.3 beta 1.
https://bugs.webkit.org/show_bug.cgi?id=208667
https://bugs.chromium.org/p/chromium/issues/detail?id=752458
Update - 14/09/2019
There are changes to Safari on iOS 13 & Safari 13: https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes
SFSafariViewController has gained getUserMedia functionality (!!!, however I need to confirm this, please see below for reports of it working)
https://bugs.webkit.org/show_bug.cgi?id=183201
However WKWebView does not seem to gain getUserMedia functionality:
https://bugs.chromium.org/p/chromium/issues/detail?id=752458
https://bugs.webkit.org/show_bug.cgi?id=185448
iOS 13 and Safari 13 release notes:
https://developer.apple.com/documentation/ios_ipados_release_notes/ios_13_release_notes
https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes
Edit
In short: A PWA or any website being used on iOS outside of the native Safari app will not be allowed access to getUserMedia as Apple is deliberately blocking access for "Security concerns". This includes any websites saved to the homescreen and/or viewed inside another application such as Facebook. The same restrictions apply to Android however on Android the app developer can ask for Camera permissions and get around this. (This means if you are a website developer and you need camera functionality, you will need to ask Facebook, etc, to rebuild their app to allow this on Android).
See their bug tracker here: http://www.openradar.me/33571214 and https://forums.developer.apple.com/thread/88052
From web based Safari experiences to Native Android, etc. I make crossplatform Apps in web and native for a living. There are several potential problems you will encounter with getUserMedia. To workout what is causing potential problems you should follow this list in order to create a successful application.
Your problem is specifically 1. because you are not successfully querying the API. Nevertheless the MediaCapture from getUserMedia should fail because after fixing 1. you will encounter 2. and 3.
API Polyfil - Always make sure you include the latest getUserMedia adapter to stop any cross-platform inconsistencies in the getUserMedia API. Some browsers might use the old getUserMedia API (via 'navigator.getUserMedia) and have not been updated (to use navigator.mediaDevices.getUserMedia). You should also check this link for other needed polyfills.
Support - Check CanIUse for getUserMedia support for your target audience and make sure you have the necessary fallbacks. Your fallback for if (navigator && navigator.mediaDevices && navigator.mediaDevices.getUserMedia) { return true; } else return false; returns false, and if getUserMedia throws and error ideally should be the same.
Permissions - Even though you include pwacompat it does not mean the browser window has the permissions to access the camera. This is because not all browsers are equal! iOS 11 allows getUserMedia access inside of the native Safari app only. However you cannot access getUserMedia on iOS 11 WKWebView or UIWebViews. When you save an app to the homepage it is hosted inside a WKWebView. Thus an experience which works inside of Safari will not work when saved to the homescreen or inside another application. Confusing eh?..! Thus if you want your experience to work you need to tell the user when they open upside another app that they must open the website in safari for real-time camera access. There is no way around this. On Android an app maker can override this permission and allow access to getUserMedia. If you use macOS or Windows you need to make sure the browser shell also has getUserMedia compatibility (e.g. Edge+, Chrome, Firefox, etc)
Security - HTTPS websites can only access the camera (unless on localhost). Check the location prototcol '(location.protocol === 'https:') ? true : false;' to see if you are allowed to get a successful MediaCapture request
The following is a test link I use for platform support:
https://github.com/marcusbelcher/wasm-asm-camera-webgl-test
In my GitHub there are also Android and React-native getUserMedia solutions

Open a Safari browser from Telerik AppBuilder

Telerik AppBuilder is using it's own "webview", but Apple store cannot accepts donations through app unless it's done thought Safari browser... Is there any way to open Safari browser inside App?
Thanks
You should be able to use the InAppBrowser plugin, but use the target of "_system". See the docs for more details: https://github.com/apache/cordova-plugin-inappbrowser/blob/master/doc/index.md
Use the second argument "_system" to open the link in the default browser.
Omit it to open with in the app.
window.open("www.google.com", '_system');

IBM Worklight - How can I display the content a URL refers to, without losing app context?

When writing a Worklight app it is verboten to change the URL of the DOM in which the application is running. This makes sense as a hypertext move to another URL will obliterate the state of the app.
On occasion however, in my app I receive a URL for a news article and the user wishes to read it. Displaying the new content in an iFrame would start to address the requirement, but then I need navigation controls, etc. and it starts to feel like I am reinventing a wheel.
Does Worklight, or one of the mobile JS frameworks provide a "browser in browser" experience that I need here?
Worklight utilizes Cordova. Cordova makes it possible to display just what you wanted, a "browser in a browser" - InAppBrowser.
The InAppBrowser is a web browser view that displays when calling
window.open(), or when opening a link formed as <a target="_blank">.
Try that.
No setup is required as the InAppBrowser plug-in is already part of the Worklight project (this may differ depending on your Worklight version; If you are using 6.x you're OK).
All you need to do is to call up the URL. For example, in yourProject\apps\yourApp\common\main.js:
function wlCommonInit() {
window.open('http://apache.org', '_blank', 'location=yes');
}
Once the app initializes it will open the InAppBrowser:
And once tapping the Done button, you're back in the app.
You can of course not specify the location attribute so the navigation bar won't display. In that case, in order to go back to the app the user will need to tap the Back button:

safari extension: Is there a way to read cookies

I want to port an extension from Chrome to Safari. Chrome extension is using Chrome.cookies api http://code.google.com/chrome/extensions/cookies.html, is there any similar method for safari extension?
Such API is available for plugins only. The only workaround is to inject script then send document.cookie back to background page