From a4db72c5694cf60eb1f858501a6dafb18e9250d2 Mon Sep 17 00:00:00 2001
From: Ben Elan <no-reply@benelan.dev>
Date: Tue, 18 Jul 2023 12:22:43 -0700
Subject: [PATCH] test(block): disable loader animation in chromatic snapshots

---
 .../src/components/block/block.stories.ts         | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/packages/calcite-components/src/components/block/block.stories.ts b/packages/calcite-components/src/components/block/block.stories.ts
index 5f100f674a1..ffffc2662ce 100644
--- a/packages/calcite-components/src/components/block/block.stories.ts
+++ b/packages/calcite-components/src/components/block/block.stories.ts
@@ -218,6 +218,11 @@ export const contentSpacing_TestOnly = (): string =>
 
 export const loadingWithSlottedIcon_TestOnly = (): string =>
   html`
+    <style>
+      :root {
+        --calcite-duration-factor: 0;
+      }
+    </style>
     <calcite-block collapsible open loading heading="Layer effects" description="Adjust blur">
       <calcite-icon scale="s" slot="icon" icon="effects"></calcite-icon>
       <calcite-notice open>
@@ -228,6 +233,11 @@ export const loadingWithSlottedIcon_TestOnly = (): string =>
 
 export const loadingWithNoStatusNorSlottedIcon_TestOnly = (): string =>
   html`
+    <style>
+      :root {
+        --calcite-duration-factor: 0;
+      }
+    </style>
     <calcite-block collapsible open loading heading="Layer effects" description="Adjust blur">
       <calcite-notice open>
         <div slot="message">Use layer effects sparingly</div>
@@ -237,6 +247,11 @@ export const loadingWithNoStatusNorSlottedIcon_TestOnly = (): string =>
 
 export const loadingWithStatusIcon_TestOnly = (): string =>
   html`
+    <style>
+      :root {
+        --calcite-duration-factor: 0;
+      }
+    </style>
     <calcite-block loading heading="Valid status" description="summary" collapsible status="valid">
       <calcite-input icon="form-field" placeholder="This is valid input field"></calcite-input>
     </calcite-block>