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!
Post not yet marked as solved
I am calling JavaScript function written in local JS file from application’s native iOS code (.m file) as below.
[vc.webViewEngine evaluateJavaScript:javascript completionHandler:^(id result, NSError *error) {
The JavaScript function accepts string as the argument and return string/array in the response.
The function (Function1) invoked successfully and return the value which is received from third party API returned by another function (Function2) call internally in JavaScript file. But when the Function1 function return the value to native code, the “result” , is always coming as “nil” and error object has a value as “Error Domain=WKErrorDomain Code=5 "JavaScript execution returned a result of an unsupported type"
Below are the code snippet for your reference used in the project.
Native code calling JS Function:
[vc.webViewEngine evaluateJavaScript:jsFunc completionHandler:^(id result, NSError *error) {
&#9;&#9;&#9;
&#9;&#9;&#9;&#9;if (error == nil) {&#9;&#9;&#9;&#9;&#9;
&#9;&#9;&#9;&#9;&#9;&#9;if (result != nil) {
&#9;&#9;&#9;&#9;&#9;&#9;&#9;&#9;NSLog(@"Succes");
&#9;&#9;&#9;&#9;&#9;&#9;}
&#9;&#9;&#9;&#9;} else {
&#9;&#9;&#9;&#9;&#9;&#9;NSLog(@"Error==&#9;%@",[error localizedDescription]);
&#9;&#9;&#9;&#9;&#9;&#9;
&#9;&#9;&#9;&#9;&#9;&#9;finished = YES;
&#9;&#9;&#9;&#9;}
Javascript Code:
&#9;&#9;var result = [];
&#9;&#9;
&#9;&#9;try {
&#9;&#9;&#9;&#9;result = await Function2(param1, param2, param3, param4, param5)
&#9;&#9;}
&#9;&#9;catch (e) {
&#9;&#9;&#9;&#9;console.log("Exception == " + e);
&#9;&#9;}
&#9;
&#9;&#9; return result;&#9;&#9;
}
function Function2(param1, param2, param3, param4, param5) {
&#9;&#9;return new Promise(function (resolve, reject) {
&#9;&#9;&#9; ...
&#9;&#9;&#9; ...some code to call third party API
&#9;&#9;&#9; ...
&#9;
&#9;&#9;&#9;&#9;var self = this;
&#9;&#9;&#9;&#9;
&#9;&#9;&#9;&#9;apiRequest.addEventListener('response', function (e) {
&#9;&#9;&#9;&#9;&#9;&#9;var response = JSON.parse(e.detail.response);
&#9;&#9;&#9;&#9;&#9;&#9;var returnString = JSON.stringify(response);
&#9;&#9;&#9;&#9;&#9;&#9;var payload = [];
&#9;&#9;&#9;&#9;&#9;&#9;payload[0] = response.obj1
&#9;&#9;&#9;&#9;&#9;&#9;payload[1] = response.obj2
&#9;&#9;&#9;&#9;&#9;&#9;payload[2] = response.obj3
&#9;&#9;&#9;&#9;&#9;&#9;payload[3] = response.obj3
&#9;&#9;&#9;&#9;&#9;&#9;
&#9;&#9;&#9;&#9;&#9;&#9;resolve(payload);
&#9;&#9;&#9;&#9;});
&#9;&#9;&#9;&#9;applePayencryptRequest.addEventListener('error', function (e) {&#9;&#9;&#9;&#9;&#9;&#9;
&#9;&#9;&#9;&#9;&#9;&#9;// return [];
&#9;&#9;&#9;&#9;&#9;&#9;reject("ERROR");
&#9;&#9;&#9;&#9;});
&#9;&#9;});
}
Post not yet marked as solved
I have a WKWebView in my app which opens a page where there is a button that uses javascript to open another page with window.open().
Now it's seems that webView(navigationAction) is never called when tapping this button. I have managed to get target="_blank" links to open, but I don't understand how I can get window.open() to work?
I have added a uiDelegate to create popup windows like this:
public class WKWebVC: UIViewController {
	...
	override public func viewDidLoad() {
		super.viewDidLoad()
		webView.navigationDelegate = self
		webView.uiDelegate = self
		webView.configuration.preferences.javaScriptEnabled = true
webView.configuration.preferences.javaScriptCanOpenWindowsAutomatically = true
	...
and then the extension for WKWebVC:
extension WKWebVC: WKUIDelegate {
private func webView(_ webView: WKWebView, createWebViewWith configuration: WKWebViewConfiguration, for navigationAction: WKNavigationAction, windowFeatures: WKWindowFeatures) -> WKWebView? {
debugPrint("(👉🏽👉🏽👉🏽 createWebViewWith")
popupWebView = WKWebView(frame: view.bounds, configuration: configuration)
popupWebView!.autoresizingMask = [.flexibleWidth, .flexibleHeight]
popupWebView!.navigationDelegate = self
popupWebView!.uiDelegate = self
view.addSubview(popupWebView!)
return popupWebView!
}
private func webViewDidClose(_ webView: WKWebView) {
if webView == popupWebView {
popupWebView?.removeFromSuperview()
popupWebView = nil
}
}
}
But createWebViewWith is never called either...
Post not yet marked as solved
Can the new M1 be used to develop java
And Node.js
Post not yet marked as solved
I'm currently trying to build my react native app on TestFlight with Fastlane using this tutorial:
boorje.com/deploy-react-native-app/
I reached the last step and ran the command bundle exec fastlane beta. This should've built the app on TestFlight, but it didn't.
Instead, I received this error: File/Users/myname/Library/Developer/Xcode/DerivedData/GAbeta-etzidujiozhpelfdovtuwdoldqcl/Build/Intermediates.noindex/ArchiveIntermediates/GAbeta/BuildProductsPath/Release-iphoneos/GAbeta.app/main.jsbundle does not exist.
Additionally, I was informed that the following build commands failed:
PhaseScriptExecution Bundle\ React\ Native\ code\ and\ images /Users/myname/Library/Developer/Xcode/DerivedData/GAbeta-etzidujiozhpelfdovtuwdoldqcl/Build/Intermediates.noindex/ArchiveIntermediates/GAbeta/IntermediateBuildFilesPath/GAbeta.build/Release-iphoneos/GAbeta.build/Script-00DD1BFF1BD5951E006B06BC.sh
I've done some research on potential solutions including https://github.com/facebook/react-native/issues/25522#issuecomment-509036251, but none worked.
Does anyone have any suggestions in order to solve this issue or could anyone potentially assist in my search?
Post not yet marked as solved
My iOS app is crashing on the initial load. It's happening both in my Testflight build and also in the production version of the app on the App Store. It was working fine a few days ago; this just started happening all of a sudden.
What's strange is that after doing a fresh install, it doesn't happen the first time I open the app. It only happens after I force close the app and open it again (and every time afterward).
I'm using Expo and React Native to build the app. I've attached a crash log.
crash log - https://developer.apple.com/forums/content/attachment/6a5962a1-56ac-44b0-8ec4-4e8dee0daee8
Post not yet marked as solved
how to hide the browser address bar and navigation bar in iphone? at least in safari and chrome.
i tried to use :(timeout with scrollTo(0,1)) but it didn't work. and also the fullscreen api doesn't work on ios.
Since upgrading to Big Sur, sending AppleScript "do JavaScript" command to Safari runs extremely slowly.
For example:
tell application "Safari"
set rslts to do JavaScript "document.title;" in document 1
end tell
... this used to take a split second in prior versions of the MacOS. Since upgrading to Big Sur, running this script results in a spinning pinwheel, the Safari's CPU usage ramps up to 100% and the command takes about 10 seconds to complete.
Post not yet marked as solved
Hello,
I'm currently struggling to figure out how I can make Apple sign in work with my app configuration. Maybe I'm just dumb, but I really can't figure out what I need to do to make it work.
So I have a Next.js app setup server-side rendering my React frontend, and on a separate server, I have a Node.js (specifically Adonis.js) backend/api which I use to handle auth and sessions.
I have both Facebook and Google OAuth2 logins setup and working perfectly, where I'm receiving a code as a query param in my callback url to my frontend, which the client then sends that code to my backend/api, which uses that code with the provider (FB or Google) to get their email, name, and any other data I could use to prevent the user from having to add later, and either create the user and log them in, or just log them in if they already exist using cookies. I don't need any sort of write access to their third party account, or anything more than reading their name and email so they don't have to enter it themselves, and so they don't have to enter a password on my site.
There are 2 different questions I have. (and if there is a solution to the first one, it would make my life so much easier ha..)
If I use these query params similar to how I would with Google or Facebook:
response_type: 'code',
client_id: Env.get('APPLE_APP_ID'),
redirect_uri: 'https://example.com/auth/apple/callback'
state: '',
scope: '',
response_mode: 'query'
And I get redirected back to my frontend with the code in the url params, and I send it to my API like I do with Facebook/Google, is there any endpoint with Apple's system that I can use that code to request the user's email and name from?
2. From reading through doc after doc, and it still being fuzzy, I'm thinking I may need to use the form_post response mode kind of like this?:
response_type: 'code id_token',
client_id: Env.get('APPLE_APP_ID'),
redirect_uri: 'https://example.com/auth/apple/callback',
state: '',
scope: ['email', 'name'].join(' '),
response_mode: 'form_post'
My impression is that it would post a token, and the user data to my callback url, and that I can get the user's email and name from the user's first request and attach the token received to the user in my database. I just do not for the life of me understand how I could use this pattern with how my app is setup. Would I have to have a post handler and a page setup on the same route (I don't even know if Next.js allows something like that), and then from that, I send that data to my backend server and create the account with the data received? Even if all that worked, I don't think I would be able to set the user's session since I rely on the request being made from my frontend to my backend utilizing the set-cookie header.
Please let me know your thoughts, input, or clarifications.
Thanks,
Brody
Post not yet marked as solved
Hi in my web extension I have a button, which I programmatically create a file for download when the user clicks it.
Here is my code: a.click()
However, this does nothing when I do it within the popup. It works fine on the main Safari webpage. Am I doing something wrong?
Post not yet marked as solved
I have this js code:
document.addEventListener('AppleIDSignInOnSuccess', (data) = {
//handle successful response
console.log(data["detail"].authorization.id_token)
response = parseJwt(data["detail"].authorization.id_token)
email = response["email"]
console.log(email)
loginWithEmail(email)
// console.log("APPLE SIGN IN SUCCESSFFUL");
});
//Listen for AppleId authorization failures
document.addEventListener('AppleIDSignInOnFailure', (error) = {
//handle error.
alert(JSON.stringify(error))
console.log("APPLE SIGN IN UNSUCCESSFFUL");
});
And it just stopped working. Now every time I sign in I get "APPLE SIGN IN UNSUCCESSFFUL" and the error is {"isTrusted":false}. What are ways around this?
Post not yet marked as solved
When the touchstart event is added on the Document - on click of the dropdown the options box opens and closes immediately, thus restricting user to make any selections
We are able to reproduce this issue on iOS14 : iPad 5th Generation, iOS 14.6 version with the code snippet below
Note : The dropdown works fine when the touchstart event is disabled and this issue is specific to iOS14, works well on iOS13.
<!DOCTYPE html>
<html>
<body onload="addEvents()">
<h1>The select element</h1>
<p>The select element is used to create a drop-down list.</p>
<form action="/action_page.php">
<label for="cars">Choose a car:</label>
<select name="cars" id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
<br><br>
<input type="submit" value="Submit">
</form>
<p>Click the "Submit" button and the form-data will be sent to a page on the
server called "action_page.php".</p>
<script>
function touchHandler(event) {
var touches = event.changedTouches, first = touches[0], type = "";
switch (event.type) {
case "touchstart":
type = "mousedown";
break;
case "touchmove":
type = "mousemove";
break;
case "touchend":
type = "mouseup";
break;
default:
return;
}
if(document.getElementById("searchContainer") === null || document.getElementById("searchContainer").style.display === "none"){
var simulatedEvent = document.createEvent("MouseEvent");
simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX,
first.screenY, first.clientX, first.clientY, false, false, false,
false, 0/*left*/, null);
first.target.dispatchEvent(simulatedEvent);
//event.preventDefault();
}
}
function addEvents(){
document.addEventListener("touchstart", touchHandler, true);
document.addEventListener("touchmove", touchHandler, true);
document.addEventListener("touchend", touchHandler, true);
document.addEventListener("touchcancel", touchHandler, true);
}
</script>
</body>
</html>
As in this code snippet, onload we are adding touchstart event to the Document and the containing form has the dropdown. On click of the dropdown, we are unable to make selections as the dropdown options box gets closed immediately.
Please assess this and let us know if this is a bug on your side and when the possible correction for this can be expected?
Also, can you please update on the below ticket, The issue is still reproducible on the latest iOS version. This was accepted as a bug on your side - please share updates on this as well.
https://developer.apple.com/forums/thread/671827?login=true&page=1#658436022
Post not yet marked as solved
I'm trying to install Postgres pl/java extension for which I need to run the pljava-packaging/target/pljava-pg13.3-x86_64-MacOSX-gpp.jar file. I used the command java - jar file path.jar to run but I get an error unable to access jar file. Tried changing privacy options, moving it to different folder but none worked. I'm very new to Mac, can someone help with a solution?
Post not yet marked as solved
Hi all,
I need my website to go full screen, or at least the top url bar and the bottom navigation bar removed.
With the requestFullScreen(); function in JavaScript it does not work and neither with the meta tag <meta name = "Apple-mobile-web-app-capable" content = "yes">.
Anyone know how to fix it any way?
Thanks in advance.
Post not yet marked as solved
I’m trying to read a rather big file in chunks using FileReader (File selected from a field). Works fine on Android, Chrome, Firefox etc., but somehow on iOS Safari the FileReader stops reading the chunks exactly after 60 seconds. The error I am seeing is WebkitBlobResource error 1. Makes me wonder if this is some kind of permission error or somehow iOS Safari revokes the File blob.
Sample code:
let file = <input type="file">
let chunkSizeToUse = (1024 * 1024) // 1 MB chunks
let offset = (0 - chunkSizeToUse)
let readInterval = setInterval(() => {
if(offset < file.size){
offset += chunkSizeToUse
let fileReader = new FileReader()
fileReader.onload = () => {
let arrayBuffer = fileReader.result
//further chunk processing
}
fileReader.onerror = (err) => {
console.log(err) // WebkitBlobResource error 1 exactly after 60 seconds of processing
}
fileReader.readAsArrayBuffer(file.slice(offset, (offset + chunkSizeToUse)))
}
else{
clearInterval(readInterval)
}
}, 100)
For easier and direct debugging on an iOS device using Safari I'm gonna link this JSFiddle:
https://jsfiddle.net/L17uymvp
Just select a file and wait for the counter do go to zero.
All of this makes it impossible for some users to upload large files. Our webapp processes each chunk individually (encryption), so we have to work with chunks.
Post not yet marked as solved
My PWA app running in Safari iOS 14.7.1 breaks if opening a link from the PWA app and then returning to the pwa app. The app is launched from a home screen icon. Everything works correctly until I open a link from the app and then return to the pwa app. It might be related to use of a javascript alert function?
My PWA code works correctly including being able to open a link and return to the pwa afterwards if running the pwa in the Edge browser. Seems only to be broken if using Safari? And then only if tapping on a link to another page or url and returning to my app afterwards..from then on there are errors and dysfunction in my pwa app. Any ideas why and how to work around? Thank you.
Post not yet marked as solved
With the latest iOS 15 beta releases we have started seeing issues with memory and canvases. This error is not reproduced in any of the earlier iOS versions (with any devices), it is only present in the new iOS 15 beta versions.
The warning about total canvas memory is always followed with a javascript exception trying to do rendering on the canvas:
This is an history of it working in a iPhone 12 pro max with iOS 14.7.1.
This is history of it not working with an iPhone 11 with iOS 15 beta 5 (confirmed with beta 4 as well)
There are a couple of observations we've made:
It seems it is more easily reproduced by repeatedly triggering the new url bar and rotating the device a lot.
Clearing History and Website Data can fix the issue temporarily
When it is reproduced it can easily be reproduced again, even when reloading the page.
Post not yet marked as solved
As the title suggests: Safari on Monterey Beta 5 hangs on certain sites unless JavaScript is disabled.
M1, safe mode, clean re-installs of everything, latest build of the STP, running latest JDK for good measure.
It's annoying – anyone else seen this?
Post not yet marked as solved
I have built this reactjs app
the get cookie function wont work with Iphones and it return blank page
it works fine with android and computers but not in iphones
here is the javascript code for getting the cookie
and also let me remind that I am using react redux *** well
the code is in store.js
function getCookie(name) {
const value = `; ${document.cookie}`;
const parts = value.split(`; ${name}=`);
if (parts.length === 2) return parts.pop().split(";").shift();
}
const userInfoFromStorage = getCookie("userInfo")
? JSON.parse(getCookie("userInfo"))
: null;
const initialState = {
userLogin: {
userInfo: userInfoFromStorage,
},
};
const middleware = [thunk];
const store = createStore(
reducer,
initialState,
composeWithDevTools(applyMiddleware(...middleware))
);
export default store;
please help me :)
Post not yet marked as solved
I am new to PHP. I have developed my own web site with a lot of javascript in simple HTML files. I want to do some extensions with PHP but I can't make a simple web page function. I am sure something simple is wrong. Help!
Here is the test web page I made: hello.html
<html>
<head>
<title>Hello World</title>
</head>
<body>
<?php echo 'Hello World!'; ?>
</body>
</html>
Pointing Safari at hello.html gives me a new tab with the correct title, but no "Hello World" in the page itself.
Here is the output of php --version:
WARNING: PHP is not recommended
PHP is included in macOS for compatibility with legacy software.
Future versions of macOS will not include PHP.
PHP 7.3.24-(to be removed in future macOS) (cli) (built: Jun 17 2021 21:41:13) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.3.24, Copyright (c) 1998-2018 Zend Technologies