Translated by Núria Adell.
I won’t get tired of repeating this. The world of web development is a jungle where no matter how experienced you are, any specimen can mess up your work. If this is what you do, you’ll know what I’m talking about. Doing evil is easier than it seems. And unfortunately, at Nelio we’ve already encountered more situations than we’d have liked where our plugins have stopped working because of the bad practices of third parties.
In this article I’ll explain how we spent a morning investigating the problem that a client of Nelio Content had and how we managed to solve it thanks to an extension for Google Chrome and Opera that streamlined the whole process.
The story begins as usual: a client contacted us through our support system because he had problems with Nelio Content. In particular, the problem had to do with the analytics that Nelio Content provides. In his installation, the analytics page of Nelio Content was loading infinitely, showing nothing further.
After requesting access to his WordPress (it’s not always easy to get access to your clients’ installations) and checking the error ourselves, we saw that there was indeed a problem related to our scripts. But it was a very strange problem. Apparently, we had an infinite loop of calls to functions. Functions that are only executed in response to events. So, somehow, events were being generated multiple times without making any sense.
.zip file), disable the uploaded version in the client’s website and delete it, upload the new version there, and finally activate it and see if we had solved the problem.
It’s clear that if you get FTP or SSH access everything is simplified, but that was not the case. You won’t always be able to have an environment where testing is plain sailing. So every test we did wrecked our productivity and patience. And besides, nothing indicated where the problem was. What were we doing wrong?! Until the little lightbulb lit up…
What if the problem you have with our plugin is not really a problem with our plugin? Could there be another plugin that puts something in our page and makes everything break down? Let’s investigate…
In these cases, you usually deactivate the active plugins and see if the problem is solved simply by having only Nelio Content active. From there, if everything works, you activate a plugin at a time to see which is the one that is breaking yours. However, being in front of a WordPress installation in production, you can’t do this recklessly or you might make the website of your client break down by disabling plugins.
Luckily, we finally found the solution.
The extension Interception allows you to replace scripts and styles with your own. In addition, it works on both Google Chrome and Opera. Take a look here. And its interface is very simple:
Once you’ve found these URLs (more than 10, in our case), you can put them in the Interception extension and have them replaced with a URL from your local installation. We ended up with something like this:
Once you’ve done this, you’ll see that the content of those scripts is replaced with your
empty.js file. You can check it by looking at the browser developer’s console:
Now that you’ve intercepted conflicting scripts in your browser and “disabled” them locally (remember that this only happens in your browser, your client’s installation is still working as usual), you can check if your plugin works. In our case, the problem disappeared, so the only thing left was figuring out which plugin was the cause.
We contacted the developers of the plugin causing the problems (WP Social Traffic PRO, which isn’t in the WordPress directory, but is sold on an external website) from several means, but we haven’t received any response. The client was reported on the problem and asked to disable the conflicting plugin, since it could break not only Nelio Content, but other plugins with selectors.
And so far the story of how we spent a morning in Nelio until we came up with the solution thanks to Interception.
Unfortunately, many plugins skip the previous rule for no reason. Many times it’s because of ignorance or inexperience of the developers. At least, that’s what I’d like to think. If you’re a WordPress developer, please read the Plugin Handbook. Seriously, do it. I’ll leave the link here one more time.
When a client has a problem, we tend to think that we’ve messed up and focus too much on finding what we’ve done wrong. This is one of the mistakes that, at least in my case, I tend to commit very often. And sometimes, as in the story I’ve told you, it’s someone else’s fault. Had we looked at this before, we would have come up with the solution much sooner. Of course, don’t go too far thinking that mistakes are never your fault. Just keep in mind that this happens, and check it out to try to improve your productivity.
As a client, be careful in terms of where you get the plugins you install in your WordPress. Try to look up for information beforehand and verify that the source can be trusted and the developer is experienced. Otherwise, you’re risking it. The WordPress plugin directory is usually the best place to look at. But that doesn’t mean you can’t find plugins of dubious quality there too. Again, be careful.
The plugin review process should include certain automatic checks. This way you could avoid (or minimize) the enqueueing of styles and scripts indiscriminately. It’s feasible. I won’t get tired of asking for this. Why is the theme review more open than that of plugins? At Nelio we’d love to contribute by reviewing WordPress plugins.
The Interception extension is absolutely wonderful. If you know more tools like this that can help you in your day to day as a developer, please don’t hesitate to leave a comment explaining your case. We’d love to learn from your experience.
Featuring image by Alexander Dummer in Unsplash.