mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-16 10:51:06 +00:00
Code Issues Projects Releases Packages Wiki Activity

test(inline-loading): add unit tests

Browse source
This commit is contained in:
Eric Liu 2025-03-16 12:06:02 -07:00
commit c64608e89f
3 changed files with 183 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

57
tests/InlineLoading/InlineLoading.test.svelte Normal file
View file

@ -0,0 +1,57 @@
<script lang="ts">
import { InlineLoading } from "carbon-components-svelte";
</script>
<!-- Default inline loading -->
<div data-testid="default-loader">
<InlineLoading />
</div>
<!-- Inline loading with description -->
<div data-testid="loader-with-description">
<InlineLoading description="Loading metrics..." />
</div>
<!-- Inline loading with different states -->
<div data-testid="loader-active">
<InlineLoading status="active" description="Submitting..." />
</div>
<div data-testid="loader-inactive">
<InlineLoading status="inactive" description="Cancelling..." />
</div>
<div data-testid="loader-finished">
<InlineLoading
status="finished"
description="Success"
on:success={() => {
console.log("success");
}}
/>
</div>
<!-- Inline loading with custom success delay -->
<div data-testid="loader-custom-success-delay">
<InlineLoading
status="finished"
description="Processing..."
successDelay={500}
on:success={() => {
console.log("success custom delay");
}}
/>
</div>
<div data-testid="loader-error">
<InlineLoading status="error" description="An error occurred" />
</div>
<!-- Inline loading with custom icon description -->
<div data-testid="loader-custom-icon">
<InlineLoading
status="finished"
description="Complete"
iconDescription="Operation completed successfully"
/>
</div>