Search code examples
javascriptioswordpresscross-browser

Why is my JavaScript not working within Wordpress admin?


I am developing a Wordpress plugin. I have several JavaScript files (also several CSS and PHP classes). Using the browser's developers' tools, I have debugged and optimised the scripts. And all work perfectly in a variety of browsers (like Firefox, Chrome and Safari).

However the scripts will not function on my old iPad (iOS 9.3) which uses the native Safari.

UPDATE: No javascript for Chrome on iOS either.

I have a simple script now:

alert("Hello");

Again it show fine on my desktop browsers.

(I've heard Safari restricts sites using http:. My site uses https: though.)

I installed another plugin ("WP Tools", I think) and in WP admin, it reported on the desktops: "Javascript is working ...". On the iPad it said "Javascript is NOT working properly...". Other non-WP testers show on the iPad, js is active and working.

Tested on a fresh Wordpress with 'Twenty Twenty-One' theme - no other plugins. Can others confirms these results? Is there a work-a-round?


Solution

  • I would have added a comment, but don't have enough reputation yet :)

    It's likely that the mobile browsers don't support the same functions, versions, etc. - also Apple don't always allow app updates if the device is too old. Meaning some apps can have restrictions regarding the iOS version. If that's the the, you should check if it works on a newer device.

    I have recently heard that some functions in ES6 don't work at all in mobile browsers, and also popups like alert, confirm, etc. has been disabled in some of the browsers. I haven't checked this myself, so I can't really confirm or deny it.

    I would start by checking that your mobile browser supports scripts from other websites in the first place. If it does, I would continue making sure the scripts follow the ES5 syntax if possible.

    If this don't work, you could remove all of the script code, and adding it back bit by bit to find out where it goes wrong. Another handy "trick" when debugging in WordPress, is to set the version number to fx. time() where you register/enqueue the script. This way you can be sure your browser don't serve an old version of the script from its own cache.

    Hope it helps a little, and that you figure it out eventually