costiiordan was awarded Best Answer+1000 XP
2mos ago
costiiordan wrote a reply+100 XP
2mos ago
costiiordan started a new conversation+100 XP
2mos ago
I'm adding Browser tests to a Laravel 12 application using PEST 4. This is an older application that was migrated to the latest version of Laravel.
I want to test some pages that have forms which are submitted using JavaScript Fetch API and FormData object.
The functionality works well in the browser, but when I perform a form submit from PEST, the endpoint that receives the request does not see the attached form data.
I narrowed it down to a simple example to show the problem.
routes:
Route::view('/', 'test');
Route::post('/', function () {
return response()->json(['message' => request()->get('input', 'No input provided')]);
});
view:
<html>
<head>
<title>Test page</title>
</head>
<body>
<button id="test-btn">Test</button>
<div id="response"></div>
<script>
document.getElementById('test-btn').addEventListener('click', () => {
const formData = new FormData();
formData.append('input', 'Hello from JS!');
fetch('/', {
method: 'POST',
body: formData
})
.then(async response => {
const respJson = await response.json();
document.getElementById('response').innerHTML = respJson.message;
});
});
</script>
</body>
</html>
When I press the "Test" button in the browser, I see: Hello from JS!
When I run the following PEST test...
test('test submit', function () {
$page = visit('/');
$page->click('Test')
->assertSee('Hello from JS!')
->screenshot();
});
The test fails with the following message:
FAILED Tests\Feature\ExampleTest > test submit
Expected to see text [Hello from JS!] on the page initially with the url [...], but it was not found or not visible. A screenshot of the page has been saved to [Tests/Browser/Screenshots/test_submit].
at tests/Feature/ExampleTest.php:7
3▕ test('test submit', function () {
4▕ $page = visit('/');
5▕
6▕ $page->click('Test')
➜ 7▕ ->assertSee('Hello from JS!')
8▕ ->screenshot();
9▕ });
10▕
In the screenshot, the text is: No input provided.
Has anyone encountered this issue and can recommend a fix?
On my Github you can fins a small repository where this issue is reproduced named pest-browser-test-bug.