Roots Discourse

Javascript wrong in yarn start (while correct in build or build:production)

Hi
I’ve a clean install of Sage 9.0.9, I simply added this code:

HTML in a page.blade.php tamplate

  <div class="container">
    <div class="h2-test">TEST TEST TEST</div>
  </div>

CSS in main.scss

.container {
  max-width: 80%;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  background: red;
}

JS in common.js

export default {
  init() {
    // JavaScript to be fired on all pages
  },
  finalize() {
    // JavaScript to be fired on all pages, after page specific JS is fired

    let slide_1 = document.querySelector('.h2-test');
    console.log(slide_1.offsetWidth);
  },
};

The console.log simply outputs the width of that element.
While using yarn start it outputs a wrong value
Instead with yarn build or yarn build:production the value is correct

Also, if I try to get a custom property from JS in yarn start it returns empty string while in build it works.

It seems an awful bug? How to solve?