The other day I encountered something that was fun to solve. It was also a little frustrating because I couldn’t completely replicate on my local install. It had to do with using a mobile device and using a WebView. I am not an app developer but I do want to learn about that process. Maybe one day I’ll explore a little more on how to build an app.
It dealt with JavaScript a little bit. It was great because I was able to apply things I had learned on troubleshooting some Facebook related issues. The harder part was actually getting it to work on other apps as well. The issue was a browser check. It may sound simple for some and a pain for others. This was because in-app browsers can be a little different based on device. Android is not exactly the same as iOS, and they are not the same as Windows. Yes, there are people who actually use those type of phones.
The issue was only on iOS devices. I naturally searched for something that would help me find my answer. In our company repo, I saw a few commits that somewhat helped me figure out where things were going wrong. There was a comment that also helped me solve this. It was fixed and things worked again.
Or so I thought.
You see the fix worked but then I had introduced a small issue. It was adding a class to the body
that should not have been. So, I dug a little deeper and realized what I had done wrong.
What’s cool is that I already knew about this but had forgotten to actually do this. I wasn’t checking if a property existed. You see, when I had submitted my fix I was simply using something like:
if (!window.object.property) { // do things here }
While that is great, it did not take into account if that property didn’t exist. What I really should have done was:
if ("property" in window.object.property === false) { // do things here }
Such a simple mistake to make. It happens.
I learned from it.
The object I was using was the navigator object. The property I was trying to check for was the standalone property. This is a property that only iOS devices have so when it was running the first snippet it was giving an undefined
but because it was using the !
it was really saying it was true
so it was actually executing the code inside of that when it should not have.