search

Esri / calcite-design-system

A monorepo containing the packages for Esri's Calcite Design System
https://developers.arcgis.com/calcite-design-system/
Other
293 stars 76 forks source link

CalciteTabNav throwing console.error on load #9057

Open nikki-lea opened 7 months ago

nikki-lea commented 7 months ago

Check existing issues

Actual Behavior

Console errors showing up on loading studio project

Expected Behavior

No console errors should appear

Reproduction Sample

Not reproducible outside studio

Reproduction Steps

  1. In studio, open a project and switch tabs
  2. Click the logo in the top left to navigate back to the landing page
  3. Open a project again
  4. Error may show in the console

Reproduction Version

2.7.1

Relevant Info

TypeError: Cannot read properties of undefined (reading 'getBoundingClientRect')
    at Array.eval (tab-nav.js:323:55)
    at consume (index.js:4130:21)
    at flush (index.js:4163:5) undefined

I confirm the error stops happening if I made the following changes:

  1. Add an optional check on tabTitleContainer on lines 319 & 321 here - https://github.com/Esri/calcite-design-system/blob/main/packages/calcite-components/src/components/tab-nav/tab-nav.tsx#L319
  2. Check that containerBounds is defined in the if statements conditions on line 330 & 337 in the above file

Regression?

No response

Priority impact

p4 - not time sensitive

Impact

No response

Calcite package

Esri team

ArcGIS Enterprise

nikki-lea commented 6 months ago

Apologies for the delay @jcfranco, I met with you regarding this issue and mentioned that I would provide a test server in which the error could be reproduced - it took us a while for our version of calcite to get updated in main to where the error is now reproducible! The test server that you can use is https://etait.esri.com/portal/apps/knowledge-studio/landing, the error should show up on opening any existing project listed. Note to devs: Please ping Nicole Bauer or Emma Tait for creds.

jcfranco commented 2 months ago

Belated thanks, @nikki-lea!

This issue occurs because tab-titles are activated during initialization and the tab-nav has not rendered before the tab-scrolling logic takes place.

jcfranco commented 2 months ago

This might benefit from https://github.com/Esri/calcite-design-system/issues/10310, so I'd like to propose holding this off until that's landed.

@nikki-lea confirmed that the updated timeline should be fine.

github-actions[bot] commented 2 months ago

cc @geospatialem, @brittneytewks