Do not let a blip outrank an account problem where it counts

Second review pass over this release, plus the two things Plugin Check
caught on the way in.

The one that mattered: the rule that an outage must not bury an account
problem guarded the stored verdict but not the cached one - and the
cached one is what the gate reads. So a passing network hiccup still
replaced "your free tier is used up" for five minutes in the only place
that decides whether a form is let through, and with failsafe on those
submissions went through unverified. The guard now runs before either is
written.

Two more in the same file. Skipping the write when nothing changed froze
the timestamp at the first sighting, and the outage notice hides itself
once that is an hour old - so it would have vanished mid-outage; the
record is now refreshed at most every five minutes, which is neither a
write per request nor a lie about when we last saw the problem. And the
settings screen's connection test classified a response by its body
alone, so a 5xx carrying a cached error body could be read as an account
problem the test itself could never clear; both paths now share one
classifier.

Elsewhere:

  A form that arrives after the page does - a contact form in a popup, a
  builder rendering on demand - never got a badge. Submission was always
  safe there, since those listeners are delegated on the document; this
  is the badge catching up, on first focus rather than through an
  observer.

  The credit link announced itself as "Powered by" and nothing else,
  because the logo beside it is decorative.

  The translators comment sat above the sprintf rather than above the
  __() call, which is where the standard looks for it.

  The widget's missing version is deliberate and now says so at the line
  rather than being silenced for the whole plugin, where a version we
  forgot on our own script would matter.

Author: rajtik76

assets/css/badge.css

@@ -25,8 +25,9 @@
     box-sizing: border-box;
     /* clear only works in normal flow. Block themes and page builders lay forms
        out with flex or grid, where an appended element becomes an item on the
-       last row instead of a row of its own; these two claim the full width
-       there and do nothing at all outside such a container. */
+       last row instead of a row of its own. grid-column spans every column;
+       flex-basis claims the full width, which puts the badge on its own line
+       wherever the container wraps. Both are inert outside such a container. */
     flex-basis: 100%;
     grid-column: 1 / -1;
     padding: 16px 0 0;

assets/js/captchaapi-ajax.js

