Skip to content

JS TypeError when replacing the debug toolbar #44142

@derrabus

Description

@derrabus

Symfony version(s) affected

5.4.0-BETA3

Description

When replacing the debug toolbar after an AJAX call using the Symfony-Debug-Toolbar-Replace header, a TypeError is logged to the console.

Uncaught TypeError: can't access property "classList", el is null
    removeClass https://localhost:8000/:22
    showToolbar https://localhost:8000/:22
    initToolbar https://localhost:8000/:22
    loadToolbar https://localhost:8000/:22
    load https://localhost:8000/:22
    onreadystatechange https://localhost:8000/:22
    request https://localhost:8000/:22
    load https://localhost:8000/:22
    loadToolbar https://localhost:8000/:22
    finishAjaxRequest https://localhost:8000/:22
    fetch https://localhost:8000/:22
    promise callback*window.fetch https://localhost:8000/:22
    <anonymous> https://localhost:8000/:16
    setTimeout handler* https://localhost:8000/:15
localhost:8000:22:344

How to reproduce

tl;dr: Create a controller that emits the Symfony-Debug-Toolbar-Replace header and perform an AJAX call to that controller.

Long version: use my reproducer that I've published on https://github.com/derrabus/wdt-reproducer

composer install
symfony serve

Then access the / route of the app.

Possible Solution

No response

Additional Context

The problem is gone if I downgrade only symfony/web-profiler-bundle to 5.3.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions