mirror of https://github.com/sveltejs/svelte
Pontus Lundin
5 years ago
commit
55559e6523
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,14 @@
|
||||
import { Node } from 'estree';
|
||||
|
||||
export default function replace_object(node: Node, replacement: Node) {
|
||||
if (node.type === 'Identifier') return replacement;
|
||||
|
||||
const ancestor = node;
|
||||
let parent;
|
||||
while (node.type === 'MemberExpression') {
|
||||
parent = node;
|
||||
node = node.object;
|
||||
}
|
||||
parent.object = replacement;
|
||||
return ancestor;
|
||||
}
|
||||
@ -0,0 +1,59 @@
|
||||
/* generated by Svelte vX.Y.Z */
|
||||
import {
|
||||
SvelteComponent,
|
||||
detach,
|
||||
element,
|
||||
init,
|
||||
insert,
|
||||
listen,
|
||||
noop,
|
||||
safe_not_equal
|
||||
} from "svelte/internal";
|
||||
|
||||
function create_fragment(ctx) {
|
||||
let button;
|
||||
let mounted;
|
||||
let dispose;
|
||||
|
||||
return {
|
||||
c() {
|
||||
button = element("button");
|
||||
},
|
||||
m(target, anchor) {
|
||||
insert(target, button, anchor);
|
||||
|
||||
if (!mounted) {
|
||||
dispose = listen(button, "click", /*click_handler*/ ctx[1]);
|
||||
mounted = true;
|
||||
}
|
||||
},
|
||||
p: noop,
|
||||
i: noop,
|
||||
o: noop,
|
||||
d(detaching) {
|
||||
if (detaching) detach(button);
|
||||
mounted = false;
|
||||
dispose();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function instance($$self, $$props, $$invalidate) {
|
||||
let foo;
|
||||
|
||||
function unreferenced() {
|
||||
$$invalidate(0, foo = 1);
|
||||
}
|
||||
|
||||
const click_handler = () => $$invalidate(0, foo = 2);
|
||||
return [foo, click_handler];
|
||||
}
|
||||
|
||||
class Component extends SvelteComponent {
|
||||
constructor(options) {
|
||||
super();
|
||||
init(this, options, instance, create_fragment, safe_not_equal, {});
|
||||
}
|
||||
}
|
||||
|
||||
export default Component;
|
||||
@ -0,0 +1,7 @@
|
||||
<script>
|
||||
let foo;
|
||||
function unreferenced () {
|
||||
foo = 1;
|
||||
}
|
||||
</script>
|
||||
<button on:click={() => foo = 2}></button>
|
||||
@ -0,0 +1,10 @@
|
||||
{
|
||||
"code": "css-syntax-error",
|
||||
"message": ":global() must contain a selector",
|
||||
"start": {
|
||||
"line": 2,
|
||||
"column": 1,
|
||||
"character": 9
|
||||
},
|
||||
"pos": 9
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
<style>
|
||||
:global {}
|
||||
</style>
|
||||
@ -0,0 +1,81 @@
|
||||
export default {
|
||||
html: `
|
||||
<p>Checked: </p>
|
||||
|
||||
<hr>
|
||||
|
||||
<input type='checkbox' value='a'>a<br>
|
||||
<input type='checkbox' value='b'>b<br>
|
||||
<input type='checkbox' value='c'>c<br>
|
||||
<input type='checkbox' value='d'>d<br>
|
||||
|
||||
<hr>
|
||||
|
||||
<input type='checkbox' value='a'>a<br>
|
||||
<input type='checkbox' value='b'>b<br>
|
||||
<input type='checkbox' value='c'>c<br>
|
||||
<input type='checkbox' value='d'>d<br>
|
||||
`,
|
||||
|
||||
async test({ assert, component, target, window }) {
|
||||
const inputs = target.querySelectorAll("input");
|
||||
const p = target.querySelector("p");
|
||||
|
||||
assert.equal(inputs[0].checked, false);
|
||||
assert.equal(inputs[1].checked, false);
|
||||
assert.equal(inputs[2].checked, false);
|
||||
assert.equal(inputs[3].checked, false);
|
||||
|
||||
assert.equal(inputs[4].checked, false);
|
||||
assert.equal(inputs[5].checked, false);
|
||||
assert.equal(inputs[6].checked, false);
|
||||
assert.equal(inputs[7].checked, false);
|
||||
|
||||
const event = new window.Event("change");
|
||||
|
||||
inputs[0].checked = true;
|
||||
await inputs[0].dispatchEvent(event);
|
||||
|
||||
assert.htmlEqual(p.innerHTML, `Checked: a`);
|
||||
|
||||
assert.equal(inputs[0].checked, true);
|
||||
assert.equal(inputs[1].checked, false);
|
||||
assert.equal(inputs[2].checked, false);
|
||||
assert.equal(inputs[3].checked, false);
|
||||
|
||||
assert.equal(inputs[4].checked, true);
|
||||
assert.equal(inputs[5].checked, false);
|
||||
assert.equal(inputs[6].checked, false);
|
||||
assert.equal(inputs[7].checked, false);
|
||||
|
||||
inputs[3].checked = true;
|
||||
await inputs[3].dispatchEvent(event);
|
||||
|
||||
assert.htmlEqual(p.innerHTML, `Checked: a,d`);
|
||||
|
||||
assert.equal(inputs[0].checked, true);
|
||||
assert.equal(inputs[1].checked, false);
|
||||
assert.equal(inputs[2].checked, false);
|
||||
assert.equal(inputs[3].checked, true);
|
||||
|
||||
assert.equal(inputs[4].checked, true);
|
||||
assert.equal(inputs[5].checked, false);
|
||||
assert.equal(inputs[6].checked, false);
|
||||
assert.equal(inputs[7].checked, true);
|
||||
|
||||
inputs[4].checked = false;
|
||||
await inputs[4].dispatchEvent(event);
|
||||
|
||||
assert.htmlEqual(p.innerHTML, `Checked: d`);
|
||||
|
||||
assert.equal(inputs[0].checked, false);
|
||||
assert.equal(inputs[1].checked, false);
|
||||
assert.equal(inputs[2].checked, false);
|
||||
assert.equal(inputs[3].checked, true);
|
||||
|
||||
assert.equal(inputs[4].checked, false);
|
||||
assert.equal(inputs[5].checked, false);
|
||||
assert.equal(inputs[6].checked, false);
|
||||
assert.equal(inputs[7].checked, true);
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,19 @@
|
||||
<script>
|
||||
let foo = [];
|
||||
</script>
|
||||
|
||||
<p>Checked: {foo}</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<input type='checkbox' bind:group={foo} value='a'>a<br>
|
||||
<input type='checkbox' bind:group={foo} value='b'>b<br>
|
||||
<input type='checkbox' bind:group={foo} value='c'>c<br>
|
||||
<input type='checkbox' bind:group={foo} value='d'>d<br>
|
||||
|
||||
<hr>
|
||||
|
||||
<input type='checkbox' bind:group={foo} value='a'>a<br>
|
||||
<input type='checkbox' bind:group={foo} value='b'>b<br>
|
||||
<input type='checkbox' bind:group={foo} value='c'>c<br>
|
||||
<input type='checkbox' bind:group={foo} value='d'>d<br>
|
||||
@ -0,0 +1,23 @@
|
||||
export default {
|
||||
html: `
|
||||
Hello
|
||||
<input />
|
||||
`,
|
||||
ssrHtml: `
|
||||
Hello
|
||||
<input value="Hello"/>
|
||||
`,
|
||||
async test({ assert, target, window }) {
|
||||
const input = target.querySelector("input");
|
||||
input.value = "abcd";
|
||||
await input.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
abcd
|
||||
<input />
|
||||
`
|
||||
);
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,10 @@
|
||||
<script>
|
||||
let a = [
|
||||
{ a: 'Hello' }
|
||||
];
|
||||
</script>
|
||||
|
||||
{#each a as { a }}
|
||||
{a}
|
||||
<input bind:value={a} />
|
||||
{/each}
|
||||
@ -0,0 +1,105 @@
|
||||
export default {
|
||||
html: `
|
||||
<div>
|
||||
Hello World
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
<div>
|
||||
Sapper App
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
`,
|
||||
|
||||
ssrHtml: `
|
||||
<div>
|
||||
Hello World
|
||||
<input value="Hello"/>
|
||||
<input value="World"/>
|
||||
</div>
|
||||
<div>
|
||||
Sapper App
|
||||
<input value="Sapper"/>
|
||||
<input value="App"/>
|
||||
</div>
|
||||
`,
|
||||
async test({ assert, target, window }) {
|
||||
const [input1, input2, input3, input4] = target.querySelectorAll("input");
|
||||
input1.value = "Awesome";
|
||||
await input1.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<div>
|
||||
Awesome World
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
<div>
|
||||
Sapper App
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
`
|
||||
);
|
||||
|
||||
input2.value = "Svelte";
|
||||
await input2.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<div>
|
||||
Awesome Svelte
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
<div>
|
||||
Sapper App
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
`
|
||||
);
|
||||
|
||||
input3.value = "Foo";
|
||||
await input3.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<div>
|
||||
Awesome Svelte
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
<div>
|
||||
Foo App
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
`
|
||||
);
|
||||
|
||||
input4.value = "Bar";
|
||||
await input4.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<div>
|
||||
Awesome Svelte
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
<div>
|
||||
Foo Bar
|
||||
<input />
|
||||
<input />
|
||||
</div>
|
||||
`
|
||||
);
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,14 @@
|
||||
<script>
|
||||
let a = [
|
||||
['Hello', 'World'],
|
||||
['Sapper', 'App'],
|
||||
]
|
||||
</script>
|
||||
|
||||
{#each a as a}
|
||||
<div>
|
||||
{a[0]} {a[1]}
|
||||
<input bind:value={a[0]}>
|
||||
<input bind:value={a[1]}>
|
||||
</div>
|
||||
{/each}
|
||||
@ -0,0 +1,64 @@
|
||||
export default {
|
||||
html: `
|
||||
<div>
|
||||
b: Hello
|
||||
<input />
|
||||
</div>
|
||||
<button>Button</button>
|
||||
`,
|
||||
ssrHtml: `
|
||||
<div>
|
||||
b: Hello
|
||||
<input value="Hello" />
|
||||
</div>
|
||||
<button>Button</button>
|
||||
`,
|
||||
async test({ assert, target, window }) {
|
||||
const input = target.querySelector("input");
|
||||
const button = target.querySelector("button");
|
||||
|
||||
input.value = "Awesome";
|
||||
await input.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<div>
|
||||
b: Awesome
|
||||
<input />
|
||||
</div>
|
||||
<button>Button</button>
|
||||
`
|
||||
);
|
||||
|
||||
|
||||
await button.dispatchEvent(new window.MouseEvent("click"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<div>
|
||||
c: World
|
||||
<input />
|
||||
</div>
|
||||
<button>Button</button>
|
||||
`
|
||||
);
|
||||
|
||||
assert.equal(input.value, 'World');
|
||||
|
||||
input.value = "Svelte";
|
||||
await input.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<div>
|
||||
c: Svelte
|
||||
<input />
|
||||
</div>
|
||||
<button>Button</button>
|
||||
`
|
||||
);
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,14 @@
|
||||
<script>
|
||||
let a = [
|
||||
{ a: { b: 'Hello', c: 'World' }, key: 'b' },
|
||||
];
|
||||
</script>
|
||||
|
||||
{#each a as { a, key }}
|
||||
<div>
|
||||
{key}: {a[key]}
|
||||
<input bind:value={a[key]}>
|
||||
</div>
|
||||
{/each}
|
||||
|
||||
<button on:click={() => a[0].key = 'c'}>Button</button>
|
||||
@ -0,0 +1,23 @@
|
||||
export default {
|
||||
html: `
|
||||
Hello
|
||||
<input />
|
||||
`,
|
||||
ssrHtml: `
|
||||
Hello
|
||||
<input value="Hello"/>
|
||||
`,
|
||||
async test({ assert, target, window }) {
|
||||
const input = target.querySelector("input");
|
||||
input.value = "abcd";
|
||||
await input.dispatchEvent(new window.Event("input"));
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
abcd
|
||||
<input />
|
||||
`
|
||||
);
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,10 @@
|
||||
<script>
|
||||
let a = [
|
||||
'Hello'
|
||||
];
|
||||
</script>
|
||||
|
||||
{#each a as a}
|
||||
{a}
|
||||
<input bind:value={a} />
|
||||
{/each}
|
||||
@ -0,0 +1,20 @@
|
||||
export default {
|
||||
html: `
|
||||
<span class="content">foo</span>
|
||||
<button>Test</button>
|
||||
`,
|
||||
async test({ assert, component, target, window }) {
|
||||
const button = target.querySelector("button");
|
||||
|
||||
const clickEvent = new window.MouseEvent("click");
|
||||
await button.dispatchEvent(clickEvent);
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<span class="content">bar</span>
|
||||
<button>Test</button>
|
||||
`
|
||||
);
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,12 @@
|
||||
<script>
|
||||
let obj = {
|
||||
prop: "foo"
|
||||
};
|
||||
|
||||
let arr = [obj]
|
||||
</script>
|
||||
|
||||
{#each arr as o}
|
||||
<span class="content">{o.prop}</span>
|
||||
<button on:click={ () => o = { ...o, prop: "bar" } }>Test</button>
|
||||
{/each}
|
||||
@ -0,0 +1,97 @@
|
||||
export default {
|
||||
html: `
|
||||
<button>Add</button>
|
||||
<span class="content">1</span>
|
||||
<button>Test</button>
|
||||
<span class="content">2</span>
|
||||
<button>Test</button>
|
||||
<span class="content">3</span>
|
||||
<button>Test</button>
|
||||
`,
|
||||
async test({ assert, component, target, window }) {
|
||||
let [incrementBtn, ...buttons] = target.querySelectorAll("button");
|
||||
|
||||
const clickEvent = new window.MouseEvent("click");
|
||||
await buttons[0].dispatchEvent(clickEvent);
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Add</button>
|
||||
<span class="content">2</span>
|
||||
<button>Test</button>
|
||||
<span class="content">2</span>
|
||||
<button>Test</button>
|
||||
<span class="content">3</span>
|
||||
<button>Test</button>
|
||||
`
|
||||
);
|
||||
|
||||
await buttons[0].dispatchEvent(clickEvent);
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Add</button>
|
||||
<span class="content">4</span>
|
||||
<button>Test</button>
|
||||
<span class="content">2</span>
|
||||
<button>Test</button>
|
||||
<span class="content">3</span>
|
||||
<button>Test</button>
|
||||
`
|
||||
);
|
||||
|
||||
await buttons[2].dispatchEvent(clickEvent);
|
||||
await buttons[2].dispatchEvent(clickEvent);
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Add</button>
|
||||
<span class="content">4</span>
|
||||
<button>Test</button>
|
||||
<span class="content">2</span>
|
||||
<button>Test</button>
|
||||
<span class="content">12</span>
|
||||
<button>Test</button>
|
||||
`
|
||||
);
|
||||
|
||||
await incrementBtn.dispatchEvent(clickEvent);
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Add</button>
|
||||
<span class="content">4</span>
|
||||
<button>Test</button>
|
||||
<span class="content">2</span>
|
||||
<button>Test</button>
|
||||
<span class="content">12</span>
|
||||
<button>Test</button>
|
||||
<span class="content">4</span>
|
||||
<button>Test</button>
|
||||
`
|
||||
);
|
||||
|
||||
[incrementBtn, ...buttons] = target.querySelectorAll("button");
|
||||
|
||||
await buttons[3].dispatchEvent(clickEvent);
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Add</button>
|
||||
<span class="content">4</span>
|
||||
<button>Test</button>
|
||||
<span class="content">2</span>
|
||||
<button>Test</button>
|
||||
<span class="content">12</span>
|
||||
<button>Test</button>
|
||||
<span class="content">8</span>
|
||||
<button>Test</button>
|
||||
`
|
||||
);
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,13 @@
|
||||
<script>
|
||||
let obj = {
|
||||
prop: "foo"
|
||||
};
|
||||
|
||||
let arr = [1, 2, 3]
|
||||
</script>
|
||||
|
||||
<button on:click={() => arr = [...arr, arr.length + 1]}>Add</button>
|
||||
{#each arr as o}
|
||||
<span class="content">{o}</span>
|
||||
<button on:click={() => { o *= 2; }}>Test</button>
|
||||
{/each}
|
||||
Loading…
Reference in new issue