@@ -96,15 +96,11 @@
     function badge() {
         var match = selector();
 
-        if (!match || !window.captchaapiBadge || typeof window.captchaapiBadge.attachAndWait !== 'function') {
+        if (!match || !window.captchaapiBadge || typeof window.captchaapiBadge.watch !== 'function') {
             return;
         }
 
-        var forms = document.querySelectorAll(match);
-
-        for (var i = 0; i < forms.length; i++) {
-            window.captchaapiBadge.attachAndWait(forms[i]);
-        }
+        window.captchaapiBadge.watch(match);
     }
 
     if (document.readyState === 'loading') {

assets/js/captchaapi-badge.js

@@ -98,6 +98,12 @@
         link.target = '_blank';
         link.rel = 'noopener noreferrer';
 
+        // The visible text is "Powered by" beside a decorative logo, which on
+        // its own tells a screen reader nothing about where the link goes.
+        if (config.aria) {
+            link.setAttribute('aria-label', config.aria);
+        }
+
         if (config.logo) {
             var logo = document.createElement('img');
             logo.className = 'captchaapi-badge__logo';
@@ -129,11 +135,46 @@
         }
     }
 
+    /**
+     * Attaches to everything matching now, and to anything that shows up later.
+     *
+     * A contact form can arrive after the page does - pulled into a popup, or
+     * rendered on demand by a page builder - and a one-off pass at load would
+     * miss it. Submission is already safe there, because those listeners are
+     * delegated on the document; this is the badge catching up. A delegated
+     * focus listener rather than a MutationObserver: nobody submits a form they
+     * have not touched, and it costs nothing until they do.
+     */
+    function watch(selector) {
+        if (!selector) {
+            return;
+        }
+
+        attachAll(selector);
+
+        document.addEventListener('focusin', function (event) {
+            var form = event.target && event.target.closest ? event.target.closest('form') : null;
+
+            if (form && form.matches && form.matches(selector)) {
+                attachAndWait(form);
+            }
+        }, true);
+    }
+
+    function attachAll(selector) {
+        var forms = document.querySelectorAll(selector);
+
+        for (var i = 0; i < forms.length; i++) {
+            attachAndWait(forms[i]);
+        }
+    }
+
     // Published on the config object the plugin already puts here, so the
     // integration scripts have one place to go for both.
     window.captchaapiBadge = window.captchaapiBadge || {};
     window.captchaapiBadge.attach = attach;
     window.captchaapiBadge.attachAndWait = attachAndWait;
+    window.captchaapiBadge.watch = watch;
 
     if (document.readyState === 'loading') {
         document.addEventListener('DOMContentLoaded', addBadge);

assets/js/captchaapi-cf7.js

@@ -106,15 +106,11 @@
     // it on its own - the badge is attached here and put into standby, and
     // every state after that arrives through solve({ form }).
     function badge() {
-        if (!window.captchaapiBadge || typeof window.captchaapiBadge.attachAndWait !== 'function') {
+        if (!window.captchaapiBadge || typeof window.captchaapiBadge.watch !== 'function') {
             return;
         }
 
-        var forms = document.querySelectorAll('form.wpcf7-form');
-
-        for (var i = 0; i < forms.length; i++) {
-            window.captchaapiBadge.attachAndWait(forms[i]);
-        }
+        window.captchaapiBadge.watch('form.wpcf7-form');
     }
 
     if (document.readyState === 'loading') {

assets/js/captchaapi-woocommerce.js

@@ -73,15 +73,11 @@
     // it on its own - the badge is attached here and put into standby, and
     // every state after that arrives through solve({ form }).
     function badge() {
-        if (!window.captchaapiBadge || typeof window.captchaapiBadge.attachAndWait !== 'function') {
+        if (!window.captchaapiBadge || typeof window.captchaapiBadge.watch !== 'function') {
             return;
         }
 
-        var forms = document.querySelectorAll(SELECTOR);
-
-        for (var i = 0; i < forms.length; i++) {
-            window.captchaapiBadge.attachAndWait(forms[i]);
-        }
+        window.captchaapiBadge.watch(SELECTOR);
     }
 
     if (document.readyState === 'loading') {

includes/class-captchaapi-assets.php

@@ -211,6 +211,7 @@ private function enqueue_widget(
             // browser to whatever build shipped alongside this plugin version
             // and hide the next widget deploy until the plugin releases again.
             // Its own ETag and Last-Modified decide when a browser refetches.
+            // phpcs:ignore WordPress.WP.EnqueuedResourceParameters.MissingVersion -- Deliberate: the service versions this file, we do not.
             wp_register_script('captchaapi', $this->options->widget_url(), $deps, null, $in_footer);
             wp_add_inline_script('captchaapi', $this->config_script(), 'before');
         }
@@ -308,6 +309,8 @@ private function badge_config(array $selectors): array
             'href'      => $this->options->site_url(),
             'logo'      => CAPTCHAAPI_PLUGIN_URL . 'assets/img/captchaapi-logo.svg',
             'label'     => __('Powered by', 'captchaapi'),
+            /* translators: %s: captchaapi.eu, the service name. */
+            'aria'      => sprintf(__('Powered by %s', 'captchaapi'), 'captchaapi.eu'),
         ];
     }
 

includes/class-captchaapi-gate.php

@@ -222,8 +222,8 @@ public static function reason_for(string $code): string
                 // integrations hand this message to form plugins that print it
                 // without escaping. It arrives over the network, so it is not
                 // ours to trust however well we think we know the sender.
-                /* translators: %s: error code returned by the captchaapi.eu service. */
                 return sprintf(
+                    /* translators: %s: error code returned by the captchaapi.eu service. */
                     __('The captchaapi.eu service rejected the request (%s).', 'captchaapi'),
                     esc_html($code)
                 );

includes/class-captchaapi-service.php

@@ -38,6 +38,13 @@ class Captchaapi_Service
 
     const CACHE_TTL = 5 * MINUTE_IN_SECONDS;
 
+    /**
+     * How stale a recorded problem may get before it is written again. Long
+     * enough that a busy site is not writing an option per request, short
+     * enough that "when did we last see this" stays true.
+     */
+    const REFRESH_AFTER = 5 * MINUTE_IN_SECONDS;
+
     /**
      * Error codes that mean the site cannot get challenges until the owner does
      * something about it. Anything else from the challenge endpoint is treated
@@ -103,15 +110,26 @@ public function blocking_code(): string
      */
     public function remember(string $state, string $code = ''): void
     {
+        $stored = get_option(self::STATE_OPTION);
+        $stored = is_array($stored) ? $stored : null;
+        $blocked = $stored !== null && ($stored['state'] ?? '') === self::NOT_ENFORCEABLE;
+
+        // A passing outage must not bury an account problem. One is a blip that
+        // hides itself after an hour; the other needs the owner to act, and only
+        // a submission that verifies says it is over. This governs the cached
+        // verdict as much as the stored one: the cache is what the gate reads,
+        // so letting a blip overwrite it there would quietly hand an over-limit
+        // account the failsafe treatment it must never get.
+        if ($state === self::UNAVAILABLE && $blocked) {
+            return;
+        }
+
         // A real verification just told us more than a probe could, so the
         // cached verdict moves with it. Leaving it behind would let a stale
         // "everything is fine" answer outlive the account going over its limit,
         // and vice versa, for the length of the cache.
         set_transient(self::TRANSIENT, ['state' => $state, 'code' => $code], self::CACHE_TTL);
 
-        $stored = get_option(self::STATE_OPTION);
-        $stored = is_array($stored) ? $stored : null;
-
         if ($state === self::ENFORCING) {
             // Only on a real transition. Otherwise every verified submission on
             // the site would run a delete for a row that is not there.
@@ -122,17 +140,16 @@ public function remember(string $state, string $code = ''): void
             return;
         }
 
-        // A passing outage must not bury an account problem. One is a blip that
-        // hides itself after an hour; the other needs the owner to act and is
-        // cleared only by a submission that verifies.
-        if ($state === self::UNAVAILABLE && $stored !== null && ($stored['state'] ?? '') === self::NOT_ENFORCEABLE) {
-            return;
-        }
+        // An unchanged verdict is rewritten only now and then. Writing every
+        // time would mean a wp_options write per request during an outage -
+        // every bot hitting the login form - but never writing would freeze the
+        // timestamp at the first sighting, and the outage notice hides itself
+        // once that is an hour old. It would vanish mid-outage.
+        $unchanged = $stored !== null
+            && ($stored['state'] ?? '') === $state
+            && ($stored['code'] ?? '') === $code;
 
-        // Unchanged verdicts are not rewritten. The timestamp would differ every
-        // time, so without this an outage means a wp_options write per request -
-        // including every bot hitting the login form.
-        if ($stored !== null && ($stored['state'] ?? '') === $state && ($stored['code'] ?? '') === $code) {
+        if ($unchanged && (time() - (int) ($stored['time'] ?? 0)) < self::REFRESH_AFTER) {
             return;
         }
 
@@ -185,17 +202,34 @@ private function probe(): array
             'body'    => wp_json_encode(['site_key' => $site_key]),
         ]);
 
+        return self::classify($response);
+    }
+
+    /**
+     * Turns a challenge-endpoint reply into a state. Shared so the settings
+     * screen's "Test connection" cannot reach a different conclusion from the
+     * probe about the very same response.
+     *
+     * @param array<string, mixed>|WP_Error $response
+     *
+     * @return array{0: string, 1: string} state and the error code behind it
+     */
+    public static function classify($response): array
+    {
         if (is_wp_error($response)) {
             return [self::UNAVAILABLE, ''];
         }
 
-        $code = (int) wp_remote_retrieve_response_code($response);
+        $status = (int) wp_remote_retrieve_response_code($response);
 
-        if ($code === 200) {
+        if ($status === 200) {
             return [self::ENFORCING, ''];
         }
 
-        if ($code >= 500) {
+        // A 5xx is ours whatever the body claims. An error body cached by a
+        // proxy during an incident could otherwise be read as an account
+        // problem and stick around until a submission verifies.
+        if ($status >= 500) {
             return [self::UNAVAILABLE, ''];
         }