thomas-lowry / figma-plugin-ds

A small lightweight design system for use in Figma Plugins
MIT License
700 stars 71 forks source link

SelectMenu: cannot read property 'classList' of null #21

Closed s-rd closed 4 years ago

s-rd commented 4 years ago

Hey! First of all, great job on making this awesome resource 👏

I'm having some issues with using the Select menu component in the way it's presented on the docs. I'm importing the whole figma-plugin-ds.min.js and then running the code in the docs to initialize, i.e.:

I'm doing this

selectMenu.init({
    position: 'positionToSelection' //other options: 'under', 'overlap'
});

The markup is also the same as in the docs:

<select name="" id="select-menu1" class="select-menu">
    <option value="1" selected="selected">Item 1</option>
    <option value="2" >Item 2</option>
</select>

Then I get this error

But when I do this, figma-plugin-ds.min.js is throwing this error:

Uncaught TypeError: Cannot read property 'classList' of null

This seems easy enough to work around, but I can't help but feel like I'm doing something silly :)

Has anyone else stumbled upon this issue? Or alternatively, does someone know how to initialize it properly?

s-rd commented 4 years ago

Apparently I was a bit too quick in making an issue for this 😅 Of course, I was initializing the selectMenu before the DOM had rendered completely, so it couldn't find anything.

So, if anyone stumbles upon this, it's fixed by making sure to wait for the HTML to render first!