[FIX] website: fix failing unsplash beacon test

The unsplash beacon public widget is started before the test assets JS
is loaded. Because of this, the approach in [1] fails sporadically.
If the result from the `/web_unsplash/get_app_id` RPC is obtained
before the test assets JS is loaded, the beacon patch is not applied
in time, and the test fails.

This commit applies the patch within the actual page HTML to avoid this
issue.

[1]: https://github.com/odoo/odoo/commit/a5abc766424f34074be3ae7a97ad7c6e9583f9c5

runbot-22610

closes odoo/odoo#127809

X-original-commit: 3f64135ff136addfad7c4c79e8c19cc33f8b19cf
Signed-off-by: Guillaume Dieleman (gdi) <gdi@odoo.com>

addons/website/static/tests/tours/unsplash_beacon.js

@@ -2,22 +2,9 @@
 
 import { registry } from "@web/core/registry";
 
-if (window.location.search.includes("test_unsplash_beacon")) {
-    // Patch RPC call.
-    const oldGet = $.get.bind($);
-    $.get = (url, data, success, dataType) => {
-        if (url === "https://views.unsplash.com/v") {
-            const imageEl = document.querySelector(`img[src^="/unsplash/${data.photo_id}/"]`);
-            imageEl.dataset.beacon = "sent";
-            return;
-        }
-        return oldGet(url, data, success, dataType);
-    };
-}
-
 registry.category("web_tour.tours").add("test_unsplash_beacon", {
     test: true,
-    url: "/?test_unsplash_beacon",
+    url: "/",
     steps: [{
         content: "Verify whether beacon was sent.",
         trigger: 'img[data-beacon="sent"]',

addons/website/tests/test_unsplash_beacon.py

@@ -16,8 +16,34 @@ class TestUnsplashBeacon(odoo.tests.HttpCase):
             <t t-set="pageName" t-value="'homepage'"/>
             <div id="wrap" class="oe_structure oe_empty">
                 <img src="/unsplash/pYyOZ8q7AII/306/fairy.jpg"/>
+                <!--
+                    Keeping this javascript inline instead of extracting it
+                    to avoid tempting users to publish such a file on their
+                    production system.
+                -->
+                <script>
+                    Object.defineProperty(window, "$", {
+                        get() {
+                            return this._patched$;
+                        },
+                        set(value) {
+                            delete this.$;
+                            this._patched$ = value;
+                            // Patch RPC call.
+                            const oldGet = value.get.bind(this);
+                            value.get = (url, data, success, dataType) => {
+                                if (url === "https://views.unsplash.com/v") {
+                                    const imageEl = document.querySelector(`img[src^="/unsplash/${data.photo_id}/"]`);
+                                    imageEl.dataset.beacon = "sent";
+                                    return;
+                                }
+                                return oldGet(url, data, success, dataType);
+                            };
+                        },
+                    });
+                </script>
             </div>
             </t>
         </t>'''
         # Access page.
-        self.start_tour("/?test_unsplash_beacon", "test_unsplash_beacon")
+        self.start_tour('/', 'test_unsplash_beacon')