fix(sbb-flip-card): use type button to avoid accidental form submissi…

…on (#3002)
sbb-design-systems · Aug 15, 2024 · 25dbd78 · 25dbd78
1 parent 941a569
commit 25dbd78
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/src/elements/flip-card/flip-card/__snapshots__/flip-card.snapshot.spec.snap.js b/src/elements/flip-card/flip-card/__snapshots__/flip-card.snapshot.spec.snap.js
@@ -77,6 +77,7 @@ snapshots["sbb-flip-card Shadow DOM"] =
   <button
     aria-expanded="false"
     class="sbb-flip-card-button"
+    type="button"
   >
     <sbb-screen-reader-only>
       Summary, Click on this card for details

diff --git a/src/elements/flip-card/flip-card/flip-card.ts b/src/elements/flip-card/flip-card/flip-card.ts
@@ -98,7 +98,11 @@ export class SbbFlipCardElement extends SbbHydrationMixin(LitElement) {
   protected override render(): TemplateResult {
     return html`
       <div class="sbb-flip-card">
-        <button class="sbb-flip-card-button" aria-expanded=${this._flipped.toString()}>
+        <button
+          class="sbb-flip-card-button"
+          aria-expanded=${this._flipped.toString()}
+          type="button"
+        >
           <sbb-screen-reader-only>${until(this._accessibilityLabel(), '')}</sbb-screen-reader-only>
         </button>
         <slot name="summary" @slotchange=${() => (this.summary!.inert = this._flipped)}></slot>