update to use :popover-open to toggle shown popover

microsoft · Aug 28, 2024 · 829f8ed · 829f8ed
1 parent 6ba6f49
commit 829f8ed
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/packages/web-components/src/button/button.stories.ts b/packages/web-components/src/button/button.stories.ts
@@ -225,5 +225,5 @@ export const Popover: Story<FluentButton> = renderComponent(html<StoryArgs<Fluen
   <fluent-button popovertarget="foo" popovertargetaction="show">Show Popover</fluent-button>
   <fluent-button popovertarget="foo" popovertargetaction="hide">Hide Popover</fluent-button>
   <fluent-button popovertarget="foo" popovertargetaction="toggle">Toggle Popover</fluent-button>
-  <div id="foo" popover open>This is a popover</div>
+  <div id="foo" popover>This is a popover</div>
 `);
diff --git a/packages/web-components/src/button/button.ts b/packages/web-components/src/button/button.ts
@@ -307,7 +307,7 @@ export class BaseButton extends FASTElement {
         case 'toggle':
         default:
           // @ts-expect-error - Baseline 2024
-          this.popoverTargetElement?.togglePopover(!this.popoverOpen);
+          this.popoverTargetElement?.togglePopover(this.popoverTargetElement?.matches(':popover-open'));
           break;
       }
     }