Fix initial value in type selectbox

[fuelen]

solves issue in the comment
#123 (comment)

[DavidMStraub]

Thanks for the fix! Still, I'd like to avoid not rendering the entire component during loading data, which could take seconds. I hope we can find a workaround.

[fuelen]

Spinner? :)
I think it should be absent by default, as most of the loadings are very fast. If we definitely know that loading is time-consuming for some element, then spinner should be toggled explicitly using some option

[fuelen]

Hey @DavidMStraub

Do you have other ideas?
What is the downside of not rendering the component during loading data? Is it solely UX issue?

[DavidMStraub]

Hi, sorry for not making progress on this. Yes, I would like to avoid elements popping up when something has loaded. In principle, the "Loading items..." text was a reasonable loading state IMO, but as you found out it causes problems with the label when the mwc-select is loaded too early. I think it's a bug in the material web components library. Alternatively, we could think about using something like the <span class="skeleton"> animation that is used in some places now.

[fuelen]

@DavidMStraub I've updated a PR, please take a look

[DavidMStraub]

Thanks! Just to understand, which part of it actually fixes the overlapping label? Is it that you select the mwc-select to disabled when loadingTypes is True?

[fuelen]

@DavidMStraub Honestly, I don't have a strong opinion why the fix works 😄 disabled attribute is a cosmetic change only, the fix works even if I hardcode disabled to false.
I noticed, that for some select components, loadingTypes was always false if I print it in render function. But, I tried to synchronize it with types and got the expected result.