Popover can no longer be opened by setting open manually

[tom12993]

Check existing issues

• I have checked for existing issues to avoid duplicates

Actual Behavior

Programmatically setting a calcite-popover to open not working, when auto-close is set

Expected Behavior

calcite-popover should be responsive to the open prop being set

Reproduction Sample

https://codepen.io/tom12993/pen/vEBYoBx?editors=1011

Reproduction Steps

1. Within the codepen, click the red button and see that the popover opens
2. Change the version from 2.6.0 to any version after that, and notice that the red button no longer works

Reproduction Version

2.13.2

Relevant Info

OS: Windows 10
Browser: Google Chrome

Regression?

2.6.0

Priority impact

impact - p2 - want for an upcoming milestone

Impact

It's breaking an existing feature on most of our pages. There is a workaround by clicking a different button, but it's not apparent to users.

Calcite package

• @esri/calcite-components
• @esri/calcite-components-react
• @esri/calcite-design-tokens
• @esri/calcite-ui-icons
• @esri/eslint-plugin-calcite-components

Esri team

ArcGIS Monitor

[driskull]

This is because the autoClose is closing the popover since the referenceElement isn't being clicked.

To workaround this, you should be able to stopPropagation on the click of the button like so:

https://codepen.io/Matt-Driscoll/pen/LEPQaOG?editors=1011

We may be able to enhance this to stop autoClose when the event is prevented. cc @jcfranco for if we want to do that.

[tom12993]

To workaround this, you should be able to stopPropagation on the click of the button like so:

@driskull Thank you! That workaround looks promising. We'll give it a try

[driskull]

With the next 3.0.0-next.103 or later you should be able to call event.preventDefault() on the click event instead of event.stopPropagation()

[github-actions]

Installed and assigned for verification.