Prestashop 9 with hummingbird theme uncaught typeerror: can't access property "style"

[wigs]

I fresh installed prestashop 9, after a lot of trial and error it works but I get these css errors. Any idea how to fix them? I don't even know what's causing them/what should be happening instead of throwing the errors.

My shop's url is alegro.gr (used to be test.sixtir.gr)

Uncaught TypeError: can't access property "style", a is null
    as https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    as https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    as https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    <anonymous> https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    u https://test.sixtir.gr/themes/core.js:11
    l https://test.sixtir.gr/themes/core.js:11
    setTimeout handler*263/</Deferred/then/a/< https://test.sixtir.gr/themes/core.js:11
    c https://test.sixtir.gr/themes/core.js:11
    fireWith https://test.sixtir.gr/themes/core.js:11
    fire https://test.sixtir.gr/themes/core.js:11
    c https://test.sixtir.gr/themes/core.js:11
    fireWith https://test.sixtir.gr/themes/core.js:11
    ready https://test.sixtir.gr/themes/core.js:11
    Z https://test.sixtir.gr/themes/core.js:11
    263 https://test.sixtir.gr/themes/core.js:11
    263 https://test.sixtir.gr/themes/core.js:11
    263 https://test.sixtir.gr/themes/core.js:11
    a https://test.sixtir.gr/themes/core.js:15
    <anonymous> https://test.sixtir.gr/themes/core.js:15
    <anonymous> https://test.sixtir.gr/themes/core.js:289
    <anonymous> https://test.sixtir.gr/themes/core.js:289

 

Edited September 8 by wigs (see edit history)

[wigs]

I found out it's because my main menu (nav bar) has no dropdowns. The theme tries to edit the dropdown's style (show, hide) but the dropdown can't be found and this error is thrown. Simple bug.

[Mehdi Bourechka]

On 8/13/2025 at 12:29 PM, wigs said:

I fresh installed prestashop 9, after a lot of trial and error it works but I get these css errors. Any idea how to fix them? I don't even know what's causing them/what should be happening instead of throwing the errors.

My shop's url is https://test.sixtir.gr/

Uncaught TypeError: can't access property "style", a is null
    as https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    as https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    as https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    <anonymous> https://test.sixtir.gr/themes/hummingbird/assets/js/theme.js:63
    u https://test.sixtir.gr/themes/core.js:11
    l https://test.sixtir.gr/themes/core.js:11
    setTimeout handler*263/</Deferred/then/a/< https://test.sixtir.gr/themes/core.js:11
    c https://test.sixtir.gr/themes/core.js:11
    fireWith https://test.sixtir.gr/themes/core.js:11
    fire https://test.sixtir.gr/themes/core.js:11
    c https://test.sixtir.gr/themes/core.js:11
    fireWith https://test.sixtir.gr/themes/core.js:11
    ready https://test.sixtir.gr/themes/core.js:11
    Z https://test.sixtir.gr/themes/core.js:11
    263 https://test.sixtir.gr/themes/core.js:11
    263 https://test.sixtir.gr/themes/core.js:11
    263 https://test.sixtir.gr/themes/core.js:11
    a https://test.sixtir.gr/themes/core.js:15
    <anonymous> https://test.sixtir.gr/themes/core.js:15
    <anonymous> https://test.sixtir.gr/themes/core.js:289
    <anonymous> https://test.sixtir.gr/themes/core.js:289

 

This error happens because the Hummingbird theme tries to call .style on an element that doesn’t exist yet in the DOM.

Disable JS minification (in Advanced Parameters → Performance) to see which file throws the error, then wrap the selector like this:
 

const el = document.querySelector('selector');
if (el) {
  el.style.property = 'value';
}

[wigs]

On 8/20/2025 at 1:08 AM, Mehdi Bourechka said:

This error happens because the Hummingbird theme tries to call .style on an element that doesn’t exist yet in the DOM.

Disable JS minification (in Advanced Parameters → Performance) to see which file throws the error, then wrap the selector like this:
 

const el = document.querySelector('selector');
if (el) {
  el.style.property = 'value';
}

There is no minification choice in advanced parameters -> performance, at least not in my installation

Edited August 21 by wigs (see edit history)

[Mehdi Bourechka]

11 hours ago, wigs said:

There is no minification choice in advanced parameters -> performance, at least not in my installation

The Hummingbird theme is not yet stable on PrestaShop 9, which explains the error. For now, switch back to the default Classic theme. A stable update is planned by the end of September according to the last live session.

[wigs]

I tend to not cut off my hand when it hurts. Instead, the doctor fixes it.