Since I've seen a lot of chatter about people switching to #Firefox as Google ramps up the enshitification of #Chrome, let me tell you about a killer feature for people who (a) need multiple accounts on the same websites (eg. devs) or specifically (b) have to use multiple Google accounts.

Firefox has an official addon called Multi Account Containers that lets you trivially set up color coded tabs that have separate sets of cookies. Log into your dev account in one, and your test account in another. Log into your personal #gmail in one and have another tab next to it with your work Gmail. I'm actually not signed in to any Google accounts in most my tabs, I just have containers for the specific tasks I do on Google products.

It'll take you 30 seconds to set up.

Add-on: https://addons.mozilla.org/en-US/firefox/addon/multi-account-containers/

Mozilla's explanation: https://support.mozilla.org/en-US/kb/containers

If you find this free website useful - why don't you support this with a donation? It is easy.... read more ....

Like many #WordPress #Plugin and Theme developers I use #PHPCS with WordPress rule sets to help with coding the WP standards, especially around security.

Also like many I use #composer to install #WP coding standards with its dependencies.

The issue is that composer will update without warning, even if there are breaking changes.

So I got this issue

ERROR: Referenced sniff "PHPCSUtils" does not exist

Which rather flummoxed me, A Google Search wasn’t much help, nor a chat with Chat GPT.

Eventually I raised an issue on GitHub and after a bit of back and forth discovered that 3.0.0 was a breaking change.

The team had been diligent and noted this on Make Core and @[email protected] had taken the effort to X-post to make.wordpress.org/plugins/ which of course I subscribe to – but still I missed it.

So just in case you missed it too I posted this.

#composer #phpcs #plugin #wordpress #wp

https://badlywired.com/2023/09/wpcs-3-0-0-breaking-changes/

If you're a #wordpress #developer, do you use Gutenberg? Would love a boost if you don't mind!

#dev #development #frontend #acf #gutenberg

If you find this free website useful - why don't you support this with a donation? It is easy.... read more ....TLDR:

a form field with a negative margin margin-left: -99999999px breaks form input on iPhones and iPads

Discovering the Incompatibility Issue:

As an experienced web developer, I was handed the responsibility of maintaining an old WordPress plugin that incorporated a honeypot field as part of its anti-spam measures. The hidden honeypot field was designed to trap spam bots while staying inconspicuous to genuine users, and it had served its purpose effectively over the years. How effective I’m not100% sure.

The Hunt for a Larger Margin:

However, I soon encountered an unexpected layout quirk that necessitated a larger negative margin for this honeypot field. To accommodate the design requirements, I adjusted the negative margin, opting for an ample value like -99999999px, believing it would not hinder the honeypot’s functionality but simply keep it further out of sight.

The Curious Breakdown on iOS Devices:

Little did I anticipate that this seemingly benign change would have unforeseen repercussions. During testing, I noticed that form input capabilities on iOS devices, particularly iPhones and iPads, were severely affected. My tester noticed something was not right.

Searching for Explanations:

Baffled by this unexpected outcome, I embarked on a mission to understand the root cause of the problem. The issues was exasperated due to the fact that testing had advanced through several iterations of enhancement development modernizing the input layouts, without much testing on iOS.

Process of elimination:

In my mind this could only be either javascript or CSS and as there were four files, one each for legacy and one each for modern, I started commenting out the enqueues and testing via Browserstack. Fairly shortly it was clear the issues was in the legacy CSS. The ext step was made easy as I use git and commit frequently, and using PHPStorm’s Git Log and looking at comparisons was easy to find the few changes. The margin-left: -9999999px stood out and was worth testing a quit test reverting back to -999px on Browserstack and then a real iPhone confirmed the issue

Striking a Balance:

As I searched for solutions, I was mindful of the delicate balance between security and usability. While honeypot fields were effective in combating spam, it was crucial not to jeopardize the user experience, especially on a platform as widely used as iOS. I realized that the perfect solution lay in finding alternative techniques to hide the honeypot field while preserving form input capabilities on all devices. Hmm, obvious, use display: none;

Unraveling the Legacy Mystery:

I noted that the code for the honeypot and the negative margin adjustments were part of a legacy WordPress plugin that was built a decade ago. Uncertain of the value of this particular Honeypot, I investigated further, and the legacy code required the ‘bot’ to actually return a value in the field, whist this may happen it is no where near effective as requiring a secret key, and as the plugin is already protected by my WordPress anti spam plugin it seems that I might as well just remove this old, outdated technique and simplify the legacy code.

Conclusion:

As an experienced web developer, this perplexing encounter with the incompatibility issue between the honeypot field and the large negative margin on iOS devices served as a valuable reminder of the challenges that come with maintaining legacy code and the difficulties of testing with diverse and non standardised web technologies.

https://badlywired.com/2023/07/unintended-consequences-of-some-css-techniques/