mirror of https://github.com/sveltejs/svelte
commit
214f8992d6
@ -0,0 +1,5 @@
|
||||
---
|
||||
"svelte": patch
|
||||
---
|
||||
|
||||
fix: ensure reactions are kept dirty when marking them again
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
"svelte": patch
|
||||
---
|
||||
|
||||
fix: apply modifiers to bubbled events
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
"svelte": patch
|
||||
---
|
||||
|
||||
fix: allow `bind:this` on `<select>` with dynamic `multiple` attribute
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
"svelte": patch
|
||||
---
|
||||
|
||||
feat: allow for literal property definition with state on classes
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
"svelte": patch
|
||||
---
|
||||
|
||||
feat: leave view transition pseudo selectors untouched
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
"svelte": patch
|
||||
---
|
||||
|
||||
fix: ensure store from props is hoisted correctly
|
||||
@ -0,0 +1,3 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({});
|
||||
@ -0,0 +1,9 @@
|
||||
|
||||
@starting-style {
|
||||
.card.svelte-xyz{
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
.card.svelte-xyz {
|
||||
color: red;
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
<div class="card"></div>
|
||||
|
||||
<style>
|
||||
@starting-style {
|
||||
.card{
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
.card {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,16 @@
|
||||
|
||||
::view-transition {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-group(foo) {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-old {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-new {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-image-pair {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
@ -0,0 +1,17 @@
|
||||
<style>
|
||||
::view-transition {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-group(foo) {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-old {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-new {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
::view-transition-image-pair {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,12 @@
|
||||
import { ok, test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, component, target }) {
|
||||
const button = target.querySelector('button');
|
||||
ok(button);
|
||||
|
||||
await button.click();
|
||||
|
||||
assert.ok(component.default_was_prevented);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1 @@
|
||||
<button on:click|preventDefault>click me</button>
|
||||
@ -0,0 +1,11 @@
|
||||
<script>
|
||||
import Button from "./button.svelte";
|
||||
|
||||
export let default_was_prevented;
|
||||
|
||||
function handle_click(event) {
|
||||
default_was_prevented = event.defaultPrevented;
|
||||
}
|
||||
</script>
|
||||
|
||||
<Button on:click={handle_click} />
|
||||
@ -0,0 +1,15 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
html: `<button>false</button>`,
|
||||
|
||||
async test({ assert, target }) {
|
||||
const btn = target.querySelector('button');
|
||||
|
||||
await btn?.click();
|
||||
assert.htmlEqual(target.innerHTML, `<button>true</button>`);
|
||||
|
||||
await btn?.click();
|
||||
assert.htmlEqual(target.innerHTML, `<button>false</button>`);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,12 @@
|
||||
<script>
|
||||
class Toggle {
|
||||
"aria-pressed" = $state(false);
|
||||
|
||||
toggle(){
|
||||
this["aria-pressed"] = !this["aria-pressed"]
|
||||
}
|
||||
}
|
||||
const toggle = new Toggle();
|
||||
</script>
|
||||
|
||||
<button on:click={() => toggle.toggle()}>{toggle["aria-pressed"]}</button>
|
||||
@ -0,0 +1,8 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target }) {
|
||||
await target.querySelector('button')?.click();
|
||||
assert.htmlEqual(target.innerHTML, `<button>0</button>`);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,13 @@
|
||||
<script>
|
||||
let x = $state(1);
|
||||
let y = $state(1);
|
||||
let z = $derived(x*y);
|
||||
</script>
|
||||
|
||||
<button onclick={() => {
|
||||
x = 0;
|
||||
// reading a derived value and then setting another source contributing to the derived
|
||||
// resulting in the same value should not prevent pending render effects from updating
|
||||
z;
|
||||
y = 0;
|
||||
}}>{z}</button>
|
||||
@ -0,0 +1,18 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
compileOptions: {
|
||||
dev: true
|
||||
},
|
||||
async test({ assert, target }) {
|
||||
const button = target.querySelector('button');
|
||||
await button?.click();
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>1</button>
|
||||
`
|
||||
);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,8 @@
|
||||
<script>
|
||||
const { attrs } = $props();
|
||||
function increment() {
|
||||
$attrs.count++;
|
||||
}
|
||||
</script>
|
||||
|
||||
<button onclick={increment}>{$attrs.count}</button>
|
||||
@ -0,0 +1,7 @@
|
||||
<script>
|
||||
import { writable } from "svelte/store";
|
||||
import Child from "./child.svelte";
|
||||
const attrs = writable({ count: 0 });
|
||||
</script>
|
||||
|
||||
<Child {attrs} />
|
||||
Loading…
Reference in new issue