Skip to content

Commit

Permalink
tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@huntabyte
huntabyte committed Dec 10, 2024
1 parent e618466 commit 69c8178
Show file tree
Hide file tree
Showing 7 changed files with 279 additions and 432 deletions.
76 changes: 31 additions & 45 deletions packages/tests/src/tests/combobox/combobox-force-mount-test.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,32 @@
);
</script>

{#snippet Content({
props,
wrapperProps,
}: {
props: Record<string, unknown>;
wrapperProps: Record<string, unknown>;
})}
<div {...wrapperProps}>
<div {...props}>
<Combobox.Group data-testid="group">
<Combobox.GroupHeading data-testid="group-label">Options</Combobox.GroupHeading>
{#each filteredItems as { value, label, disabled }}
<Combobox.Item data-testid={value} {disabled} {value} {label}>
{#snippet children({ selected, highlighted: _highlighted })}
{#if selected}
<span data-testid="{value}-indicator">x</span>
{/if}
{label}
{/snippet}
</Combobox.Item>
{/each}
</Combobox.Group>
</div>
</div>
{/snippet}

<main data-testid="main">
<Combobox.Root
type="single"
Expand All @@ -66,56 +92,16 @@
<Combobox.Portal {...portalProps}>
{#if withOpenCheck}
<Combobox.Content data-testid="content" {...contentProps} forceMount>
{#snippet child({ props, open })}
{#if open}
<div {...props}>
<Combobox.Group data-testid="group">
<Combobox.GroupHeading data-testid="group-label"
>Options</Combobox.GroupHeading
>
{#each filteredItems as { value, label, disabled }}
<Combobox.Item
data-testid={value}
{disabled}
{value}
{label}
>
{#snippet children({
selected,
highlighted: _highlighted,
})}
{#if selected}
<span data-testid="{value}-indicator">x</span>
{/if}
{label}
{/snippet}
</Combobox.Item>
{/each}
</Combobox.Group>
</div>
{#snippet child(props)}
{#if props.open}
{@render Content(props)}
{/if}
{/snippet}
</Combobox.Content>
{:else}
<Combobox.Content data-testid="content" {...contentProps} forceMount>
{#snippet child({ props, open: _open })}
<div {...props}>
<Combobox.Group data-testid="group">
<Combobox.GroupHeading data-testid="group-label"
>Options</Combobox.GroupHeading
>
{#each filteredItems as { value, label, disabled }}
<Combobox.Item data-testid={value} {disabled} {value} {label}>
{#snippet children({ selected, highlighted: _highlighted })}
{#if selected}
<span data-testid="{value}-indicator">x</span>
{/if}
{label}
{/snippet}
</Combobox.Item>
{/each}
</Combobox.Group>
</div>
{#snippet child(props)}
{@render Content(props)}
{/snippet}
</Combobox.Content>
{/if}
Expand Down
233 changes: 80 additions & 153 deletions packages/tests/src/tests/context-menu/context-menu-force-mount-test.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,81 @@
}: ContextMenuForceMountTestProps = $props();
</script>

{#snippet Content({
props,
wrapperProps,
}: {
props: Record<string, unknown>;
wrapperProps: Record<string, unknown>;
})}
<div {...wrapperProps}>
<div {...props}>
<ContextMenu.Separator data-testid="separator" />
<ContextMenu.Group data-testid="group">
<ContextMenu.GroupHeading data-testid="group-heading">
Stuff
</ContextMenu.GroupHeading>
<ContextMenu.Item data-testid="item">
<span>item</span>
</ContextMenu.Item>
</ContextMenu.Group>

<ContextMenu.Sub>
<ContextMenu.SubTrigger data-testid="sub-trigger">
<span>subtrigger</span>
</ContextMenu.SubTrigger>
<ContextMenu.SubContent data-testid="sub-content">
<ContextMenu.Item data-testid="sub-item">
<span>Email</span>
</ContextMenu.Item>
<ContextMenu.CheckboxItem
bind:checked={subChecked}
data-testid="sub-checkbox-item"
>
{#snippet children({ checked, indeterminate: _indeterminate })}
<span data-testid="sub-checkbox-indicator">
{checked}
</span>
sub checkbox
{/snippet}
</ContextMenu.CheckboxItem>
</ContextMenu.SubContent>
</ContextMenu.Sub>
<ContextMenu.Item disabled data-testid="disabled-item">disabled item</ContextMenu.Item>
<ContextMenu.Item disabled data-testid="disabled-item-2"
>disabled item 2</ContextMenu.Item
>
<ContextMenu.CheckboxItem bind:checked data-testid="checkbox-item">
{#snippet children({ checked, indeterminate: _indeterminate })}
<span data-testid="checkbox-indicator">
{checked}
</span>
Checkbox Item
{/snippet}
</ContextMenu.CheckboxItem>
<ContextMenu.Item data-testid="item-2">item 2</ContextMenu.Item>
<ContextMenu.RadioGroup bind:value={radio} data-testid="radio-group">
<ContextMenu.RadioItem value="1" data-testid="radio-item">
{#snippet children({ checked })}
<span data-testid="radio-indicator-1">
{checked}
</span>
<span>Radio Item 1</span>
{/snippet}
</ContextMenu.RadioItem>
<ContextMenu.RadioItem value="2" data-testid="radio-item-2">
{#snippet children({ checked })}
<span data-testid="radio-indicator-2">
{checked}
</span>
<span>Radio Item 2</span>
{/snippet}
</ContextMenu.RadioItem>
</ContextMenu.RadioGroup>
</div>
</div>
{/snippet}

<main>
<div data-testid="outside">outside</div>
<div data-testid="non-portal-container">
Expand All @@ -41,164 +116,16 @@
<ContextMenu.Portal {...portalProps}>
{#if withOpenCheck}
<ContextMenu.Content {...contentProps} data-testid="content" forceMount>
{#snippet child({ props, open })}
{#if open}
<div {...props}>
<ContextMenu.Separator data-testid="separator" />
<ContextMenu.Group data-testid="group">
<ContextMenu.GroupHeading data-testid="group-heading">
Stuff
</ContextMenu.GroupHeading>
<ContextMenu.Item data-testid="item">
<span>item</span>
</ContextMenu.Item>
</ContextMenu.Group>

<ContextMenu.Sub>
<ContextMenu.SubTrigger data-testid="sub-trigger">
<span>subtrigger</span>
</ContextMenu.SubTrigger>
<ContextMenu.SubContent data-testid="sub-content">
<ContextMenu.Item data-testid="sub-item">
<span>Email</span>
</ContextMenu.Item>
<ContextMenu.CheckboxItem
bind:checked={subChecked}
data-testid="sub-checkbox-item"
>
{#snippet children({
checked,
indeterminate: _indeterminate,
})}
<span data-testid="sub-checkbox-indicator">
{checked}
</span>
sub checkbox
{/snippet}
</ContextMenu.CheckboxItem>
</ContextMenu.SubContent>
</ContextMenu.Sub>
<ContextMenu.Item disabled data-testid="disabled-item"
>disabled item</ContextMenu.Item
>
<ContextMenu.Item disabled data-testid="disabled-item-2"
>disabled item 2</ContextMenu.Item
>
<ContextMenu.CheckboxItem
bind:checked
data-testid="checkbox-item"
>
{#snippet children({
checked,
indeterminate: _indeterminate,
})}
<span data-testid="checkbox-indicator">
{checked}
</span>
Checkbox Item
{/snippet}
</ContextMenu.CheckboxItem>
<ContextMenu.Item data-testid="item-2">item 2</ContextMenu.Item>
<ContextMenu.RadioGroup
bind:value={radio}
data-testid="radio-group"
>
<ContextMenu.RadioItem value="1" data-testid="radio-item">
{#snippet children({ checked })}
<span data-testid="radio-indicator-1">
{checked}
</span>
<span>Radio Item 1</span>
{/snippet}
</ContextMenu.RadioItem>
<ContextMenu.RadioItem value="2" data-testid="radio-item-2">
{#snippet children({ checked })}
<span data-testid="radio-indicator-2">
{checked}
</span>
<span>Radio Item 2</span>
{/snippet}
</ContextMenu.RadioItem>
</ContextMenu.RadioGroup>
</div>
{#snippet child(props)}
{#if props.open}
{@render Content(props)}
{/if}
{/snippet}
</ContextMenu.Content>
{:else}
<ContextMenu.Content {...contentProps} data-testid="content" forceMount>
{#snippet child({ props, open: _open })}
<div {...props}>
<ContextMenu.Separator data-testid="separator" />
<ContextMenu.Group data-testid="group">
<ContextMenu.GroupHeading data-testid="group-heading">
Stuff
</ContextMenu.GroupHeading>
<ContextMenu.Item data-testid="item">
<span>item</span>
</ContextMenu.Item>
</ContextMenu.Group>

<ContextMenu.Sub>
<ContextMenu.SubTrigger data-testid="sub-trigger">
<span>subtrigger</span>
</ContextMenu.SubTrigger>
<ContextMenu.SubContent data-testid="sub-content">
<ContextMenu.Item data-testid="sub-item">
<span>Email</span>
</ContextMenu.Item>
<ContextMenu.CheckboxItem
bind:checked={subChecked}
data-testid="sub-checkbox-item"
>
{#snippet children({
checked,
indeterminate: _indeterminate,
})}
<span data-testid="sub-checkbox-indicator">
{checked}
</span>
sub checkbox
{/snippet}
</ContextMenu.CheckboxItem>
</ContextMenu.SubContent>
</ContextMenu.Sub>
<ContextMenu.Item disabled data-testid="disabled-item"
>disabled item</ContextMenu.Item
>
<ContextMenu.Item disabled data-testid="disabled-item-2"
>disabled item 2</ContextMenu.Item
>
<ContextMenu.CheckboxItem bind:checked data-testid="checkbox-item">
{#snippet children({ checked, indeterminate: _indeterminate })}
<span data-testid="checkbox-indicator">
{checked}
</span>
Checkbox Item
{/snippet}
</ContextMenu.CheckboxItem>
<ContextMenu.Item data-testid="item-2">item 2</ContextMenu.Item>
<ContextMenu.RadioGroup
bind:value={radio}
data-testid="radio-group"
>
<ContextMenu.RadioItem value="1" data-testid="radio-item">
{#snippet children({ checked })}
<span data-testid="radio-indicator-1">
{checked}
</span>
<span>Radio Item 1</span>
{/snippet}
</ContextMenu.RadioItem>
<ContextMenu.RadioItem value="2" data-testid="radio-item-2">
{#snippet children({ checked })}
<span data-testid="radio-indicator-2">
{checked}
</span>
<span>Radio Item 2</span>
{/snippet}
</ContextMenu.RadioItem>
</ContextMenu.RadioGroup>
</div>
{#snippet child(props)}
{@render Content(props)}
{/snippet}
</ContextMenu.Content>
{/if}
Expand Down
Loading

0 comments on commit 69c8178

Please sign in to comment.