How to fix the "whatsapp://" protocol click in iOS Homescreen Chrome Shortcut broken after latest iOS update to 12.2?

Question

Previous / Working State:

Javascript was fetching some simple date/time values from HTML form & was setting string "whatsapp://send?text="+encodeURIComponet(str) as href of an a element.

On iOS, I opened the link on Safari, selected Bookmarks -> Add to Home Screen. All was working ie on pressing "Go", javascript ran, fetched values, generated string, & then Safari Autoredirected to Whatsapp App with a list of contacts to choose for message, as well as Share link worked if clicked manually.

href.value = whatsapp://send?text=Apr-21%3A%20Dav%20OUT%20at%2007%3A19pm

After I updated the iPhone 8 to latest iOS 12.2 three days ago:

Same setup, but now after clicking button "Go", Safari shows the following URL in address/status bar & a white page showing

Safari cannot open the page because it
cannot redirect to locations starting
with "whatsapp:"

Manual click & element.click() both gives above error. Same everyhting in iOS Chrome or iOS Safari browser are working as intented, but gives error only when used from Add to Homescreen App.

My Code

HTML

<form>
<label for="date">Date</label><input id="date" name="date" type="date" required>
<label for="what">In/Out</label>
<select id="what" name="what" required>
  <option value="tIn">IN</option>
  <option value="tOut">OUT</option>
</select>
<label for="when">Time</label>
<input id="when" name="when" type="time" step=60 required><!-- step=60 will show only HH:MM -->
<input type="submit" onClick="process()" value="Go">
<a id="share">Share</a>

JS

function process(){
  var date = document.getElementById("date").value;
  var what = document.getElementById("what").value;
  var when = document.getElementById("when").value;
  var waStr = waFormat(date,what,when);

  var share = document.getElementById("share");
  share.href = "whatsapp://send?text=" + encodeURIComponent(waStr);
  share.click();
}

//return string for whatsapp link
function waFormat(waDate,waWhat,waWhen){
  var sp = " ";
  waDate = waDate.split("-");
  var mon = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
  waDate = mon[(waDate[1]-1)] + "-" + waDate[2]; 
  waWhat = (waWhat == "tIn") ? "IN" : "OUT";
  waWhen = waWhen.split(":");
  var apm = "am";
  if(waWhen[0]>12){
    waWhen[0] = waWhen[0]-12;
    apm = "pm";
  }
  waWhen = ("0" + waWhen[0]).slice(-2) + ":" + waWhen[1] + apm;
  return waDate + ": "+ waWhat + sp + "at" + sp + waWhen;
}

I switched between encode()/encodeURI()/encodeURIComponent, but no avail.

Please help. Where could be the problem for that whatsapp:// not working in HomeScreen Safari App? I could use https://wa.me link but would also like to find if whatsapp:// has stopped working?

It works when same page is opened from Safari/Any, does NOT work when opened from HomeScreen App in iOS

Answer 1

I've ran into this problem too. For my it worked to move away from the url scheme whatsapp:// and use the following guide https://faq.whatsapp.com/en/android/26000030/ .

To create your own link with a pre-filled message that will automatically appear in the text field of a chat, use https://wa.me/whatsappphonenumber/?text=urlencodedtext where whatsappphonenumber is a full phone number in international format and URL-encodedtext is the URL-encoded pre-filled message.

Example: https://wa.me/15551234567?text=I'm%20interested%20in%20your%20car%20for%20sale

To create a link with just a pre-filled message, use https://wa.me/?text=urlencodedtext

Example: https://wa.me/?text=I'm%20inquiring%20about%20the%20apartment%20listing

After clicking on the link, you will be shown a list of contacts you can send your message to.