Calcite Tabs creating ResizeObserver type error during DOM rendering (v1.0.0-beta.99)

[FC_Basson]

I need some clarity on the TypeError being generated for Calcite Tabs.

It seems the error is generated during the DOM rendering when the tabs are not directly visible in the DOM body, but instead in a parent element such as a calcite-panel.  

The line in the module where the error occurs upon creating a new class reads as follows:

this.activeIndicatorEl.style.transitionDuration = "0s"

 It seems as if the "activeIndicatorEl" property is not found.

I have created a CodePen (https://codepen.io/fcbasson/pen/KKByZzV) with two sets of tabs, of which one is within a panel.  Have a look at the browser console when the DOM is rendered to see the errors popping up.

[BenElan]

Hi @FC_Basson, I was able to reproduce the error and logged a bug:

https://github.com/Esri/calcite-components/issues/6310

Thanks for reporting the issue!

[LefterisKoumis]

Thank you. I have the same error and I spent hours to resolve it thinking that it is an issue with my script. 

Also I noticed performance issues.

[BenElan]

Update: this issue is resolved in v1.0.4-next.4

We will be releasing a patch soon, potentially tomorrow

[KittyHurley]

@FC_Basson, @LefterisKoumis Thanks again for reporting!

The issue has been mitigated in both patch releases this week, 1.0.4 and 1.0.5.

[WilsonIonara]

I am having the same issue. How do I find and install the patch? Thanks

[LefterisKoumis]

@WilsonIonara There is nothing to install. Just update the links to the calcite components to version 1.0.4 or later.

    <script type="module" src="https://js.arcgis.com/calcite-components/1.0.4/calcite.esm.js"></script>
    <link rel="stylesheet" type="text/css" href="https://js.arcgis.com/calcite-components/1.0.4/calcite.css" />

[WilsonIonara]

Since I am using a node package I just changed the stylesheet and it seems to be working! Thank you!