[Bug]: Timeout when importing app.css via Vite #217

Fradd747 · 2025-01-22T19:54:20Z

Fradd747
Jan 22, 2025

What happened?

I installed fresh Laravel 11, puppeteer and laravel-pdf to reproduce this bug. When I create a pdf with a view that contains @vite(['resources/css/app.css']) the app returns error: The command "C:\laragon\bin\nodejs\node-v22.13.0-win-x64\node.EXE "C:\Laravel Apps\test-pdfs\vendor\spatie\browsershot\src/../bin/browser.cjs" "{""url"":""file:\/\/C:\\Users\\xxxx\\AppData\\Local\\Temp\\1796011234-0715388001737573807\\index.html"",""action"":""pdf"",""options"":{""args"":[""--no-sandbox"",""--disable-web-security""],""viewport"":{""width"":800,""height"":600},""displayHeaderFooter"":false,""format"":""a4"",""waitUntil"":""networkidle0"",""acceptInsecureCerts"":true,""printBackground"":true}}"" failed. Exit Code: 1(General error) Working directory: C:\Laravel Apps\test-pdfs\public Output: ================ Error Output: ================ TimeoutError: Navigation timeout of 30000 ms exceeded at new Deferred (C:\Laravel Apps\test-pdfs\node_modules\puppeteer-core\lib\cjs\puppeteer\util\Deferred.js:60:34) at Deferred.create (C:\Laravel Apps\test-pdfs\node_modules\puppeteer-core\lib\cjs\puppeteer\util\Deferred.js:21:16) at new LifecycleWatcher (C:\Laravel Apps\test-pdfs\node_modules\puppeteer-core\lib\cjs\puppeteer\cdp\LifecycleWatcher.js:69:60) at CdpFrame.goto (C:\Laravel Apps\test-pdfs\node_modules\puppeteer-core\lib\cjs\puppeteer\cdp\Frame.js:148:29) at CdpFrame.<anonymous> (C:\Laravel Apps\test-pdfs\node_modules\puppeteer-core\lib\cjs\puppeteer\util\decorators.js:109:27) at CdpPage.goto (C:\Laravel Apps\test-pdfs\node_modules\puppeteer-core\lib\cjs\puppeteer\api\Page.js:574:43) at callChrome (C:\Laravel Apps\test-pdfs\vendor\spatie\browsershot\bin\browser.cjs:293:37).

When I remove vite() asset, it works just fine. Also it works when I run npm run dev (even with the vite() asset) instead of npm run build. It can be something with assets building?

How to reproduce the bug

Install fresh Laravel 11.39.1, puppeteer 24.1.0, laravel-pdf 1.5.4.
edit welcome.blade.php page:

<html lang="cs">
<head>
    <meta charset="UTF-8">
    <style>
        @page {
            size: A4;
            margin: 7.5mm;
        },

    </style>
    @vite(['resources/css/app.css'])
</head>
<body class="m-0 w-[210mm] h-[297mm] p-0">
    <div>
        <p>this is a test</p>
    </div>
</body>
</html>

edit web router

<?php

use Spatie\LaravelPdf\Facades\Pdf;
use Spatie\Browsershot\Browsershot;
use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    #return view('welcome');
    return Pdf::view('welcome')->format('a4')->withBrowsershot(function (Browsershot $browsershot) {
        $browsershot->setOption('args', ['--disable-web-security'])
        ->waitUntilNetworkIdle()->ignoreHttpsErrors()->noSandbox();
    })->name('testing.pdf');
});

run npm run build and php artisan serve
visit localhost page

Package Version

1.5.4

PHP Version

8.2.27

Laravel Version

11.39.1

Which operating systems does with happen with?

Windows

Notes

Runnning on node 22.13.0.
I also tried adding .puppeteerrc.cjs with

const {join} = require('path');

/**
 * @type {import("puppeteer").Configuration}
 */
module.exports = {
  // Changes the cache location for Puppeteer.
  cacheDirectory: join(__dirname, '.cache', 'puppeteer'),
};

and reinstalling puppeteer but it did not work.

Fradd747 · 2025-03-23T20:32:18Z

Fradd747
Mar 23, 2025
Author

Use "puppeteer": "^23.4.0" in your package.json and it will work again. But this is not a fix, just workaround.

0 replies

lucidlemon · 2025-05-22T09:25:36Z

lucidlemon
May 22, 2025

I'm running into the same issue, but only if i import the css multiple times (once for header, footer and body). using "puppeteer": "^23.4.0" did not help thus far either.

i'm using using

node v22.15.0
npm 10.9.3
"puppeteer": "^23.4.0"
"spatie/laravel-pdf": "^1.5"

on MacOS 15.5 and using Herd for Laravel

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

[Bug]: Timeout when importing app.css via Vite #217

Uh oh!

{{title}}

Uh oh!

Replies: 2 comments

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

[Bug]: Timeout when importing app.css via Vite #217

Uh oh!

Fradd747 Jan 22, 2025

What happened?

How to reproduce the bug

Package Version

PHP Version

Laravel Version

Which operating systems does with happen with?

Notes

Replies: 2 comments

Uh oh!

Uh oh!

Fradd747 Mar 23, 2025 Author

Uh oh!

lucidlemon May 22, 2025

Fradd747
Jan 22, 2025

Fradd747
Mar 23, 2025
Author

lucidlemon
May 22, 2025