Esri / calcite-design-system

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

Calcite-button - setting `disabled: false` on a button after its creation causes other (unrelated) disabled buttons to again respond to click events in Firefox #9565

Closed iyouth23 closed 1 day ago

iyouth23 commented 2 weeks ago

Check existing issues

Actual Behavior

When multiple calcite-buttons lie at the same DOM level, setting disabled = false programmatically to one button causes all other neighboring calcite-buttons, regardless of their own disabled setting, to start responding to onClick() events again.

This issue is in a similar vein to https://github.com/Esri/calcite-design-system/issues/8729. It only occurs in Firefox.

Expected Behavior

Setting one calcite-button's disabled attribute should not affect other, unrelated buttons' event responses.

Reproduction Sample

https://codepen.io/iyouth66/pen/ZENXMNx?editors=1000

Reproduction Steps

  1. Open the provided codepen in Firefox.
  2. Open DevTools.
  3. Click the "Test 3" button to reenable the "Test 2" button.
  4. Now click the "Test 1" button. Even though it is disabled, see that it responds to the onClick() event and prints a message in the console.
  5. Uncomment the div tags where necessary. Observe that the problem no longer occurs.

Reproduction Version

2.9.0

Relevant Info

Not a regression.

cc @geospatialem

Regression?

No response

Priority impact

impact - p3 - not time sensitive

Impact

AGOL Map Viewer has buttons that lie at the same DOM level that are enabled/disabled programmatically. These buttons encounter this issue.

Calcite package

Esri team

ArcGIS Online

kstinson14 commented 1 week ago

Also running into this issue in Field Maps.

github-actions[bot] commented 4 days ago

Installed and assigned for verification.

geospatialem commented 1 day ago

Verified in 2.10.2-next.0 with Firefox and Chrome browsers.