Skip to content

[Bug] tab-nav: selectedTitle property has incorrect value when calciteTabChange event is emitted #6299

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
jmanke opened this issue Jan 17, 2023 · 6 comments
Closed

[Bug] tab-nav: selectedTitle property has incorrect value when calciteTabChange event is emitted #6299

jmanke opened this issue Jan 17, 2023 · 6 comments
Assignees
@geospatialem
Labels
4 - verified Issues that have been tested, confirmed as mitigated, and are ready to close. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. estimate - 5 A few days of work, definitely requires updates to tests. has workaround Issues have a workaround available in the meantime. p - high Issue should be addressed in the current milestone, impacts component or core functionality
Milestone
2023 May Priorities

Comments

@jmanke
Copy link

jmanke commented Jan 17, 2023 •
edited by alisonailea
Loading

Actual Behavior

When the calciteTabChange event is emitted, the selectedTitle property does not correctly reflect the currently selected calcite-tab-title.
212974955-6dae9978-7f74-42ef-a850-b927965f9707

Expected Behavior

When the calciteTabChange event is emitted, the selectedTitle property should reflect the currently selected calcite-tab-title.

Reproduction Sample

https://codepen.io/jmanke/pen/NWBayKv?editors=1011

Reproduction Steps

  1. Open the console.
  2. Click on a calicte-tab-title
  3. Observe the previous calcite-tab-title will be the value of selectedTitle. See JS code for more details.

Reproduction Version

next.726

Relevant Info

Chrome 108

Regression?

No response

Impact

Low
Workaround is to use the calciteTabsActivate event on the calcite-tab-title.

Esri team

ArcGIS Dashboard
@jmanke jmanke added 0 - new New issues that need assignment. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. needs triage Planning workflow - pending design/dev review. labels Jan 17, 2023
@github-actions github-actions bot added the ArcGIS Dashboards Issues logged by ArcGIS Dashboards team members. label Jan 17, 2023
@jmanke jmanke changed the title tab-nav: selectedTitle property has incorrect value when calciteTabChange event is emitted [Bug] tab-nav: selectedTitle property has incorrect value when calciteTabChange event is emitted Jan 17, 2023
@jcfranco jcfranco added the has workaround Issues have a workaround available in the meantime. label Jan 25, 2023
@alisonailea alisonailea changed the title [Bug] tab-nav: selectedTitle property has incorrect value when calciteTabChange event is emitted [Bug] tab-nav: selectedTitle property has incorrect value when calciteTabChange event is emitted Feb 12, 2023
@alisonailea alisonailea added airtable and removed ArcGIS Dashboards Issues logged by ArcGIS Dashboards team members. airtable labels Feb 12, 2023
@geospatialem
Copy link
Member

This also came up with members of the JS team, and adding a higher priority with a few pings on this issue for issue triaging.

Workaround: https://codepen.io/geospatialem/pen/gOdBzXx

@geospatialem geospatialem added p - high Issue should be addressed in the current milestone, impacts component or core functionality p - medium Issue is non core or affecting less that 60% of people using the library and removed p - high Issue should be addressed in the current milestone, impacts component or core functionality labels Mar 21, 2023
@geospatialem geospatialem added the estimate - 3 A day or two of work, likely requires updates to tests. label Mar 30, 2023
@geospatialem
Copy link
Member

Related:#6362

@geospatialem geospatialem added estimate - 5 A few days of work, definitely requires updates to tests. p - high Issue should be addressed in the current milestone, impacts component or core functionality and removed needs triage Planning workflow - pending design/dev review. estimate - 3 A day or two of work, likely requires updates to tests. p - medium Issue is non core or affecting less that 60% of people using the library labels Apr 4, 2023
@geospatialem geospatialem added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 0 - new New issues that need assignment. labels Apr 4, 2023
@geospatialem
Copy link
Member

Reallocated to the upcoming May milestone.

@jcfranco
Copy link
Member

This issue is caused by different parts in the tab-selection workflow being both synchronous and asynchronous:

  1. [tab-title] tab is selected and events used to update selected tab are emitted
  2. [tab-nav] calciteTabChange event is emitted (sync) ⚠️
  3. [tab-nav] selected tab ID is updated (sync)
  4. [tab-nav] selected title is set (async) ⚠️
  5. [tab] selected tab is set (async)

@jcfranco jcfranco added 2 - in development Issues that are actively being worked on. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels May 19, 2023
@jcfranco jcfranco mentioned this issue May 22, 2023
Merged
jcfranco added a commit that referenced this issue May 22, 2023
@jcfranco
fix(tab-nav): ensure selected title is set when tab change event is e…
1fd5b9b 
…mitted (#6986)

**Related Issue:** #6299

## Summary

This updates public tab selection events to emit in the next frame to
allow internal eventing and state to be set beforehand.
@jcfranco jcfranco added 3 - installed Issues that have been merged to the "dev" branch and/or are ready for QA/QC. and removed 2 - in development Issues that are actively being worked on. labels May 22, 2023
@github-actions
Copy link
Contributor

Installed and assigned for verification.

@geospatialem geospatialem added 4 - verified Issues that have been tested, confirmed as mitigated, and are ready to close. and removed 3 - installed Issues that have been merged to the "dev" branch and/or are ready for QA/QC. labels May 22, 2023
@geospatialem
Copy link
Member

Verified on master.

verify-tab-selection

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@geospatialem geospatialem

Labels
4 - verified Issues that have been tested, confirmed as mitigated, and are ready to close. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. estimate - 5 A few days of work, definitely requires updates to tests. has workaround Issues have a workaround available in the meantime. p - high Issue should be addressed in the current milestone, impacts component or core functionality
Projects
None yet
Milestone
2023 May Priorities
Development

No branches or pull requests
4 participants
@jcfranco @alisonailea @geospatialem @jmanke