Test API request (#1667)

barryvdh · web-flow · commit bae4b221e725 · 2024-09-11T20:37:05.000+02:00
diff --git a/tests/DebugbarBrowserTest.php b/tests/DebugbarBrowserTest.php
@@ -28,6 +28,7 @@ protected function getEnvironmentSetUp($app)
 
         $this->addWebRoutes($router);
         $this->addApiRoutes($router);
+        $this->addViewPaths();
 
         $kernel = app(\Illuminate\Contracts\Http\Kernel::class);
         $kernel->pushMiddleware(\Illuminate\Session\Middleware\StartSession::class);
@@ -58,6 +59,12 @@ protected function addWebRoutes(Router $router)
                 return '<html><head></head><body>HTMLPONG</body></html>';
             }
         ]);
+
+        $router->get('web/ajax', [
+            'uses' => function () {
+                return view('ajax');
+            }
+        ]);
     }
 
     /**
@@ -72,6 +79,11 @@ protected function addApiRoutes(Router $router)
         ]);
     }
 
+    protected function addViewPaths()
+    {
+        config(['view.paths' => array_merge(config('view.paths'), [__DIR__ . '/resources/views'])]);
+    }
+
     public function testItStacksOnRedirect()
     {
         $this->browse(function (Browser $browser) {
@@ -114,4 +126,16 @@ public function testItDoesntInjectOnJson()
                 ->assertDontSee('GET api/ping');
         });
     }
+
+    public function testItCapturesAjaxRequests()
+    {
+        $this->browse(function (Browser $browser) {
+            $browser->visit('web/ajax')
+                ->waitFor('.phpdebugbar')
+                ->assertSee('GET web/ajax')
+                ->click('#ajax-link')
+                ->waitForTextIn('#result', 'pong')
+                ->assertSee('GET api/ping');
+        });
+    }
 }
diff --git a/tests/resources/views/ajax.blade.php b/tests/resources/views/ajax.blade.php
@@ -0,0 +1,24 @@
+<html>
+<body>
+
+<a href="#" id="ajax-link" onclick="loadAjax();return false;">Click me</a>
+<div id="result">Waiting..</div>
+
+<script>
+    async function loadAjax() {
+        try {
+            const response = await fetch('/api/ping', {headers: {'X-Requested-With': 'XMLHttpRequest'}});
+            if (!response.ok) {
+                throw new Error(`Response status: ${response.status}`);
+            }
+
+            const json = await response.json();
+
+            document.getElementById('result').innerText = json.status;
+        } catch (error) {
+            console.error(error.message);
+        }
+    }
+
+</script>
+</body>
