chore: fix tests

props-id-anywhere
paoloricciuti 7 months ago
parent 662ee1ec5d
commit bbb5db1ef9

@ -3,25 +3,57 @@ import { test } from '../../test';
export default test({
test({ assert, target, variant }) {
const ps = [...target.querySelectorAll('p')].map((p) => p.innerHTML);
const unique = new Set(ps);
assert.equal(ps.length, unique.size);
if (variant === 'hydrate') {
const start = ps.map((p) => p.substring(0, 1));
assert.deepEqual(start, ['s', 's', 's', 's']);
if (variant === 'dom') {
assert.htmlEqual(
target.innerHTML,
`
<button>toggle</button>
<h1>c1</h1>
<p>c2</p>
<p>c3</p>
<p>c4</p>
`
);
} else {
assert.htmlEqual(
target.innerHTML,
`
<button>toggle</button>
<h1>s1</h1>
<p>s2</p>
<p>s3</p>
<p>s4</p>
`
);
}
let button = target.querySelector('button');
flushSync(() => button?.click());
const ps_after = [...target.querySelectorAll('p')].map((p) => p.innerHTML);
const unique_after = new Set(ps_after);
assert.equal(ps_after.length, unique_after.size);
if (variant === 'hydrate') {
const start = ps_after.map((p) => p.substring(0, 1));
assert.deepEqual(start, ['s', 's', 's', 's', 'c']);
if (variant === 'dom') {
assert.htmlEqual(
target.innerHTML,
`
<button>toggle</button>
<h1>c1</h1>
<p>c2</p>
<p>c3</p>
<p>c4</p>
<p>c5</p>
`
);
} else {
assert.htmlEqual(
target.innerHTML,
`
<button>toggle</button>
<h1>s1</h1>
<p>s2</p>
<p>s3</p>
<p>s4</p>
<p>c1</p>
`
);
}
}
});

@ -9,7 +9,7 @@
<button onclick={() => show = !show}>toggle</button>
<p>{id}</p>
<h1>{id}</h1>
<Child />
<Child />

@ -8,6 +8,7 @@ function increment(_, counter) {
var root = $.template(`<button> </button> <!> `, 1);
export default function Await_block_scope($$anchor) {
const $$cleanup = $.setup();
let counter = $.proxy({ count: 0 });
const promise = $.derived(() => Promise.resolve(counter));
var fragment = root();
@ -31,6 +32,7 @@ export default function Await_block_scope($$anchor) {
});
$.append($$anchor, fragment);
$$cleanup();
}
$.delegate(['click']);

@ -1,6 +1,7 @@
import * as $ from 'svelte/internal/server';
export default function Await_block_scope($$payload) {
const $$cleanup = $.setup($$payload);
let counter = { count: 0 };
const promise = Promise.resolve(counter);
@ -11,4 +12,5 @@ export default function Await_block_scope($$payload) {
$$payload.out += `<button>clicks: ${$.escape(counter.count)}</button> <!---->`;
$.await(promise, () => {}, (counter) => {}, () => {});
$$payload.out += `<!----> ${$.escape(counter.count)}`;
$$cleanup($$payload);
}

@ -13,6 +13,7 @@ const snippet = ($$anchor) => {
var root = $.template(`<!> `, 1);
export default function Bind_component_snippet($$anchor) {
const $$cleanup = $.setup();
let value = $.state('');
const _snippet = snippet;
var fragment = root();
@ -31,4 +32,5 @@ export default function Bind_component_snippet($$anchor) {
$.template_effect(() => $.set_text(text_1, ` value: ${$.get(value) ?? ''}`));
$.append($$anchor, fragment);
$$cleanup();
}

@ -6,6 +6,7 @@ function snippet($$payload) {
}
export default function Bind_component_snippet($$payload) {
const $$cleanup = $.setup($$payload);
let value = '';
const _snippet = snippet;
let $$settled = true;
@ -32,4 +33,5 @@ export default function Bind_component_snippet($$payload) {
} while (!$$settled);
$.assign_payload($$payload, $$inner_payload);
$$cleanup($$payload);
}

@ -3,5 +3,8 @@ import 'svelte/internal/flags/legacy';
import * as $ from 'svelte/internal/client';
export default function Bind_this($$anchor) {
const $$cleanup = $.setup();
$.bind_this(Foo($$anchor, { $$legacy: true }), ($$value) => foo = $$value, () => foo);
$$cleanup();
}

@ -1,5 +1,8 @@
import * as $ from 'svelte/internal/server';
export default function Bind_this($$payload) {
const $$cleanup = $.setup($$payload);
Foo($$payload, {});
$$cleanup($$payload);
}

@ -2,6 +2,8 @@ import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';
export default function Class_state_field_constructor_assignment($$anchor, $$props) {
const $$cleanup = $.setup();
$.push($$props, true);
class Foo {
@ -24,4 +26,5 @@ export default function Class_state_field_constructor_assignment($$anchor, $$pro
}
$.pop();
$$cleanup();
}

@ -1,6 +1,8 @@
import * as $ from 'svelte/internal/server';
export default function Class_state_field_constructor_assignment($$payload, $$props) {
const $$cleanup = $.setup($$payload);
$.push();
class Foo {
@ -14,4 +16,5 @@ export default function Class_state_field_constructor_assignment($$payload, $$pr
}
$.pop();
$$cleanup($$payload);
}

@ -4,6 +4,7 @@ import * as $ from 'svelte/internal/client';
var root = $.template(`<div></div> <svg></svg> <custom-element></custom-element> <div></div> <svg></svg> <custom-element></custom-element>`, 3);
export default function Main($$anchor) {
const $$cleanup = $.setup();
// needs to be a snapshot test because jsdom does auto-correct the attribute casing
let x = 'test';
let y = () => 'test';
@ -31,4 +32,5 @@ export default function Main($$anchor) {
);
$.append($$anchor, fragment);
$$cleanup();
}

@ -1,9 +1,11 @@
import * as $ from 'svelte/internal/server';
export default function Main($$payload) {
const $$cleanup = $.setup($$payload);
// needs to be a snapshot test because jsdom does auto-correct the attribute casing
let x = 'test';
let y = () => 'test';
$$payload.out += `<div${$.attr('foobar', x)}></div> <svg${$.attr('viewBox', x)}></svg> <custom-element${$.attr('foobar', x)}></custom-element> <div${$.attr('foobar', y())}></div> <svg${$.attr('viewBox', y())}></svg> <custom-element${$.attr('foobar', y())}></custom-element>`;
$$cleanup($$payload);
}

@ -3,6 +3,7 @@ import 'svelte/internal/flags/legacy';
import * as $ from 'svelte/internal/client';
export default function Each_string_template($$anchor) {
const $$cleanup = $.setup();
var fragment = $.comment();
var node = $.first_child(fragment);
@ -16,4 +17,5 @@ export default function Each_string_template($$anchor) {
});
$.append($$anchor, fragment);
$$cleanup();
}

@ -1,6 +1,7 @@
import * as $ from 'svelte/internal/server';
export default function Each_string_template($$payload) {
const $$cleanup = $.setup($$payload);
const each_array = $.ensure_array_like(['foo', 'bar', 'baz']);
$$payload.out += `<!--[-->`;
@ -12,4 +13,5 @@ export default function Each_string_template($$payload) {
}
$$payload.out += `<!--]-->`;
$$cleanup($$payload);
}

@ -2,6 +2,7 @@ import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';
export default function Function_prop_no_getter($$anchor) {
const $$cleanup = $.setup();
let count = $.state(0);
function onmouseup() {
@ -24,4 +25,6 @@ export default function Function_prop_no_getter($$anchor) {
},
$$slots: { default: true }
});
$$cleanup();
}

@ -1,6 +1,7 @@
import * as $ from 'svelte/internal/server';
export default function Function_prop_no_getter($$payload) {
const $$cleanup = $.setup($$payload);
let count = 0;
function onmouseup() {
@ -18,4 +19,6 @@ export default function Function_prop_no_getter($$payload) {
},
$$slots: { default: true }
});
$$cleanup($$payload);
}

@ -5,7 +5,9 @@ import * as $ from 'svelte/internal/client';
var root = $.template(`<h1>hello world</h1>`);
export default function Hello_world($$anchor) {
const $$cleanup = $.setup();
var h1 = root();
$.append($$anchor, h1);
$$cleanup();
}

@ -1,5 +1,8 @@
import * as $ from 'svelte/internal/server';
export default function Hello_world($$payload) {
const $$cleanup = $.setup($$payload);
$$payload.out += `<h1>hello world</h1>`;
$$cleanup($$payload);
}

@ -5,9 +5,11 @@ import * as $ from 'svelte/internal/client';
var root = $.template(`<h1>hello world</h1>`);
function Hmr($$anchor) {
const $$cleanup = $.setup();
var h1 = root();
$.append($$anchor, h1);
$$cleanup();
}
if (import.meta.hot) {

@ -1,5 +1,8 @@
import * as $ from 'svelte/internal/server';
export default function Hmr($$payload) {
const $$cleanup = $.setup($$payload);
$$payload.out += `<h1>hello world</h1>`;
$$cleanup($$payload);
}

@ -4,5 +4,7 @@ import * as $ from 'svelte/internal/client';
import { random } from './module.svelte';
export default function Imports_in_modules($$anchor) {
const $$cleanup = $.setup();
$$cleanup();
}

@ -2,5 +2,7 @@ import * as $ from 'svelte/internal/server';
import { random } from './module.svelte';
export default function Imports_in_modules($$payload) {
const $$cleanup = $.setup($$payload);
$$cleanup($$payload);
}

@ -5,6 +5,7 @@ var on_click = (_, count) => $.update(count);
var root = $.template(`<h1></h1> <b></b> <button> </button> <h1></h1>`, 1);
export default function Nullish_coallescence_omittance($$anchor) {
const $$cleanup = $.setup();
let name = 'world';
let count = $.state(0);
var fragment = root();
@ -29,6 +30,7 @@ export default function Nullish_coallescence_omittance($$anchor) {
h1_1.textContent = `Hello, ${name ?? 'earth' ?? ''}`;
$.template_effect(() => $.set_text(text, `Count is ${$.get(count) ?? ''}`));
$.append($$anchor, fragment);
$$cleanup();
}
$.delegate(['click']);

@ -1,8 +1,10 @@
import * as $ from 'svelte/internal/server';
export default function Nullish_coallescence_omittance($$payload) {
const $$cleanup = $.setup($$payload);
let name = 'world';
let count = 0;
$$payload.out += `<h1>Hello, ${$.escape(name)}!</h1> <b>${$.escape(1 ?? 'stuff')}${$.escape(2 ?? 'more stuff')}${$.escape(3 ?? 'even more stuff')}</b> <button>Count is ${$.escape(count)}</button> <h1>Hello, ${$.escape(name ?? 'earth' ?? null)}</h1>`;
$$cleanup($$payload);
}

@ -2,6 +2,8 @@ import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';
export default function Props_identifier($$anchor, $$props) {
const $$cleanup = $.setup();
$.push($$props, true);
let props = $.rest_props($$props, ['$$slots', '$$events', '$$legacy']);
@ -14,4 +16,5 @@ export default function Props_identifier($$anchor, $$props) {
props[a] = true;
props;
$.pop();
$$cleanup();
}

@ -1,6 +1,8 @@
import * as $ from 'svelte/internal/server';
export default function Props_identifier($$payload, $$props) {
const $$cleanup = $.setup($$payload);
$.push();
let { $$slots, $$events, ...props } = $$props;
@ -13,4 +15,5 @@ export default function Props_identifier($$payload, $$props) {
props[a] = true;
props;
$.pop();
$$cleanup($$payload);
}

@ -5,6 +5,7 @@ import * as $ from 'svelte/internal/client';
var root = $.template(`<p></p> <p></p> <!>`, 1);
export default function Purity($$anchor) {
const $$cleanup = $.setup();
var fragment = root();
var p = $.first_child(fragment);
@ -18,4 +19,5 @@ export default function Purity($$anchor) {
Child(node, { prop: encodeURIComponent('hello') });
$.append($$anchor, fragment);
$$cleanup();
}

@ -1,7 +1,10 @@
import * as $ from 'svelte/internal/server';
export default function Purity($$payload) {
const $$cleanup = $.setup($$payload);
$$payload.out += `<p>${$.escape(Math.max(0, Math.min(0, 100)))}</p> <p>${$.escape(location.href)}</p> `;
Child($$payload, { prop: encodeURIComponent('hello') });
$$payload.out += `<!---->`;
$$cleanup($$payload);
}

@ -4,6 +4,7 @@ import * as $ from 'svelte/internal/client';
var root = $.template(`<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1> </h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> <!> <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements></custom-elements></cant-skip> <div><input></div> <div><source></div> <select><option>a</option></select> <img src="..." alt="" loading="lazy"> <div><img src="..." alt="" loading="lazy"></div>`, 3);
export default function Skip_static_subtree($$anchor, $$props) {
const $$cleanup = $.setup();
var fragment = root();
var main = $.sibling($.first_child(fragment), 2);
var h1 = $.child(main);
@ -46,4 +47,5 @@ export default function Skip_static_subtree($$anchor, $$props) {
$.next(2);
$.template_effect(() => $.set_text(text, $$props.title));
$.append($$anchor, fragment);
$$cleanup();
}

@ -1,7 +1,9 @@
import * as $ from 'svelte/internal/server';
export default function Skip_static_subtree($$payload, $$props) {
const $$cleanup = $.setup($$payload);
let { title, content } = $$props;
$$payload.out += `<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1>${$.escape(title)}</h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> ${$.html(content)} <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements with="attributes"></custom-elements></cant-skip> <div><input autofocus></div> <div><source muted></div> <select><option value="a">a</option></select> <img src="..." alt="" loading="lazy"> <div><img src="..." alt="" loading="lazy"></div>`;
$$cleanup($$payload);
}

@ -11,6 +11,7 @@ function reset(_, str, tpl) {
var root = $.template(`<input> <input> <button>reset</button>`, 1);
export default function State_proxy_literal($$anchor) {
const $$cleanup = $.setup();
let str = $.state('');
let tpl = $.state(``);
var fragment = root();
@ -28,6 +29,7 @@ export default function State_proxy_literal($$anchor) {
$.bind_value(input, () => $.get(str), ($$value) => $.set(str, $$value));
$.bind_value(input_1, () => $.get(tpl), ($$value) => $.set(tpl, $$value));
$.append($$anchor, fragment);
$$cleanup();
}
$.delegate(['click']);

@ -1,6 +1,7 @@
import * as $ from 'svelte/internal/server';
export default function State_proxy_literal($$payload) {
const $$cleanup = $.setup($$payload);
let str = '';
let tpl = ``;
@ -12,4 +13,5 @@ export default function State_proxy_literal($$payload) {
}
$$payload.out += `<input${$.attr('value', str)}> <input${$.attr('value', tpl)}> <button>reset</button>`;
$$cleanup($$payload);
}

@ -2,10 +2,12 @@ import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';
export default function Svelte_element($$anchor, $$props) {
const $$cleanup = $.setup();
let tag = $.prop($$props, 'tag', 3, 'hr');
var fragment = $.comment();
var node = $.first_child(fragment);
$.element(node, tag, false);
$.append($$anchor, fragment);
$$cleanup();
}

@ -1,7 +1,9 @@
import * as $ from 'svelte/internal/server';
export default function Svelte_element($$payload, $$props) {
const $$cleanup = $.setup($$payload);
let { tag = 'hr' } = $$props;
$.element($$payload, tag);
$$cleanup($$payload);
}

@ -4,6 +4,7 @@ import * as $ from 'svelte/internal/client';
var root = $.template(`<p> </p>`);
export default function Text_nodes_deriveds($$anchor) {
const $$cleanup = $.setup();
let count1 = 0;
let count2 = 0;
@ -21,4 +22,5 @@ export default function Text_nodes_deriveds($$anchor) {
$.reset(p);
$.template_effect(($0, $1) => $.set_text(text, `${$0 ?? ''}${$1 ?? ''}`), [text1, text2]);
$.append($$anchor, p);
$$cleanup();
}

@ -1,6 +1,7 @@
import * as $ from 'svelte/internal/server';
export default function Text_nodes_deriveds($$payload) {
const $$cleanup = $.setup($$payload);
let count1 = 0;
let count2 = 0;
@ -13,4 +14,5 @@ export default function Text_nodes_deriveds($$payload) {
}
$$payload.out += `<p>${$.escape(text1())}${$.escape(text2())}</p>`;
$$cleanup($$payload);
}
Loading…
Cancel
Save