Pico not mounting

[patrickbjohnson]

Attempting to use Pico as the script/module manager for a WP site.
But for some reason when adding a basic component into picoapp it's not executing the script.

Can confirm scripts are being loaded correctly and exist within all code contents which are being compiled via webpack.

Main JS

import { picoapp } from 'picoapp'
import slider from './slider'

const app = picoapp({ slider })
app.mount()

Component JS

import { component } from 'picoapp'
export default component((node, ctx) => {
  console.log(node, 'mounted on slider')

  return (node) => {
    console.log('ran foo!')
  }
})

Slider Twig File

<section class="billboard-block"  data-component="slider">
 Test Slider Content
</section>

[patrickbjohnson]

SOLUTION BELOW
Realized the script was being added in the head of the document, thus running and parsing before the DOM completely loaded.

SOLUTION

import { picoapp } from 'picoapp'
import slider from './slider'

const app = picoapp({ slider })

window.addEventListener('DOMContentLoaded', (event) => {
  app.mount()
})

Note, wrapped the mount method in DOMContentLoaded